When creating an excellent user experience in your e-commerce store, you have to focus on navigation first. It is clear that it must reflect a common set of usability principles. Start with navigation menus that really help customers search for products at your Magento 2 website.
How to create the intuitive and easy-to-manage website navigation menu? Try out the Navigation Pro extension. Using this powerful tool, you will improve the Magento 2 navigation menu at all levels.
Our module allows you to create different navigation menus with custom items and drop-down content. Supports all touch devices, tablets, and phones.
Navigation Pro extension will help you to:
- Take your site menu to the next level.
- Create eye-catching navigation menus.
- Build mega menu with ease.
- Show Amazon-like and Iconic menus.
- Add multiple subcategories inside drop down.
- Style navigation menus with custom CSS by using simplified configs.
- Enhance the customer search experience all around a website.
Navigation Pro demo sites:
- Free installation
- Activate up to 10 times
- All extensions $79
- Approved on Magento Marketplace
Magento Open Source Compatibility
Magento Community 2.4.8, Magento Community 2.4.7, Magento Community 2.4.6, Magento Community 2.4.5, Magento Community 2.4.4, Magento Community 2.4.3, Magento Community 2.4.2, Magento Community 2.4.1, Magento Community 2.4.0, Magento Community 2.3.7, Magento Community 2.3.6, Magento Community 2.3.5, Magento Community 2.3.4, Magento Community 2.3.3, Magento Community 2.3.2, Magento Community 2.3.1, Magento Community 2.3.0
Adobe Commerce Compatibility
Adobe Commerce 2.4.x, Adobe Commerce 2.3.x, EE 2.2.x, EE 2.1.x
Installation instructions and manuals
Simple dropdown
Navigation Pro module allows creating a simple dropdown menu to let users choose an option from the list. This menu usually has the minimalistic design that helps to prevent the distraction of user attention from a store content. You can replace the standard top navigation with a simple menu in module menus’ grid. You can also enable this menu for a specified store. Via existing menu settings you can limit the number of loaded dropdown levels, change the drop-down width and layout both for simple and other menus.
Mega menu dropdown
Besides enhancing usability, mega menus could maximise a website SEO performance. Navigation Pro extension allows you to add mega menu dropdown. That way you can display the subcategories in vertical alignment mode as well as show a custom HTML content there. Moreover, you can show the category labels next to the top level category name. You can do that in a mega menu as well in other menus. It is easy to add the labels from the menu in a backend. You can use a menu item name renderer tool.
Iconic menu
Navigation Pro allows the creating an iconic menu. Good in communication meaning, the icons have much more benefits. Icons are visually pleasing and easily touched in a finger-operated UI. You can display them in a relatively small space. No need to translate the icons for international users. Thus you can show the subcategories in 3 columns horizontal alignment layout both in an iconic menu and other ones; display an additional information in custom HTML content blocks; show the drop-downs in iconic menu.
Amazon menu
Navigation Pro module will help you to easily create Magento 2 Amazon menu. It has lots of advantages. You can show a broad range of top-level categories and many products with multiple options simultaneously. Amazon-like menu supports the links, icons, and images that can be arranged in a neat design. This menu is must have for sites with large catalogs. It will improve the overall usability of your website.
Complex dropdown
Navigation Pro module allows replacing a simple dropdown with full and highly informative complex dropdown. Besides available subcategories, you can add HTML content at the top, show graphical and right side banners and add the important and interesting content on the bottom. Via the module layout builder, you can add and resize the additional content blocks. Unlimited customization possibilities are available with built-in CSS helpers.
Full width drop down with images
Via our extension, you can easily replace the standard subcategories block with Easy Catalog Images widget. At the end, you will get the visually appealing dropdown with beautiful images. Our module includes the drop down layout builder that provides you with friendly drag and drop interface. Each block is resizable and draggable. Thus you can remove the standard subcategories and add a custom HTML content.
Amazon sidebar menu
Apart from Amazon like drop-down menu, the Navigation Pro module supports the Amazon sidebar menu. Now you can easily create the sidebar menu that will show subcategories of the currently viewed department. That will help you to display a flexible and content-rich fold out a menu. Moreover, this type of menu should be used in a responsive web design for better navigation for any screen size. Encourage customers to browse more efficiently.
Sidebar navigation menu
Our module includes many configurable options to help you build user-friendly sidebar menu. Via Navigation Pro widget you can display:
- a sidebar with initially expanded levels
- a sidebar with active branch only
- simple drop down settings.
Quick way to customize menu styles
Navigation Pro provides you with the easy and quick way to customize menu styles without worrying about further updates. This allows you to keep the original files clean. Our extension includes a plenty of CSS helpers that help you easily add styles to your custom content. For instance, you can add the minor paddings, make the transparent background color, use the smaller/ bigger font size, create the vertical lists, align a text to the left/ right/ center, hide an element on mobile/tablet/desktop devices.
Dropdown width modes
With Navigation Pro module's dropdown width modes you will organize the drop-down menus with an uniform width. This is very helpful in case the navigation item names are very long. Thus you can set a Boxed (first level only) mode that makes a dropdown width match a size of theme container or header. When a Full Width (first level only) mode is used, a dropdown width takes a whole screen and an inner container width matches the size of theme container or header. Through the Full Screen (first level only) mode the dropdown width and inner container take a whole screen.
Magento 2 menu widget
Navigation Pro comes with the custom widget that will help you beautify your menu. Using the extended widget's functionality, you will help your users to navigate the website much easier and faster. Via Navigation Pro widget, you can:
- Enable Amazon-like sidebar menu.
- Show Menu with initially expanded levels.
- Choose between horizontal (Top) and vertical (Sidebar) menus.
- Set the drop-down positioning.
- Wrap into block template.
Navigation Pro widget with themes support
Navigation Pro widget provides themes support. After you have created the menus, you can assign them to the various menu areas specified by your theme. Theme selector is currently available for widget menus only. Now you can easily apply via the widget one of the existing themes:
- Blank (Default)
- Dark (Fully Dark, Dark Bar, Dark Dropdown)
- Flat
- Compact.
Apple menu
If you suppose a drop-down menu is complex for your customers, you might like the Apple menu type. In fact, this navigation menu is a combination of two menus. A first one shows the top-level categories only, a second one shows children of an active category with nice icons. The module allows configuring top-level and secondary menu as well as customizing Apple menu styles.
“LinkBar” mobile menu
Magento default hides a navigation menu on mobile devices and shows the “hamburger menu” instead. It happens that visitors don't use this icon, because they don’t know the navigation is behind the icon. The alternative mobile menu solves this problem. Now you can show a “LinkBar” menu with top category links under the header on mobile devices.
Slide-out navigation menu
Navigation Pro extension allows adding a slide-out menu to your Magento 2 store. With a slide-out navigation menu, you fully use the screen space and prevent the user from scrolling. By using the menu your customers can search for products in a store while staying on the same page. The module makes visitors toggle the menu by clicking the ‘hamburger’ icon in the header.
Simplified styling with custom CSS
The module provides opportunities for easy styling your navigation menu within the module configuration settings. You can avoid writing CSS manually into the CSS Class field by simply choosing them from a ready-to-use list of CSS modifiers. The module also includes an additional config that allows you to write custom CSS directly on the Edit Menu page.
Ribbon menu
Ribbon menu is a kind of a simple drop-down menu when the dropdowns are positioned below each other. The module allows moving items in the tree to get the desired menu structure. This position of a sub-menu is convenient to browse by mobile users.
The nowrap feature
Nowrap feature allows rendering a menu in a single row by moving the top-level items into a separate drop-down when there is not enough space to fit a menu on a single row. That makes a navigation menu looking well-arranged on any screen size.
Navigation Pro 1.17.33
5th December 2025- Updated Breeze integration.
Navigation Pro 1.17.28
18th June 2025- Fixed not working accordion on mobile devices when menu is added to the sidebar.
Navigation Pro 1.17.27
9th April 2025- PHP 8.4 support added.
- Magento 2.4.8 support added.
- Fixed not working navpro when jquery-ui/menu is added by third-party module.
- Fixed js error in Magento
Navigation Pro 1.17.24
26th February 2025- Allow using tel: and mailto: in URLs.
- Fixed tiny layout shift when nowrap is used.
- Fixed incorrect caret rotation on mobile devices.
- Improve performance when adding close icons or “View All” link to every dropdown.
- Do not apply bold font for expanded parent if it has no children.
Navigation Pro 1.17.21
3th January 2025- Improved nowrap performance.
- Postpone menu initialization on mobile devices until menu is used.
- Significant performance improvements for menu with heavy dropdowns.
- Improved performance of the vertical menu mode.
- Fixed not working menu overlay.
Navigation Pro 1.17.20
20th December 2024- Significant performance boost for the menu’s with large category count.
- We tested performance with 3000 categories and 1000 dropdown items and here are the results:
Before: One large task - 600ms. TBT - 550ms.
After: Eight seprate microtasks - 10-40ms each. TBT - 0ms.
Navigation Pro 1.17.20
12th December 2024- Improve dropdown alignment below “More” icon.
- Added missing jquery-ui/position dependency.
Navigation Pro 1.17.18
18th November 2024- Add title to the "View more" link
- Allow closing mobile sidebar when pressing ESC on closed parent item
- Use the same navpro component in Breeze and Luma
- Remove mage/menu dependency. Reduce js codebase by 10KB
Navigation Pro 1.17.16
5th August 2024- Fixed wrong styles for multicolumn layout when less.js v4 via grunt command is used.
- Fixed missing alt attribute in generated Amazon, Megamenu, and Iconic menus.
Navigation Pro 1.17.13
2nd April 2024- Reduce layout shift when “nowrap” feature is used.
Navigation Pro 1.17.10
2nd February 2024- Breeze integration updated. Dynamic JS support added.
- Fixed nowrap on mobile devices when nav is using display: none
Navigation Pro 1.17.7
28th November 2023- Breeze Theme integration improvements: dropdown positioning, chevron support added.
Navigation Pro 1.17.5
15th September 2023- Performance: improve total blocking time score.
- Fixed not working ‘dark’ modifier for boxed dropdown.
- Fixed missing caret icon when js is not initialized yet.
Navigation Pro 1.17.2
25th July 2023- Breeze fixes for slideout and simple menu’s.
Navigation Pro 1.17.0
30th June 2023- Added ability to render dropdown items in alphabetical order
- Added ability to duplicate existing menu
Navigation Pro 1.16.20
28th May 2023- Fixes wrong redirect after currency change when currency block is added to menu item.
- Fixed missing active class for CMS links inside menu.
Navigation Pro 1.16.18
30th April 2023- Fixed not working save functionality when using pagebuilder with latest Google Chrome (Version 112)
- Improved dropdown content preview renderer. Dedicated icons added for iframe, map, slider, and grid widgets.
Navigation Pro 1.16.17
26th September 2022- Improved Breeze Theme integration
- Fixed incorrect mobile breakpoint in Magento 2.4.4 and newer
Navigation Pro 1.16.15
26th September 2022- Magento 2.4.5 compatibility.
- Breeze compatibility
- Multiply bugfixes
Navigation Pro 1.16.11
16th April 2021- Magento 2.4.4 and PHP 8.1 compatibility.
- Fixed incorrect has-active class on custom non-category links
Navigation Pro 1.16.8
20th February 2021- Fixed error in backend pagebuilder when widget in page content is used.
- Fixed broken drag-n-drop in backend tree.
- Breeze: fixed dropdown content overflow when vertical direction is used.
- Breeze: fixed css issue on checkout success page
Navigation Pro 1.16.3
10th January 2021- Magento Coding Standard fixes
- Breeze Theme integration added
- Fixed layout shift caused by slideout menu
Navigation Pro 1.16.0
28th September 2021- New Feature: Always expanded menu on the homepage.
- Breeze: fixed possible invalid shevron position.
- Fixed rare error when this.active is null.
Navigation Pro 1.15.10
22th May 2021- Fixed error ‘Menu doesn’t exist’ when saving category when DB has broken menu item records.
Navigation Pro 1.15.9
17th May 2021- Breeze integration updated - Fixed not working vertical columns layout.
Navigation Pro 1.15.8
14th May 2021- Breeze integration added.
- Fixed not working sticky component.
- Fixed incorrect dropdown height on mobile devices when using stacked or amazon menu’s.
Navigation Pro 1.15.4
27th April 2021- Breeze integration added
- PWA integration added
- Optimize menu initialization on mobile devices
Navigation Pro 1.15.3
22nd March 2021- Magento 2.4.2 fixes.
- Added loading=lazy attribute to the megamenu image placeholders.
Navigation Pro 1.15.1
22nd January 2021- Updated integration with our Pagebuilder module
- Fixed not working nowrap menu when some items are hidden via css.
Navigation Pro 1.15.0
1st December 2020- New Slideout Menu variation added: Stackable Slideout Menu
- Fixed blurry text dropdowns when using certain slide effects.
- Fixed incorrect padding for menu items when dropdown should be on the left.
- Fixed multiple “Menu was saved” messages in backend when refresh the page after multiple menu saves.
Navigation Pro 1.14.12
28th October 2020- Fixed synchronization of the new top level category with the departments submenu.
Navigation Pro 1.14.11
16th October 2020- Do not allow to save menu or menu item when it has a recursive reference to itself via widget call.
Navigation Pro 1.14.10
30th September 2020- Removed unused/not-working functionality
- Fixed possible invalid image path on nginx server.
Navigation Pro 1.14.9
23th September 2020- Fixed wrong active menu when using installer command with ‘activate=0’.
Navigation Pro 1.14.8
26th August 2020- Fixed invalid category image path when it’s used in category title (Magento 2.3.5, 2.4.0)
- Added missing translations
Navigation Pro 1.14.7
6th August 2020- Fixed invalid category image path in Magento 2.4
- PHP 7.4 compatibility.
Navigation Pro 1.14.5
27th May 2020- Fixed rare bug when nowrap or sticky features does not applied on the initial page load.
Navigation Pro 1.14.4
22th May 2020- Fixed flyout menu from top left corner in Safari when fade animation is used
- Code cleanup and installer improvements.
Navigation Pro 1.14.3
6th May 2020- Added marketplace installer support.
Navigation Pro 1.14.1
28th April 2020- Fixed bug when dropdown wasn’t shown on mouse hover.
- Decreased cache memory consumption.
- 16 locales added to translate backend and frontend phrases: Arabic, Chinese, Dutch, French, Hebrew, Italian, German, Japanese, Norwegian, Korean, Polish, Portuguese, Russian, Spanish, Swedish, Ukrainian
Navigation Pro 1.14.0
4th March 2020- Added ability to set dropdown settings for third dropdown level.
- Fixed possible error when category name is missing in the backend navpro’s tree.
Navigation Pro 1.13.5
17th February 2020- Few RTL fixes.
- Fixed broken magento installation when navpro is enabled before Magento was installed.
Navigation Pro 1.13.5
3rd February 2020- Fixed invisible dropdowns in sidebar menu, when it has .navro-nowrap class.
Navigation Pro 1.13.5
20th January 2020- Inform about incorrect category data when importing items. (No errors were shown previously.)
Navigation Pro 1.13.4
11th December 2019- Fixed possible webserver error in developer mode when a lot a categories are loaded in menu and FPC is enabled. (Size of ‘X-Magento-Tags’ header.)
- Fixed issues with Magento Page Builder functionality inside NavigationPro backend forms.
Navigation Pro 1.13.3
9th December 2019- Fixed invalid category links when using iconic or megamenu with thumbnails menu types.
- Fixed bug when new category wasn’t added to the menu’s.
Navigation Pro 1.13.2
30th October 2019- Improve accuracy of the nowrap feature.
- Prevent unwanted accordion collapse on mobile devices when click outside of the menu.
Navigation Pro 1.13.1
17th October 2019- Remove direct ‘jquery/ui’ usage to improve js performance.
Navigation Pro 1.13.0
27th September 2019- Slideout menu type added.
- New “Air” theme added with borderless shadowed dropdowns.
- Simplified CSS modifiers usage. You can now select them from the list. Previously you had to write them manually into CSS Class field.
- Added ability to write custom CSS from Edit Menu page.
- Simplified menu creation. You can create many menu types with just one click.
- Improved Amazon Menu type builder. Now, it automatically shows parent category thumbnail in second level dropdowns.
- Improved Megamenu type builder. Now, it automatically shows parent category thumbnail in category dropdown.
- New effects added to reveal menu dropdowns: Fade, SlideIn, SlideOut, None.
- Improved dropdown positioning.
- Many CSS fixes for Dark, Compact, and Flat themes.
Navigation Pro 1.12.0
19th August 2019- Mass edit feature added.
- Added ability to set global item settings based on item level.
- Added ability to sync item and dropdown settings with global settings from menu.
- Improved default value for dropdown layout settings in each item. Now it shows properly inherited dropdown layout.
- Added ability to hide html content/widget when item has no children.
- Added ability to use depend and var directives for item name renderer.
- All styles moved to
_module.less. This allows easely redefine navigationpro variables within your theme. - Improved nowrap feature logic.
- Do not allow to import root category as it’s cannot be rendered at frontend.
- Fixed possible js errors when rendering dropdown content at the backend.
- Fixed always enabled wysiwyg editors. Now they are disabled by default.
Navigation Pro 1.11.1
12th June 2019- Fixed missing ‘Accordion’ menu layout in widget configuration
Navigation Pro 1.11.0
8th June 2019- Added ability to activate dropdowns with click instead of mouseover.
- Accordion menu added.
- Nowrap feature improved. It’s much easier to get it work with various header types.
- Fixed invalid order of menu items when nowrap is used.
- Fixed possible horizontal scrollbar when ‘nowrap’ is used.
- Fixed invalid custom url in menu item, when ‘/’ count is more than 3.
Navigation Pro 1.10.0
15th May 2019- Improved backend dropdown layout builder. Now it shows a preview of what customer will see on the frontend when changing children settings or html content.
- Added ability to limit number of categories to display in dropdown. When using this option, a ‘Shop All’ link will be displayed if children count exceed the limit. View Megamenu Example.
- Improved cache cleanup when edit menu settings or create new menu. No more manual cache update after each operation!
- New categories are now automatically synced into appropriate menu’s. You don’t need to manually import new categories into the tree!
- Improved default values for built-in menu types.
- Fixed “collapsed” menu on mobile devices after “window.resize” event.
Navigation Pro 1.9.3
26th March 2019- Magento 2.3.1 compatibility
- Fixed invalid breadcrumbs when multiple menu’s found on the same page
- Added missing localization file
Navigation Pro 1.9.2
26th February 2019- Improved internal logic is Menu-Builder script
Navigation Pro 1.9.1
7th January 2019- Fixed issues when search and storeviews dropdowns covered by sticky navigation
Navigation Pro 1.9.0
30th December 2018- Added ability to stick menu when you scroll the page
Navigation Pro 1.8.1
5th December 2018- Improved column-count in Chrome when using vertical mode
Navigation Pro 1.8.0
31st October 2018- Internal module naming convention was updated. We applied this changes to reach full compatibility with Magento Marketplace policy and new Composer-based installation process.
Navigation Pro 1.7.0
21th September 2018- Magento 2.2.6 compatibility:
- Fixed double caret icons near items with dropdowns
- Fixed dropdown positioning for Amazon menu type
- Added ability to change dropdown positioning for particular dropdown item.
Backend Improvements
- Added ability to assign menu to particular store during menu creation. (Previously you had to create menu and than use system configuration to do that)
- New column is added to the menu grid. It shows the list of stores where menu is used as top menu replacement.
- Added ability to assign menu to particular store directly from menu settings form. (Previously you had to navigate to configuration to do that)
- Renaming/Removing a menu no longer results in missing menu at the storefront
Navigation Pro 1.6.0
15th August 2018
Navigation Pro 1.5.5
30th May 2018Major Changes
NavigationPro 1.5.0 brings a new nowrap feature that allows to render menu in a single row despite of top level items count, various dropdown positioning fixes and improvements, and ability to redefine LESS variables inside third-party themes (for developers).
- Added ability to move top-level items into separate dropdown, if they doesn’t fit on a single row
- Improved dropdown positioning when it does not have enough space on the screen
- Use amazon-like dropdown positioning for the ‘departments’ dropdown only. All other dropdowns (if your menu have them) will use default logic.
- Added ability to redefine variables in third-party themes
- Added ability to set padding via less variables for items inside dropdowns
- Dropdown size fixes on RTL locales
Navigation Pro 1.5.0
10th May 2018Major Changes
- Added ability to move top-level items into separate dropdown, if they doesn’t fit on a single row
- Improved dropdown positioning when it does not have enough space on the screen
- Use amazon-like dropdown positioning for the ‘departments’ dropdown only. All other dropdowns (if your menu have them) will use default logic.
- Added ability to redefine variables in third-party themes
- Added ability to set padding via less variables for items inside dropdowns
- Dropdown size fixes on RTL locales
Navigation Pro 1.4.1
10th May 2018Major Changes
- Magento 2.2.4 product page breadcrumbs compatiblity
- Fixed rare bug with unreacheable dropdowns inside vertical multicolumn layout
- Added separate handler when clicking caret icon (open/close dropdown)
Navigation Pro 1.4.0
31th March 2018Major Changes
- Overlay feature added
- Native browser’s
column-countfeature will be used to build columns in vertical direction. - Allow to close dropdown when click outside of menu on iPad
- Better RTL support. No visible transformations after page is loaded.
- Small fixes
Navigation Pro 1.3.0
28th February 2018Major Changes
- New simplified form to create menu with a few clicks
- Removed open menu delay on touch devices
- RTL support added (RTL theme is required to use)
- Fixed ability to use form inside a dropdown item
- Added small delay before opening first dropdown item
- Small js and css fixes
Navigation Pro 1.2.0.1
15th January 2018Major Changes
- Fixed browser freezing on mobile devices when using vertical subcategories alignment
Navigation Pro 1.2.0
13th January 2018Major Changes
- Added ability to set
positioning settings for the first level dropdown:
- Stick to Left
- Center
- Stick to Right
Navigation Pro 1.1.0
12th December 2017Major Changes
- Sidebar menu support added with plenty of configurable options
- Navigationpro widget added with themes support
- Amazon-like sidebar menu added
Fixes and Improvements
- Mobile view will always use single column mode
- Fixed too small dropdown width and height on mobile devices
- Fixed php error when switching store view in backend interface
- Improved dropdown positioning calculations
- Fixed css issues with category tips
- Javascript code optimizations
Navigation Pro 1.0.1
6th October 2017- Fixed possible invalid dropdown height for Amazon menu
Navigation Pro 1.0.0
4th October 2017- Initial release
Write Your Own Review