{"id":333011,"date":"2026-07-10T08:26:11","date_gmt":"2026-07-10T08:26:11","guid":{"rendered":"https:\/\/uk.wordpress.org\/plugins\/responsive-nav-menu-for-elementor\/"},"modified":"2026-07-10T08:10:45","modified_gmt":"2026-07-10T08:10:45","slug":"valbar-accessible-menu-for-elementor","status":"publish","type":"plugin","link":"https:\/\/wordpress.org\/plugins\/valbar-accessible-menu-for-elementor\/","author":23524275,"comment_status":"closed","ping_status":"closed","template":"","meta":{"version":"1.0.4","stable_tag":"trunk","tested":"7.0.1","requires":"5.8","requires_php":"7.4","requires_plugins":null,"header_name":"Valbar Accessible Menu Widget for Elementor","header_author":"Valentyna Baranova","header_description":"Adds a \"Valbar Accessible Menu\" Elementor widget that renders any WordPress menu as a responsive navigation with an accessible fullscreen mobile burger and collapsible submenus.","assets_banners_color":"7b7092","last_updated":"2026-07-10 08:10:45","external_support_url":"","external_repository_url":"","donate_link":"","header_plugin_uri":"https:\/\/github.com\/ValentynaBaranova\/responsive-nav-menu-elementor-widget","header_author_uri":"","rating":0,"author_block_rating":0,"active_installs":0,"downloads":12,"num_ratings":0,"support_threads":0,"support_threads_resolved":0,"author_block_count":0,"sections":["description","installation","faq","changelog"],"tags":[],"upgrade_notice":{"1.0.4":"<p>Style refinements for dropdown and active menu items.<\/p>"},"ratings":[],"assets_icons":{"icon-128x128.png":{"filename":"icon-128x128.png","revision":3602508,"resolution":"128x128","location":"assets","locale":"","width":128,"height":128},"icon-256x256.png":{"filename":"icon-256x256.png","revision":3602508,"resolution":"256x256","location":"assets","locale":"","width":256,"height":256}},"assets_banners":{"banner-1544x500.png":{"filename":"banner-1544x500.png","revision":3602508,"resolution":"1544x500","location":"assets","locale":"","width":1544,"height":500},"banner-772x250.png":{"filename":"banner-772x250.png","revision":3602508,"resolution":"772x250","location":"assets","locale":"","width":772,"height":250}},"assets_blueprints":{},"all_blocks":[],"tagged_versions":[],"block_files":[],"assets_screenshots":{"screenshot-1.png":{"filename":"screenshot-1.png","revision":3602508,"resolution":"1","location":"assets","locale":"","width":280,"height":600},"screenshot-2.png":{"filename":"screenshot-2.png","revision":3602508,"resolution":"2","location":"assets","locale":"","width":280,"height":600},"screenshot-3.png":{"filename":"screenshot-3.png","revision":3602508,"resolution":"3","location":"assets","locale":"","width":280,"height":600},"screenshot-4.png":{"filename":"screenshot-4.png","revision":3602508,"resolution":"4","location":"assets","locale":"","width":280,"height":600},"screenshot-5.png":{"filename":"screenshot-5.png","revision":3602508,"resolution":"5","location":"assets","locale":"","width":280,"height":600}},"screenshots":{"1":"Horizontal desktop menu with hover dropdowns.","2":"Fullscreen mobile burger overlay with collapsible submenus.","3":"Vertical layout used in a footer.","4":"Style controls in the Elementor editor."}},"plugin_section":[],"plugin_tags":[76538,1865,6274,1753,6275],"plugin_category":[43],"plugin_contributors":[270830],"plugin_business_model":[],"class_list":["post-333011","plugin","type-plugin","status-publish","hentry","plugin_tags-elementor","plugin_tags-menu","plugin_tags-mobile-menu","plugin_tags-navigation","plugin_tags-responsive-menu","plugin_category-customization","plugin_contributors-valentynabaranova","plugin_committers-valentynabaranova"],"banners":{"banner":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/banner-772x250.png?rev=3602508","banner_2x":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/banner-1544x500.png?rev=3602508","banner_rtl":false,"banner_2x_rtl":false},"icons":{"svg":false,"icon":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/icon-128x128.png?rev=3602508","icon_2x":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/icon-256x256.png?rev=3602508","generated":false},"screenshots":[{"src":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/screenshot-1.png?rev=3602508","caption":"Horizontal desktop menu with hover dropdowns."},{"src":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/screenshot-2.png?rev=3602508","caption":"Fullscreen mobile burger overlay with collapsible submenus."},{"src":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/screenshot-3.png?rev=3602508","caption":"Vertical layout used in a footer."},{"src":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/screenshot-4.png?rev=3602508","caption":"Style controls in the Elementor editor."},{"src":"https:\/\/ps.w.org\/valbar-accessible-menu-for-elementor\/assets\/screenshot-5.png?rev=3602508","caption":""}],"raw_content":"<!--section=description-->\n<p><strong>Valbar Accessible Menu Widget for Elementor<\/strong> adds a single, focused Elementor widget that renders any WordPress menu as a responsive navigation. On desktop you get a horizontal menu with hover dropdowns; on mobile you get an accessible fullscreen burger overlay with collapsible submenus. You can also switch to a vertical layout, which is handy for footers and sidebars.<\/p>\n\n<p>It does one thing and does it well: no bloated all-in-one add-on pack, no build step, just clean CSS and vanilla JavaScript. Everything is configurable directly in the Elementor editor.<\/p>\n\n<h4>Key features<\/h4>\n\n<ul>\n<li>Native Elementor widget under its own <strong>Valbar Accessible Menu<\/strong> category.<\/li>\n<li>Pick any registered WordPress menu from a dropdown.<\/li>\n<li><strong>Horizontal layout<\/strong>: hover dropdowns on desktop, fullscreen burger overlay on mobile.<\/li>\n<li><strong>Vertical layout<\/strong>: an always-visible stacked list with expanded submenus and no burger, ideal for footers.<\/li>\n<li>Optional <strong>per-item icon<\/strong> (Font Awesome or uploaded SVG) with configurable position, size, spacing, and color.<\/li>\n<li>Hover dropdowns kept open by an invisible bridge, with a configurable gap from the main menu.<\/li>\n<li>Animated burger button toggling a fullscreen mobile overlay.<\/li>\n<li>Collapsible submenus on mobile with auto-generated toggle buttons.<\/li>\n<li>Accessibility-friendly: <code>aria-expanded<\/code>, <code>aria-controls<\/code>, <code>aria-label<\/code>, and <code>Escape<\/code> to close.<\/li>\n<li>Body scroll lock while the mobile menu is open.<\/li>\n<li>Rich style controls: link colors, typography, item spacing, dropdown styling, item icon, burger colors, and the mobile panel background.<\/li>\n<li>Live preview inside the Elementor editor.<\/li>\n<li>No build step required, plain CSS and vanilla JavaScript.<\/li>\n<\/ul>\n\n<h4>Requirements<\/h4>\n\n<ul>\n<li>WordPress 5.8 or higher<\/li>\n<li>PHP 7.4 or higher<\/li>\n<li>Elementor 3.5 or higher<\/li>\n<\/ul>\n\n<!--section=installation-->\n<ol>\n<li>Make sure <a href=\"https:\/\/wordpress.org\/plugins\/elementor\/\">Elementor<\/a> is installed and active.<\/li>\n<li>In your WordPress admin, go to <strong>Plugins \u2192 Add New<\/strong> and search for \"Valbar Accessible Menu Widget for Elementor\", or upload the plugin ZIP via <strong>Plugins \u2192 Add New \u2192 Upload Plugin<\/strong>.<\/li>\n<li>Activate <strong>Valbar Accessible Menu Widget for Elementor<\/strong>.<\/li>\n<li>Create at least one menu under <strong>Appearance \u2192 Menus<\/strong>.<\/li>\n<li>Edit a page or template with Elementor, search for <strong>Valbar Accessible Menu<\/strong> in the widgets panel, and drag it onto the canvas.<\/li>\n<\/ol>\n\n<!--section=faq-->\n<dl>\n<dt id=\"does%20this%20plugin%20require%20elementor%3F\"><h3>Does this plugin require Elementor?<\/h3><\/dt>\n<dd><p>Yes. The plugin registers an Elementor widget, so Elementor must be installed and active. If Elementor is missing, the plugin shows an admin notice and does nothing else.<\/p><\/dd>\n<dt id=\"does%20it%20work%20with%20elementor%20free%20or%20only%20elementor%20pro%3F\"><h3>Does it work with Elementor free or only Elementor Pro?<\/h3><\/dt>\n<dd><p>It works with the free version of Elementor. Elementor Pro is not required.<\/p><\/dd>\n<dt id=\"which%20menu%20does%20it%20display%3F\"><h3>Which menu does it display?<\/h3><\/dt>\n<dd><p>Any menu you create under <strong>Appearance \u2192 Menus<\/strong>. You select the menu from a dropdown inside the widget.<\/p><\/dd>\n<dt id=\"can%20i%20use%20it%20in%20a%20footer%3F\"><h3>Can I use it in a footer?<\/h3><\/dt>\n<dd><p>Yes. Drop the widget into a footer or any narrow column and set the <strong>Layout<\/strong> to <strong>Vertical<\/strong>. The burger is disabled, items stack into a column, and submenus are shown as an expanded, indented list.<\/p><\/dd>\n<dt id=\"can%20i%20add%20icons%20to%20menu%20items%3F\"><h3>Can I add icons to menu items?<\/h3><\/dt>\n<dd><p>Yes. You can set an optional Font Awesome icon or uploaded SVG that appears next to every top-level menu item, and control its position, size, spacing, and color.<\/p><\/dd>\n<dt id=\"is%20the%20mobile%20menu%20accessible%3F\"><h3>Is the mobile menu accessible?<\/h3><\/dt>\n<dd><p>Yes. The burger button uses <code>aria-expanded<\/code>, <code>aria-controls<\/code>, and an <code>aria-label<\/code>, the navigation has an <code>aria-label<\/code>, the overlay can be closed with the <code>Escape<\/code> key, and body scrolling is locked while the menu is open.<\/p><\/dd>\n<dt id=\"can%20i%20change%20the%20mobile%20breakpoint%3F\"><h3>Can I change the mobile breakpoint?<\/h3><\/dt>\n<dd><p>The mobile breakpoint is <code>1024px<\/code>, defined in both the stylesheet (media query) and the script (<code>BREAKPOINT<\/code> constant). You can adjust it with custom code or override styles using the BEM class names (<code>rnm-menu<\/code>, <code>rnm-menu__nav<\/code>, <code>rnm-menu__burger<\/code>, etc.).<\/p><\/dd>\n\n<\/dl>\n\n<!--section=changelog-->\n<h4>1.0.4<\/h4>\n\n<ul>\n<li>Improved active\/current menu item styling for dropdown links.<\/li>\n<li>Minor style control refinements.<\/li>\n<\/ul>\n\n<h4>1.0.0<\/h4>\n\n<ul>\n<li>Initial release.<\/li>\n<\/ul>","raw_excerpt":"A lightweight Elementor widget that turns any WordPress menu into an accessible responsive navigation with a fullscreen mobile burger.","jetpack_sharing_enabled":true,"_links":{"self":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin\/333011","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin"}],"about":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/types\/plugin"}],"replies":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/comments?post=333011"}],"author":[{"embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wporg\/v1\/users\/valentynabaranova"}],"wp:attachment":[{"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/media?parent=333011"}],"wp:term":[{"taxonomy":"plugin_section","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_section?post=333011"},{"taxonomy":"plugin_tags","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_tags?post=333011"},{"taxonomy":"plugin_category","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_category?post=333011"},{"taxonomy":"plugin_contributors","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_contributors?post=333011"},{"taxonomy":"plugin_business_model","embeddable":true,"href":"https:\/\/wordpress.org\/plugins\/wp-json\/wp\/v2\/plugin_business_model?post=333011"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}