Elementor: Prevent Popup From Closing on Toggle Widget Click

You may find it difficult when having the toggle widget from Elementor within a popup. You will notice that every time you click on the text of the tab title in the toggle widget, it will close the popup that the widget is in. However, you can prevent the Elementor popup from closing on the toggle widget click by adding some Javascript code to your page. This is a great workaround, especially if you have FAQs within your Elementor popup.

To make this work, you will need to add an HTML widget to your page or within the popup somewhere. Copy the following code and paste it into your HTML widget:

<script>
jQuery( document ).ready(function( $ ){
$(".elementor-tab-title a").replaceWith(function() {
return "<span>" + this.innerHTML + "</span>";
});
});
</script>

What this code does is it targets the link within the toggle tab title and replaces it with a span. The main issue is that the link within the popup is set to close the popup by default. We need to then trick Elementor that there is no “<a>” tag, but instead a “<span>”. Now you should know how to prevent the Elementor popup from closing on the toggle widget click.

Additionally, you can add a little more code to style your span since it won’t look like the original tab title.