这里有人使用Elementor吗？如何通过代码触发弹出窗口？例如。
function popup_call(){
...
if(....){
//trigger the popup here...
}
}
这个问题已经有答案了：
// accessible on window.elementorProFrontend
elementorProFrontend.modules.popup.showPopup( { id: 123 } );
https://github.com/elementor/elementor/issues/7077#issuecomment-595570337
或者尝试将弹出窗口绑定到按钮，使用 css 隐藏按钮
.yourbtn {
position: absolute;
width: 1px;
height: 1px;
padding: 0;
margin: -1px;
overflow: hidden;
clip: rect(0,0,0,0);
border: 0;
}
并使用带有js（jquery）的click
$('.yourbtn').click();
如果第二种方法对您有帮助，请不要忘记对屏幕阅读器隐藏该按钮 aria-hidden="true" 和 tabindex="-1"
Elementor 的 Popup 需要注册并触发。 这个主题可能对您有帮助。
使用 wp_footer 钩子来注册您的弹出窗口。
add_action( 'wp_footer', 'your_popup_function', 10, 5);
function your_popup_function(){
if(..assuming your condition is true..){
$popup_id = '2409'; //your Popup ID.
ElementorPro\Modules\Popup\Module::add_popup_to_location( $popup_id ); //insert the popup to the current page
?><script>
jQuery( document ).ready( function() { //wait for the page to load
/* You can do more here, this will just show the popup on refresh of page, but hey this is JQuery so you can do more things here depending on your condition to trigger the popup */
jQuery( window ).on( 'elementor/frontend/init', function() { //wait for elementor to load
elementorFrontend.on( 'components:init', function() { //wait for elementor pro to load
elementorFrontend.documentsManager.documents[<?php echo $popup_id ;?>].showModal(); //show the popup
} );
} );
} );
</script>;
<?php
}
return; //return nothing by default and do not show the popup.
}
阅读评论以获取更多说明。
对我来说，它与 Wordpress 5.7.2 和 elementor pro 3.2.1 的工作原理类似
function popup_call(){
...
if(....){
//trigger the popup here...
echo"<script> window.onload = function() {
elementorProFrontend.modules.popup.showPopup( {id:13000}, event); }
</script>";
}
}
只需设置ID即可
我不知道为什么你需要代码，如果你需要在点击时打开一个弹出窗口并且不在浏览器底部显示网址（就像 a 标签一样），请尝试“自定义类”。
https://github.com/sukiwp/popup-trigger-url-for-elementor-pro
您需要将弹出窗口的显示条件设置为您希望弹出窗口显示的页面。否则，您的弹出窗口将不会显示。
Elementor 弹出事件目前仅支持 jQuery。如果您需要 Vanilla Js 解决方案，请检查以下内容：https://eduardovillao.me/handle-elementor-popup-events-without-jquery/
// Select the <body> element
const body = document.body;
// Create a MutationObserver
const observer = new MutationObserver((mutations) => {
mutations.forEach((mutation) => {
// Check if new nodes were added
if (mutation.type === "childList") {
mutation.addedNodes.forEach((node) => {
// Check if the added node is an Elementor popup modal
if (node.classList && node.classList.contains("elementor-popup-modal")) {
console.log("Elementor popup detected:", node);
// Add your custom logic here
}
});
}
});
});
// Configure the observer to monitor the <body>
observer.observe(body, { childList: true });
// Stop observing when no longer needed (optional)
// observer.disconnect();