In this article we will go threw the steps of adding a Fullscreen menu to your Elementor website using the Fullscreen Menu widget.
Install Fullscreen Menu Widget for Elementor #
This widget requires Unlimited Elements FREE version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Fullscreen Menu”
- Hover over the widget in the search results and click install
- Add your “Fullscreen Menu” widget to any Elementor Page
General Settings #
Select Menu
Choose on of the menus from your WordPress website to output in the widget.
Max Depth
Set the number of sub level menu depth you want to display.
Alignment
Align the toggle button on the canvas.
Icon Toggle Type
- Animated Hamburger Icon
- Custom Icons for open and close menu. Use icon library or Upload SVG.
Open Transition
Set the opening transition effect for the fullscreen menu.
- Zoom In
- Slide from top
- Slide from bottom
- Slide from left
- Slide from right
- Fade in top
- Fade in bottom
- Fade in right
- Fade in left
Show Social Icons
Display social icons before or after Fullscreen Menu
Templates #
Select Elementor templates you want to load before or after your Fullscreen Menu.
Social Icons #
Add social icons to your Fullscreen Menu.
Fullscreen Menu Widget Styling #
Modify the colors to match your site’s look and feel. Customize the text, icons, fonts and layout to make the widget look and work exactly like you want it too.
Style Hamburger Icon #
Style Menu Background #
Style Menu Items #
Style Sub Menu Items #
Style Social Icons #
Usage Example #
