OverviewBack to top
The default Magento 2 Layered Navigation does not support ajax loading, price slider, and does not allows customers to select multiple filters at the time. When customers select an option to filter on layered navigation such as material, color, or size, the whole page has to be loaded. It increases the page loading time and abandoned carts.
The Layered Navigation extension enhances the default layered navigation with a bunch of great features such as horizontal & vertical navigation, AJAX loading, multiple filter select, extra filter options (New, Rating, In-Stock), and more. The AJAX loading functionality refreshes only the product catalog and enhances response time. The Layered Navigation extension is a useful tool that allows customers to search the store catalog in the shortest way, and decrease the abandoned carts.
- Vertical and horizontal layered navigations display
- Support ajax Loading page for quick filtering
- Support multi and single filters, select one or multiple options for each product attribute
- Support extra filters such as ‘Ratings', ‘New’, ‘On Sale’, ‘In Stock’
- Automatically "Scroll Up" page after filtering
- Sticky layered navigation on the sidebar during vertical page scrolling
- Pre-select filters to display expanded by default
- Manually reload after each single & multi-select options
- Support price slider with 6 sliders design
- Adds search box and view more on each filter
- Adds product count on each filter option
- Support mobile devices
- Support multiple websites, stores, and store views
Vertical & Horizontal Navigation
You can configure the layered navigation to display vertically (on the sidebar of a page) or horizontally (on the top content of the page).
Ajax Loading Page
The extension use AJAX technology to auto-update filter results without page reloads. It makes the shopping process faster, customers can easily keep selecting search filter options while it's updating. You can choose to enable or disable AJAX loading functionality from the backend.
Multiple Select Options
The extension supports multi-select filters on category pages as well as on the search result page. It allows customers to narrow down search results and save search time. Customers can select several filter options/values of the same filter at a time to get maximally precise results.
The extension support extra filters such as ‘On Sale’, ‘New’, ‘Rating’ &‘In Stock’. It makes product sorting more convenient and improve the store’s performance. Customers can filter new arrivals, 'on sale’, ‘in stock’ products. The 'Rating’ filter displays each rating level allowing customers to find the most popular items. You can include or excludes the extra filters on layered navigation.
Manual Reloading After Each Select
When every new attribute is selected, the extension popover an automatic "Show" button with the number of items conforming to the current selection. Customers can reload the page manually, with the help of a popover. Additionally, customers can filters in bulk according to their needs and click the "Show All Filters" button to show them all.
Search Box To Any Filter
The extension support full-text search in layered navigation block, allowing customers to instantly find necessary items. The search box appears on each filter, customers can specify the product name or attribute in case they don't see that in filters multi-select. And the possible variants will instantly output. You can set the max number of options/values available per filter as a condition to display the search box. For example: if you set 8, the search box will show on each filter that has more than 8 options/values.
View More To Any Filter
The ‘View More’ link appears on each filter, allowing customers to see filters in part and expand them with a click. You can set the max number of options/values available per filter as a condition to display the "view more" filter. For example: if you set 8, the "view more" will show on each filter that has more than 8 options/values.
The extension supports a smart price slider, allowing customers to adjust the range of filter price to have only affordable items displayed on the page. Additionally, the extension support six various design of the price slider including flat, big, modern, sharp, round, and square. You can choose from the backend, the slider design to display.
Sidebar Sticky & Auto-Scroll To Top
The extension displays the layered navigation sticky on sider when customers scroll down the page. It allows customers to easily browse through the predefined filters during vertical scrolling. The auto "Scroll To Top" functionality auto-scroll up the page to the loading results. You can choose to enable or disable the sticky and auto scroll-to-top features from the backend.
You can control each functionality of the extension from the backend. The extension includes a detailed guide to enable or disable each filter on the layered navigation and define their position.
Frontend (See it in action)
Backend (Username: umlayerednav / Password: umlayerednav123)
- Free lifetime updates
- One year free support
- 25-day Marketplace refund policy
Technical SpecificationsBack to top
Adobe Commerce platform compatibility
Open Source (CE): 2.3 (current), 2.4 (current)
Commerce on prem (EE): 2.3 (current), 2.4 (current)
Commerce on Cloud (ECE): 2.3 (current), 2.4 (current)
25 January, 2021
Extensions, Content & Customizations, Site Search & Navigation
Chrome, Firefox, Opera, Safari, Edge, IE
Quality ReportBack to top
All tests were conducted on the latest versions of Adobe Commerce that existed for the compatible release lines at the moment of the extension submission. Latest versions of all other software were used, as applicable.
Release NotesBack to top
- Compatible with Open Source (CE) : 2.3 2.4
- Compatible with Commerce on prem (EE) : 2.3 2.4
- Compatible with Commerce on Cloud (ECE) : 2.3 2.4
- Stability: Stable Build
+ Added compatibility with Magento 2.4.x
- Compatible with Open Source (CE) : 2.3
- Stability: Stable Build
+ Added improvements
SupportBack to top
The best place to start if you need help with a specific extension is to contact the developer. All Adobe Commerce developers have both a contact email and a support email listed.Contact Vendor