Adding focus to an ASL search box in an Elementor popup window

Hi,

Well, this one needs a bit of custom code for sure. It depends on the exact implementation, but the below code should work with generic Elementor Popups triggered by a popup button.

Try adding this code to the functions.php file in your theme/child theme directory – make sure to have a full server back-up first for safety. For more details you can check the safe coding guidelines.

add_filter('wp_footer', 'asl_focus_on_elementor_popup_open', 10);
function asl_focus_on_elementor_popup_open() {
  ?>
  <script>
  jQuery(function($) {
    var t;
    $('.elementor-button').on('click touchend', function() {
      clearTimeout(t);
      t = setTimeout(function() { 
          $('.elementor-location-popup input.orig').get(0).focus(); 
      }, 500); 
    });
  });
  </script>
  <?php
}

All the best,
Ernest M.

Hi,

Not sure if I’m breaking forum decorum with this, but I don’t want to add another thread for the exact same topic.

I’d love to add ASL focus to Kadence, but I’ve tried all of the code snippets Ernest has posted previously and none have worked so far. Is there something peculiar about the Kadence theme?

Thanks in advance

Actually, scratch that!

I’ve gotten around it by adding the shortcode to my navigation menu, which is exactly what I wanted. Looks great on mobile too.

Made possible by Shortcode in Menus

Thank you, Ernest, for your fast response.

Unfortunately, I am not able to get this code to work.

Do I need to replace any of the generic variables with my local ones? Or any other substitutions?

Thanks

@wpquizzical No, it should work out of the box, if the DOM selectors in the code are correct – which I guess is the issue.
Can I take a look at the pop-up button somewhere? The class selector names are very likely different, and if I can see the setup I might be able to suggest a correction.