How to make Custom Mobile Menu in Elementor | Sticky Bottom Menu Bar | Hamburger Mobile Menu [Video Tutorial]

Updated onApril 11, 2026By

Key Takeaways

  • The Plus Addons for Elementor offers a Full-Screen Mobile Menu feature.
  • The tutorial demonstrates creating a Hamburger Mobile Menu with animated effects.
  • Users can build a Fixed/Sticky Bottom Menu using the Swiper effect.
Table Of Content
YouTube video
Video Duration: 22 : 42

Video Overview

In this tutorial, we will learn how to make a Responsive Mobile Menu in Elementor, with off canvas extra toggle menu. Where you can build both fixed, sticky or absolute menu bar with Swiper effect. Create custom Mobile Menu in Elementor with Animated Hamburger Menu. Presenting you the Best Elementor Mobile Menu WordPress plugin – The Plus Addons for Elementor.

Live Demo – https://theplusaddons.com/elementor-widget/elementor-mobile-menu/

Exclusive Features of Elementor Custom Mobile Menu
✅ Full-Screen Mobile Menu
✅ Menu Bottom Bar Sticky
✅ Hamburger Mobile Menu
✅ Template Based Extra Toggle Bar Feature
✅ Navigation Pop-up Mobile Menu for Elementor
✅ Active Page Border Indicator
✅ Fixed/Sticky Bottom Menu
✅ Swiper Mobile Menu
✅ Add Pin Text
✅ Off canvas Mobile Menu
✅ Unique Circular Menu

Popup Builder/ OFF Canvas video- https://youtu.be/74bj6WcEhiY

Time stamps

00:00 Intro
01:21 Installing the Mobile Menu widget
02:33 Copying the Mobile Menu Design
05:22 Creating Custom Mobile Menu
15:58 Styling the Mobile Menu
18:09 Circle mobile menu
22:24 Outro

Get The Plus Addons for Elementor
View 120+ Elementor Widgets Demo

About the Author

Photo of Aditya Sharma CMO of The Plus Addons for Elementor
CMO · The Plus Addons for Elementor · 10 years experience

He has spent years in the WordPress ecosystem building, breaking, and optimizing sites until they actually perform. He works at the intersection of speed, growth, and usability, helping creators ship websites that load fast and convert. An active WordPress community contributor sharing through tools, tutorials, and direct collaboration. Tested practice, not theory.

WordPressElementorn8nAIClaudeAutomationServer
LinkedIn X GitHub YouTube Website
Get Instant Answers to all your questions about The Plus Addons for Elementor, trained on 1000+ Docs and Videos

Related Frequently Asked Questions

What should I do if my custom mobile menu doesn't appear after following the tutorial?

If your custom mobile menu isn't showing, check that you've correctly installed the Mobile Menu widget from The Plus Addons for Elementor. Ensure that the widget is added to the correct section of your page and that no conflicting CSS is hiding it. Sometimes, clearing your browser cache can also resolve display issues.

What is the best way to style the hamburger menu for better visibility?

To enhance visibility, consider using contrasting colors for the hamburger icon and background. The Plus Addons for Elementor allows for extensive styling options, including animations and hover effects. Ensure that the menu is easily identifiable, especially on busy backgrounds, to improve user interaction.

Does the custom mobile menu support RTL layouts?

The page does not specify support for RTL (Right-to-Left) layouts. However, it's essential to test your custom mobile menu in various languages to ensure proper alignment and functionality. If you're using languages that require RTL support, consider checking compatibility with your theme.

Are there any limitations when using the off-canvas mobile menu feature?

While the off-canvas mobile menu feature offers a clean design, it may not be suitable for all types of content. If your menu contains many items, users might find it cumbersome to navigate. It's best to keep the menu concise and prioritize essential links to enhance user experience.

Last reviewed: April 11, 2026

Related Docs