Close your Pop-Up Menu on Link Click

For those using same page links.

To begin with, insert an HTML element in the same popup as your menu

This will make Elementor close popup on click. After adding the code.

Elementor Close PopUp on Click for Menu & Same Page Links

Then, copy the code below in it

<script>
jQuery(function($){
$(document).on('click','.elementor-location-popup a', function(event){
elementorProFrontend.modules.popup.closePopup( {}, event);
});
});
</script>

Finally, verify that it is working fine

That's it! Short and simple! Thanks for reading!

37 Responses

  1. Definitely... live sarver! Would you please help me getting it to close only on specific buttom click.
    I´ve modified it by adding the Button Name "yes" before click for it to close only on this specific button click and do something else on the second one.

    <script>
    jQuery(function($){
    $(document).on('yes.click','.elementor-location-popup a', function(event){
    elementorProFrontend.modules.popup.closePopup( {}, event);
    });
    });
    </script>

    Thanks in advance for all your help!

    1. Hey Juan! your code attempt won't work, as 'click' is the event listener, not the selector. $(document) is what need to be replaced.

      Give your button the CSS class 'yesclick' , the use that code:

      <script>
      jQuery(function($){
      $('.yesclick').on('click','.elementor-location-popup a', function(event){
      elementorProFrontend.modules.popup.closePopup( {}, event);
      });
      });
      </script>

    1. You didn't copy paste the code properly. You have all kind of spaces in there, where they should not be, and that's why it's not working... rewrite it like this precisely, no spaces:

      <script>
      jQuery(function($){
      $(document).on('click','.elementor-location-popup a', function(event){
      elementorProFrontend.modules.popup.closePopup( {}, event);
      });
      });
      </script>

      1. Use the Elementor html element (with the icon) , not the one with the WordPress icon

      2. Hey man, I need your help haha. I created a popup menu and when I use your code, everything works fine, but when I have one more popup like WhatsApp icon where to open a other menu, when I click on it icon, its close.

        Well, How can I close a specific Section on elementor using your code?

      3. Good question!

        Here is how, simply change this line here :

        elementorProFrontend.modules.popup.closePopup( {}, event);

        to

        elementorProFrontend.modules.popup.closePopup( {id:498}, event);

        Then, change '498' to the actual ID of your popup. You can find it by looking at the URL when you are in the Elementor editor.

  2. Thanks for this! I've tried doing this, however after adding my pop-up still doesn't close and infact the close button/clicking out of overlay doesn't close the pop-up.

    Would you have any ideas as to why it's not working? It's the first link on the pop-up and I have this showing on mobile only

    staging3.entertainairs.com

  3. Hey! This seems simple enough, but I'm struggling a bit to find where I need to add the HTML element. Would appreciate your help 🙂

    Thanks in advance!

  4. I am trying to get this to work but nothing happens. I have a button on a page which loads an elementor popup with a form. When the user submits the form it loads a thank you popup to say I have received the form. The user can then close that popup with a click but the original popup is still there. I put this code into an HTML widget on the original popup template but when I click on the form submit button nothing happens to close the popup.
    Can anyone help as its driving me nuts!

  5. hello dear guys

    how can i use this code for a specific popup? the problem is this code close all the popups on the page .... ?

    i am not god at programing, can someone help me please ?

  6. Hi Bro, It was a headache, I was having a problem with elementor pro popup so I switched to jet-popup. The problem is this js code is not working with my popup. Can you give me a new piece of code? This popup is located in the article table of contents button. I want when I click on any anchor area on the popup it will jump to that anchor and disappear the popup. Sorry for using google translate, because I'm not good at this language, I'm from Vietnam. Thank you very much.

    Link : https://bit.ly/3yFw69k

Leave a Reply