Mega Menu with Multiple Tabs in Editor X using Multi-State Boxes

Ask the community
1

I’m creating a Mega Menu in Editor X using Multi-State Boxes. I’ve made significant progress but am facing difficulties, so I hope you guys can help. I’ll walk you through what I’ve done. Please bear with me, I’m new to Editor X, let alone coding, so my terminology might not be spot on, but hopefully, you’ll get the gist of what I’m saying.

Summary

  1. I relied on this https://youtu.be/jxiTE6vKbxw for guidance.

  2. I created a menu at the top of the page using buttons.

  3. I created a multistate box by turning on the developer mode

  4. I used code to connect the buttons to the multistate box

  5. My published site, https://www.overbrookdesign.com/ is n ot displaying the mega menu properly. :thinking:

Buttons Details

  1. In Dev Mode every menu button has an ID#.

  2. For example

  3. The Furniture Button ID# is #furniturebutton

  4. The Outdoors Button ID# is #outdoorsbutton

Multistate Box Details

  1. I created a section just below the menu buttons called megamenusection

  2. In megamenusection I inserted a multistate box and called it megamenumultistatebox1

  3. Megamenumultistatebox1’s ID# is #megamenumultistatebox1

  4. This multistate box has 3 states (once the kinks are ironed out there will be additional states to access other buttons on the menu.)

  5. emptystate

  6. furniturestate

  7. outdoorsstate

  8. Each state has an ID#

  9. #emptystate

  10. #furniturestate

  11. #outdoorsstate

  12. Each state can be viewed in editor mode

  1. emptystate

3820×1849 222 KB

  1. furniturestate

3831×1870 352 KB

  1. outdoorsstate

3822×1866 429 KB

Coding Details

The code is on the masterpage, loading on every page.

1308×1055 77.4 KB

Thank you in advance for any support you can provide, it’s appreciated.

Ira

2

there code be issues with code, since the changestate method of the Multistate box element is not being called correctly. You need to pass the state name as a string, enclosed in quotes, here is the code fixed which might be edited by you and work, but in case it still won’t go for good, please contact our Velo Customer Care for more personalized investigation, since they are more capable of resolving code related queries: https://support.wix.com/en/article/contacting-wix-customer-care-for-support

$w.onReady(function () {
    initmegamenu();
});

function initmegamenu() {

    $w('#furniturebutton').onClick(() => {
        openrelevantmenu('Furniturestate');
    });

    $w('#outdoorsbutton').onClick(() => {
        openrelevantmenu('Outdoorstate');
    });
}

function openrelevantmenu(stateName) {
    $w('megamenumultistatebox').changeState(stateName);
}
3

Andrew,

Thank you for your feedback. I tried your suggestion, but unfortunately, it did not work. Nevertheless, I really appreciate your effort and timely feedback. So, thank you.

P.S. I’m going to take your advice and contact Velo Customer Care.

Best Wishes,
Ira

4

The Velo team has been unresponsive to my my support request.

5

Hey!

Sorry to hear this has been your experience. If it’s all good with you, I’ll reach out to you via the email address attached to your profile here to get some more details