Off Canvas sidebar with a WordPress menu inside that can include icon links and a search bar. Use the toggle button to open the side menu and the close icon to close it.
Install The Side Menu Widget for Elementor #
This widget requires Unlimited Elements PRO version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Side Menu”
- Hover over the widget in the search results and click install
- Add your Side Menu widget to any Elementor Page
General Settings #
Menu
Select a menu from your WordPress website that you want to output in the widget.
Max Depth
Select the maximum number of submenu items depth level you want your menu to show.
Menu Side
Choose where you want to open your side menu. Left or Right.
Menu Open Speed
The speed of the animation the menu opens in.
Show Overlay
Add an overlay layer to separate your menu from the website content.
Show Arrows of Parents
Add an indication for parent items that they have child items.
Close on Body Click
Click any where on your website except the menu to close it.
Push Content On Open
Push the content of the website when the menu opens.
Clickable Parent Items
Make the parent items clickable rather than just opening the sub items.
Expand All On Start
Expand all the subitems initially when a user first open the menu.
Show Search
Show or hide the search bar.
Search Place Holder
Placeholder text for the search bar.
Show Action Buttons
Show or hide the action buttons in the side menu.
Action Buttons Placement
Determine the place of the action buttons. Above or under the menu.
Show Menu Title
Show or hide the title of the menu.
Menu Title
Text for your menu title.
Example of side menu open effects:
Example of multi level sub items:
Menu Icons #
Choose the icons for your menu.
- Toggle Icon
- Search Button Icon
- Close Menu Icon
- Item Collapsed Icon
- Item Expanded Icon
Action Buttons #
Add items for your action buttons. Each button can have an icon, text and a link.
Side Menu Styling #
All the styling options you can imagine are included in the styles tab. Colors, Backgrounds, Typography, Borders and more.
Video Tutorial #
Check out the side menu in action in our live demo.
Example of side menu open effects:
