Wix studio: how to change the opening direction of hamburger menu

Ask the community
, ,
1

Question:
Is there an option to change the direction on how a hamburger menu opens?

Product:
Wix studio

What are you trying to achieve:
I would like to change the direction of how a hamburger menu opens.
the default is right to left,
but I want to change to “left to right”

What have you already tried:
checked on the web and saw there was a such option on wix editor

If anybody could help, I would be grateful!
Thank you.

2

unfortunately it is not possible with the out-of-box mobile menu.
You need to build a custom menu to get it to slide from the left.

The mobile menu’s behavior is determined by the Wix platform and is designed to provide a consistent user experience across all Wix sites.

Here’s a simple example of how you could implement this:

  1. Add a button to your page that will act as the custom hamburger menu. Give it an ID, for example, “customHamburgerButton”.
  2. Add a box to your page that will act as the custom mobile menu. Give it an ID, for example, “customMobileMenu”. Set its initial visibility to hidden in the Properties panel.
  3. Add your menu items to the “customMobileMenu” box. You can use text elements, buttons, or any other suitable elements as menu items.
  4. Add the following code to your page code:
$w.onReady(function () {
  // When the custom hamburger button is clicked
  $w("#customHamburgerButton").onClick(() => {
    // Check if the custom mobile menu is currently collapsed
    if($w("#customMobileMenu").collapsed) {
      // If it is, expand it
      $w("#customMobileMenu").expand();
    } else {
      // If it's not, collapse it
      $w("#customMobileMenu").collapse();
    }
  });
});

This code will make the “customMobileMenu” box appear and disappear when the “customHamburgerButton” is clicked, creating a slide-out menu effect. You can customize the appearance and contents of the “customMobileMenu” box to suit your needs.

Remember, this is a workaround and not a direct way to change the direction of the built-in mobile menu in Wix. It might not work perfectly in all situations, but it can give you more control over the behavior of the mobile menu.

3

Thank you very much for giving a such precise explanation!
That’s a shame they did’t keep the option on wix studio
I will try the code!

Thank you very much again!
YUKA

4

It has been mentioned a few times. I’m sure it will be added at some stage.