Are you looking to create a side menu in Elementor? A side menu is a navigation menu that appears on the side of the page, giving visitors quick access to different sections or categories of your site. This type of menu works especially well on e-commerce sites or large content sites with many post categories.
With the Navigation Menu widget in The Plus Addons for Elementor, you can add a vertical sidebar menu or sidebar toggle menu directly in the Elementor editor.
Best Used For:
- E-commerce sites with multiple product categories that need persistent sidebar navigation
- Large content websites or blogs with many post categories
- Service or portfolio sites using full-page or scrolling layouts
To check the complete feature overview documentation of The Plus Addons for Elementor Navigation Menu widget, click here.
Requirement – This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.
To do this, add the Navigation Menu widget to the sidebar or a page template and follow the steps –
Note: To create the template, you can use the free Nexter Builder or you can use Elementor Pro if you are already using it.
1. From the Menu Type dropdown, select the appropriate option for your navigation source.
2. Then select Vertical SideMenu from the Menu Direction section. This sets the menu to display vertically along the side of the page.
3. From the Content tab, choose the submenu open direction from the Open Direction dropdown. Use this when your menu has nested items and you need to control which direction the submenu expands.
4. Finally, select or create the menu depending on the option selected in the Menu Type dropdown.
From the available options, select the appropriate submenu hover event and effect.
By enabling the Vertical Side Title Bar toggle, you add a collapsible toggle bar for the menu. This is useful when you want the side menu to remain hidden by default and only open when the visitor clicks or hovers over the toggle.
Did you know? You can create a menu with repeater in Elementor.
From the Title Bar Hover/Click dropdown, set the behavior that opens the toggle menu. You will find three options –
- Normal – To always show the menu.
- Hover – To show the menu on hover.
- Click – To show the menu on click. Use this when you want visitors to intentionally open the side menu rather than having it appear automatically.
In the Title field, change the toggle bar title text. In the Title Link field, add a URL to make the toggle bar title clickable.
From the Prefix Icon and Postfix Icon sections, change the icons that appear on the toggle bar before and after the title.
For advanced multi-column navigation panels, see how to create a mega menu in Elementor as another layout option with the Navigation Menu widget.
Now you will see a sidebar menu on your page.
Also, read how to create a vertical menu in Elementor.
