Archived topic
Off canvas menu on mobile — Make menu items function like arrows
7 replies · Started by softrainwall on December 3, 2020
I use primary menu for desktop and off canvas menu for mobile.
I use “#” URL for all parent items in my off canvas menu and it works almost exactly as I want with one exception: clicking on the menu item itself doesn’t close all other submenus that are opened, only clicking on its arrow does. I want to make my “#” menu items close all other dropdowns on click too, because in my case, being able to open more than one dropdown at a time can make the menu look confusing and lead to an uncomfortable amount of scrolling.
I was able to achieve this by selecting “Click - Menu item” option in Layout -> Primary Navigation -> Navigation Dropdown. However, I only want this for my mobile off-canvas menu, and this option obviously affects my desktop menu as well (which I want to keep as is, with dropdowns on hover).
Hi there,
I wonder if this might help?: https://generatepress.com/forums/topic/slide-out-menu-close-sub-menu-items/
Let me know :)
Just tried it on both desktop and mobile, and it doesn't seem to work. The hook does appear in the page's source so I'm guessing I've added it correctly.
Hi there,
can you share a link to the site with that code added so we can see whats going on?
Sure, I'm including a link to the site & login credentials in the private info field. I've also temporarily enabled off-canvas menu on desktop for testing
Can you try the updated code?: https://generatepress.com/forums/topic/slide-out-menu-close-sub-menu-items/#post-795721
It works now! Thank you for help :)
You're welcome :)
