Feature request. Mobile menu minimize

Howdy! just a quick feature request, for the mobile menu, at the moment, on a scrolling site say, you click a menu item, it scrolls to said area, but the menu stays collapsed, and cover the page. I feel this should minimize once it scrolls to the area.

I have this code:

jQuery(document).ready(function($){
	$('.x-one-page-navigation-active .x-navbar .mobile .x-nav > .menu-item:not(.menu-item-has-children)').on('click touchend', function(e) {
		document.getElementsByClassName("x-btn-navbar")[0].click()
	});
});

on this site: https://bestronger.se/ (and it works) and here https://www.logoglo.com/ (works)

But I added the same code here: https://kaatnah.com.mx/inicio/ and it doesnt work, any ideas why?

But yeah, to avoid conflicts like this, it should be an option.

Thanks.

Hi @logoglo,

Thanks for reaching out!

I will add this feature request to our tracker so that it will be taken into action in the future. On the other hand, there could be a plugin conflict that’s it is now working on your new website. I suggest that you do this troubleshooting step.

Hope that helps and let us know how it goes.

Thanks for the quick reply, I disabled all plugins, and emptied the cache, but the problem persists.

Hey @logoglo,

Would you mind sharing your admin credentials so that we can your backend settings? Please keep in mind that integrating custom script is outside the scope of our theme support, we just to check if there’s something we can do on our end. To do that, please give us the following information in a Secure Note.

  • WordPress Login URL
  • Admin level username and password

You can find the Secure Note button at the bottom of your posts.

Thank you.

Sure thing, here ya go.

Hi @logoglo,

It was working on that site because those sites have the x-one-page-navigation-active class in the Body tag. Whereas https://kaatnah.com.mx/inicio/ does not have it, for that you need to change the JavaScript code a little and it looks like the following one.

jQuery(document).ready(function($){
    $('.x-navbar .mobile .x-nav > .menu-item:not(.menu-item-has-children)').on('click touchend', function(e) {
        document.getElementsByClassName("x-btn-navbar")[0].click()
    });
});

Please remember that the above code will work if copied as it is and doesn’t conflict with any existing style.
Please note that the code provided serves only as a guide to help you get started custom coding on your own if there’s no option offered in our theme or the products we bundle.
We really do not provide support for custom codes which means we can’t fix it in case it conflicts with something on your site nor will we enhance it.

Thanks

That worked perfectly, thank you!

Hi @logoglo,

You’re welcome! If you have any other concerns or clarifications regarding our theme features, feel free to open up a new thread.

Thank you.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.