Description
HamburgerX for Elementor adds an animated SVG hamburger icon widget to Elementor that can directly toggle your Off-Canvas panel, Nav Menu, Mega Menu, or any element via a custom CSS selector — without needing an intermediate button trigger.
Features
- 11 animations — classic bars, arrow, cross and the jonsuh collection (ham1–ham8)
- 4 target modes — Off-Canvas, Nav Menu, Mega Menu or custom CSS selector
- Smart editor — targets update live as you add widgets, no page reload needed
- Full Elementor styling — size, stroke, color, hover, active, shadow, border and alignment controls
- Accessible — configurable ARIA labels, visible focus and
prefers-reduced-motionsupport - Lightweight — vanilla CSS + JS only, no front-end dependencies
Requirements
- WordPress 5.8+
- Elementor 3.x
- PHP 7.4+
- Elementor Pro (only required for Off-Canvas mode)
Installation
- Upload the plugin files to
/wp-content/plugins/animated-hamburger/, or install via Plugins Add New Upload Plugin. - Activate the plugin through the Plugins menu in WordPress.
- Edit any page or template with Elementor, search for the HamburgerX widget and drag it into your layout.
FAQ
-
Do I need Elementor Pro?
-
Only if you want to use the Off-Canvas target mode. Nav Menu, Mega Menu and CSS selector modes work with the free version of Elementor (depending on which widgets you have available on your site).
-
The Off-Canvas list is empty, what do I do?
-
Add an Off-Canvas widget anywhere on the page, then save or reopen the HamburgerX panel — the list refreshes automatically.
-
Can I use it with a custom CSS class?
-
Yes. Choose Custom CSS Selector as the target type and enter the selector of the element you want to toggle.
Reviews
There are no reviews for this plugin.
Contributors & Developers
“HamburgerX SVG Toggle for Elementor” is open source software. The following people have contributed to this plugin.
Contributors
Translate “HamburgerX SVG Toggle for Elementor” into your language.
Interested in development?
Browse the code, check out the SVN repository, or subscribe to the development log by RSS.
Changelog
2.1.0
- Added ham1–ham8 animation collection (jonsuh technique)
- Added live target discovery in editor (no page reload needed)
- Added custom CSS selector target mode
- Improved ARIA accessibility support
1.0.0
- Initial release