Studio Editor: Adding and Managing New Menus
9 min
In this article
- Adding a menu
- Managing menu items
- Creating dropdowns
- Switching the menu to a different layout
- Displaying multiple menus on the same site
Add our latest menu element to streamline your site-building process while enhancing navigation for your client's visitors. Choose the best layout for each breakpoint – horizontal, vertical or a hamburger menu. Switching between layouts is straightforward, so you can adjust on the fly as your design evolves.
Manage the menu items as needed by adding, removing and reordering the items. You can use dropdowns to display submenus with your own content, giving you the ability to create a tailored experience that fits your client's needs.
Important:
This article refers to the new menu element in the Studio Editor. For steps on managing the previous menu experience, please click here.
How do I know which menu I have?
.
Adding a menu
Add a menu to the site to get started. We recommend adding a menu to the site header, but you can add and set up as many as you need to tailor the experience for different pages and sections.
Once you add the menu, choose the items you want it to display (e.g. site pages, links, etc).
To add a menu:
- Click Add Elements on the left side of your editor.
- Select Menu & Search.
- Select the menu type you want:
- Horizontal Menus: These advanced menus offer tons of unique customization options. You can tailor them to your exact needs, adjusting the layout and design of every single area.
- Vertical Menus: Vertically arranged menus that look great on the right or left sides of websites.
- Hamburger Menus: Minimalist, space-saving menus where the menu items are only displayed when visitors click the menu icon. The menu has an open and closed state.
- Click the menu and drag it to the desired position on the page.
- Add items to the new menu:
- Select the menu you just added.
- Click Manage Menu.
- Click + Add Item at the bottom.
- Select the item you want to add:
- Main pages: Add a regular site page to the menu.
- Dynamic and app pages: Add pages from apps (e.g. a Wix Stores product page), or pages connected to collections in CMS.
- Link: You can add many kinds of links to the menu, such as links other websites, anchors on site pages, your client's contact details, etc.
- Dropdown: Add a container that appears below the menu when visitors hover over the item. You can design it as needed, and use it to display menu items and additional content.
on the left side of your editor.Changed your mind about the menu layout (type)?
Don't worry - you can always change it later.
Managing menu items
You can always adjust an existing menu and the items it shows. Add more items, remove ones that are irrelevant, or change the order to keep the content fresh.
To manage a menu:
- Select the relevant menu in your editor.
- Click Manage Menu.
- Choose what to do next:
Add more menu items
Change a menu item's link
.Rename a menu item
Remove or delete an item
Reorder menu items
next to an item and drag it to the desired position.
Creating dropdowns
There are 2 ways to create dropdowns in a menu, depending on what you want the title to be:
- An existing menu item: Decide on an existing item (page or link) from the menu to show the dropdown when visitors hover over it.
- A title that is not clickable: Add a dropdown title that does not lead to any page. When visitors hover over it, the dropdown container opens.
Tip:
Dropdowns were called mega menus in the previous menu experience.
To add and set up a dropdown:
- Select the relevant menu in the editor.
- Click Manage Menu.
- Choose what you want to do:
- Use an existing menu item:
- Drag a menu item to move it below the item you want as the dropdown title.
- Hover over the same item and click the More Actions icon .
- Select Move under "Page Name".
- Repeat steps a - c for all other items.
- Create a new dropdown:
- Click + Add Item.
- Select Dropdown.
- Enter the title for the dropdown.
- Press the Enter key on your keyboard to save your changes.
- Drag and drop menu items under the dropdown to add them.
- Repeat step e for all other items you want to add.
- Use an existing menu item:
. 
Switching the menu to a different layout
Use the layout settings to choose the menu type you want - a horizontal or vertical navigation bar, or a hamburger menu.
To set the layout:
- Click the menu in your editor.
- Click the Layout icon .
- Select the menu type:
- Navigation bar: Menu items are displayed in a bar. Under Orientation, choose whether the bar is horizontal or vertical.
- Hamburger: An icon is displayed. When site visitors click the icon, the menu opens.
.
Did you know?
You can choose a different menu layout per breakpoint following the steps above. For example, go for a minimal hamburger menu for the smaller breakpoints.
Displaying multiple menus on the same site
You can create as many menus as you need and show completely different items in each.
After adding a new menu element, you can choose which menu it should display: An existing menu that you saved, or a new one that you create on the spot. This means you can save menus and reuse them on various menu elements across the site.
Click below to learn how to:
Choose which menu is displayed on a page
Save a new menu
at the top right.Display different menu items on different breakpoints
