Wix Editor: Adding and Setting Up a Vertical Menu
In this article
- Adding a vertical menu
- Customizing the menu design
- Adjusting the layout of a menu
Vertical menus are a clean, sophisticated way for visitors to navigate your site. There are a range of templates available, and you can customize to create something that is both eye-catching and informative.
Adding a vertical menu
Add a vertical menu from the Editor to get started in creating something that encourages interaction and attention from your site visitors.
To add a vertical menu:
- Click Add Elements
on the left side of the editor.
- Select Menu & Anchor.
- Select Vertical Menus.
- Click or drag your chosen menu to add it to your site.
Customizing the menu design
Use the customization options to design your menu exactly the way you'd like. The menu has three separate states - regular, hover, and clicked. You can customize each state individually to suit your site's needs.
- Regular: How the menu is displayed on your site before a visitor has interacted with it.
- Hover: How the menu looks while a cursor is hovering over it.
- Clicked: How the menu looks once a visitor has clicked on it.
To customize the menu design:
- Click the Design icon
.
- Click Customize Design.
- Select the menu state you wish to work on (Regular, Hover, or Clicked).
- Choose from one of the below options to adjust its settings:
- Fill Color and Opacity: Choose the menu's fill color and adjust its opacity.
- Border: Adjust the menu's border width and color.
- Corners: Adjust how curved the corners of your menu and dropdown menus are.
- Shadow: Add a shadow, and adjust its angle, size, blur, color, and distance.
- Text: Edit the menu's text settings, such as font, size, and format.
- Spacing: Adjust the menu's spacing and offset using the sliders.
Adjusting the layout of a menu
You can adjust the layout of the menu to further fit your site's feel and aesthetic. You can change the way your menu's items are aligned, and choose whether the dropdown menu opens to the left or the right.
To adjust the menu layout:
- Click the Layout icon
.
- Choose from the following options:
- How are items aligned?: Select whether the menu items are aligned to the left, right, or center.
- How do dropdowns open?: Select whether dropdown menus open to the left or the right.
