Menu item w/submenu, parent page above is NOT highlighted when a subpage below it is clicked

Hello everyone!

I’m seeking a code solution in regards to my issue:
In my menu I have one menu item with submenus, but the parent menu item itself does not have its own landing page because there’s no content for it and I don’t want a landing page only showing the same submenu items to choose from.
WIX has already confirmed, this is currently not possible and remains a feature request. What can I possible do code-wise, to have my menu so that the main item has no page (non-clickable), but still change state when sub links are clicked?

Currently I have this menu item set up where the submenu pages are in a folder as part of the main menu. But then when I click a sub link, the parent menu item doesn’t show a ‘clicked’ state (highlighted) when a sub link is opened, like the other menu items without submenus…

Please see attached screen grab for clarity…

Hello from the Wix DevRel Team!

This sounds like it should be possible with Velo and JavaScript. You would add a function that is called onMouseIn() when you hover over your button, and then change the color , backgroundColor , and any other details you wish to modify to be consistent with the rest of the menu. You probably also want to write a function that makes the “Programm” menu item brown with white text when the user is on any of the pages nested within that submenu. You should be able to accomplish this with the Page API.

Hope this helps!

Rob

@roba82587 Thank you for the quick reply!

I will def try my best to make it work on my own using your input, but I’m sure you wouldn’t mind a follow-up question in case I get stuck… :grinning:

@roba82587 Hey Rob!
I’m sorry but I guess I was overly optimistic, not being a coder with limited understanding of code trying to fetch together some info based on your input. But writing this myself is too tough… my brain just can’t tie all puzzle pieces together and produce only dysfunctional code snippets :grimacing:

I kinda thought I’d at least get the mouse-over code to work, but nope. Let alone the changed state when one of the nested pages is selected.

Wanna help a brother out with a few lines of code? If a have a base I’ll probably be able to adjust color settings to fit the menu :see_no_evil:

Pretty please :hugs:

@roba82587 Hello again!

Don’t want to stress you out, but I’m not sure if you have time to help me out or perhaps someone else in this community could throw a few lines of code on here for me adjust to my page?

At this state of my site, I have to see whether I can resolve the issue somehow or have to figure out an alternative for the menu I currently have…

Again, thanks a lot for any help!!! :smiling_face:

Hi @daflexxx ,

In your case, you have to rebuild a custom menu instead of making changes to the existing one.

However, it does not make huge impact the user.

Also, highlighting its parent menu item will cause user misunderstanding that the parent item can be clicked.

Only highlight clickable items is a correct way to work with UX.

Does it solve your question?

A little late, but i had the same problem.

We could fix it not by editing the code in the menu, but by adding an element to the header, and only showing it in specified urls, otherwise hidden it. It was much easier for us

Hope it helps someone else