Mega Menu - Linking the main button

Can you link the main button on the Mega menu? I only see that you can hover over it and it shows the mega menu, but I’d also like for people to be able to just click on the main mega menu item to go to a page.

2 Likes

I’m having the same issue and cannot find a solution to this.

Same issue, did anyone get a solution?

Hey!

It’s not currently possible out of the box, but with a little bit of Velo, you can achieve the desired outcome :muscle:

Here’s the foundation of the code:

$w("#horizontalMenu1").onItemClick((event) => {
    let label  = event.item.label
    if(label === "Mega Menu") {
        //action
    }
})

And a quick video to show how to get it setup.


And finally, here’s a short summary of what’s happening in the video:

  • The code is run in the masterpage.js file (which means it runs on all pages)
  • When a menu item is clicked, it will get it’s label. If the label matches one of the conditions, it will run that condition.
  • What we’re doing in the video is this:
    • If the label clicked is “Mega Menu”, then use wixLocationFrontend to move to the page that has a slug of “/mega-menu”
    • If the label clicked is “Services”, then use wixLocationFrontend to move to the page that has a slug of “/services”

(Worth noting that the conditions are case sensitive - so if the menu label is “Mega Menu”, it should be that in the code. Not “mega menu”, “Mega menu” etc.)

Hope this helps - and I’ve also shared this feedback with the team :slight_smile:

2 Likes

Hi Noah do we have an ETA when this will be available without no code?

Should be available now with the New Menus in Studio :raising_hands:

2 Likes

So excited for this!