Tổng hợp Tips Elementor

1. Show Popup Elementor bằng JS

// accessible on window.elementorProFrontend
elementorProFrontend.modules.popup.showPopup( { id: 123 } );

Nếu dòng trên không được, bạn có thể thử như sau:

jQuery(window).on('elementor/frontend/init', function() {
  elementorFrontend.on( 'components:init', function() {
    elementorFrontend.documentsManager.documents[123].showModal();
  });
});

Lưu ý: 123 là id của Popup, thay 123 bằng con số chính là ID của Popup mà bạn muốn show.

2. Vừa print Popup vừa dùng JS để show.

// add the popup to the page 
add_action( 'wp_footer', function() { 
	// set popup id
	$popup_id = '123';
	// insert the popup to the current page
	ElementorPro\Modules\Popup\Module::add_popup_to_location( $popup_id );
	
	?><script>
	 // wait for the page to load
	jQuery( document ).ready( function() {
		 // wait for elementor to load
		jQuery( window ).on( 'elementor/frontend/init', function() {
			// wait for elementor pro to load
			elementorFrontend.on( 'components:init', function() {
				 // show the popup
				elementorFrontend.documentsManager.documents[<?php echo $popup_id ;?>].showModal();
			} );
		} );
	} );
	 </script>;
	 <?php
 } );

3. Thực hiện hành động gì đó sau khi Popup show/hide

jQuery( document ).on( 'elementor/popup/show', ( event, id, instance ) => {
	if ( id === 123 ) {
		// do your tracking here
	}
} );

jQuery( document ).on( 'elementor/popup/hide', ( event, id, instance ) => {
	if ( id === 123 ) {
		// do your tracking here
	}
} );