For one-page websites, ensuring smooth navigation is key to providing a seamless user experience.
If you're using Divi's slide-in menu, you might notice that it doesn't automatically close when a menu item is clicked. This can be inconvenient for users, especially on mobile devices.
This article will guide you through the steps to configure the Divi slide-in menu to automatically close when a menu item is clicked, enhancing the usability and flow of your one-page site.
Go to WordPress Dashboard → Divi → Theme Options → Integrations Tab
Add the following jQuery script:
<script>
(function ($){
$(document).ready(function () {
var menuItem = $('.menu-item a');
menuItem.each(function () {
$(this).bind('click', function () {
$('#et-top-navigation .mobile_menu_bar').trigger('click');
})
})
});
})(jQuery)
</script>Save your changes.
Each time a menu item is clicked the Divi Slide-In Menu will automatically close.