I'm looking for some help to make the burger menu items on the mobile/tablet version of my website (Brooklyn theme) to act differently.
What I'm trying to do is to make the menu items with links '#' (for them not to link to an actual page) to act as expandable menus on the click, just like the '+'/'-' signs currently do. I want this change because I think it can be confusing for the customers if clicking on the name of the item does nothing, but clicking on the '+' sign expands the submenu. Here's an illustration:
I circled the menu item in green which I want to act the same way as the item circled in light blue. Currently the names 'Sustainability' and 'Our world' do nothing when clicked (because the link is '#'), but I want them to expand/contract the submenu just like the '+' and '-' accordingly.
On the desktop version this issue is not relevant, as the submenu expands when hovering on the items.
You can use apps like Globo Mega Menu to do this. If you are working on it the first time, you might need to get used to the interface. But this app offers what you are looking for.
If you are ok, feel free to get in touch with me and I'd be happy to fix this for you in no time. It will save your time also.
Hope that helps.