Как закрыть всплывающее окно Elementor на мобильном телефоне после нажатия меню

Rifat Бизнес Jan 5, 2023

Всплывающие формы могут стать отличной частью вашей маркетинговой стратегии, если вы знаете, как правильно их использовать. Они могут помочь вам получить адреса электронной почты, увеличить продажи и многое другое. Но не всегда легко сделать всплывающие окна в WordPress, которые хорошо выглядят и имеют уникальный формат. Elementor , плагин для создания веб-страниц, упрощает процесс создания и изменения всплывающих окон для вашего сайта. Вы можете изменить их, чтобы они выглядели так, как вы хотите, и активировать дополнительные триггеры на основе действий пользователя или географического положения. Однако при создании одностраничного веб-сайта у вас могут возникнуть проблемы с якорными ссылками, поскольку страница будет прокручиваться до раздела, но всплывающее окно не закроется само по себе. Чтобы это исправить, давайте сделаем так, чтобы при нажатии на ссылку или якорь всплывающее окно само закрывалось.

Закрыть всплывающее окно в меню Якорная ссылка jQuery Snippet Code

Добавление пользовательского сценария jQuery для обнаружения щелчка и закрытия всплывающего окна при его появлении необходимо для корректного закрытия всплывающего окна на мобильных устройствах после нажатия на ссылку.

Для начала перейдите в Elementor > Пользовательский код.

Нажмите кнопку «Добавить новую», а затем дайте своему пользовательскому фрагменту кода описательное имя, например «исправление всплывающего меню» или что-то подобное.

Внесите изменения, вставив этот код в область.

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

Чтобы сделать фрагмент доступным на страницах или в указанных вами категориях, поместите его в тег /head> и нажмите «Опубликовать».

Заключение

Всплывающее меню Elementor может создать некоторые проблемы с закрытием всплывающего меню. Этот фрагмент jQuery должен выполнять свою работу, когда вам нужно закрыть всплывающее меню для мобильных устройств. Пожалуйста, поделитесь своими мыслями и опасениями в разделе ниже.

Divi WordPress Theme