Layered Navigation Adds a Horizontal Filter Bar on Category Pages
Categorized as : Magento 2 Extensions
While surfing the net in search of products, in 2021 the last thing you expect is to get tangled up in poor site navigation. A quick and easy layered navigation system is no longer a nice-to-have, it’s mandatory in order to succeed in online commerce.
Layered Navigation for Magento 2 is a highly customizable solution developed by Aheadworks to improve overall usability and the convenience of catalog navigation for customers. It is designed to speed up the buying process with multi-filter mode, price sliders, filter icons, and more. With well-organized catalog navigation, your Magento-based store will help visitors to find the wanted items faster and in this way boost your sales.
Benefits of Magento 2 Layered Navigation by Aheadworks
Magento 2 Layered Navigation by Aheadworks supplies vendors with configurable filters, comprehensible automation, quick reloading, and SEO-friendly operation. It saves customers significant time and improves shopping experiences with intuitive and stress-free catalog navigation.
The following features enhance the native Magento catalog navigation functionality and speed up the process of searching:
1. Horizontal Filter Bar
Magento 2 Layered Navigation allows merchants to choose the desired filter menu form: horizontal or vertical (dropdown). The ability to use horizontal filter bars is undoubtedly beneficial for small business owners whose stores have a one-column layout on category pages. This way, shoppers get a great opportunity to smoothly navigate through the store catalog.
Configure Horizontal Filter Bar in Magento 2 Layered Navigation
The layout of category pages can be configured on the Categories settings page in the Magento 2 admin: Catalog → Inventory → Categories. You can just choose the ‘1-column layout’ option in the Layout section and benefit from the fully adjusted navigation bar!
2. Configurable Filters
The smart layered navigation system can significantly influence the entire journey and final result of browsing in the online store. Filters are core to the process, able to make it convenient and smooth for customers. Magento 2 Layered Navigation provides configurable filters for various attributes. They are simply operated by single- and multi-select modes, allowing customers to choose either one of several attribute values within one product attribute.
Manage filters in Magento 2 Layered Navigation
To enable filters and modes, go to Catalog → Layered Navigation by Aheadworks → Manage Filters. The Magento Filters grid contains several columns, including Filter, Code, Type, Status, Status in search, and Position. Here you can add, edit and customize filters of different types: price filter, “new”, “on-sale”, “in stock”, etc. Besides, you can sort and filter all the provided filter options in order to get quick access to the one you want to manage.
3. Customizable swatches
To support filters and their attributes with visualization Magento 2 Layered Navigation allows using native Magento swatches. They can be easily browsed and managed via Swatch Grid.
Edit swatches in Magento 2 Layered Navigation
To add and edit swatches, go to Catalog → Layered Navigation by Aheadworks → Manage Filters. Choose a filter you want to customize and add necessary edits to the Manage Swatches section.
4. Scrolling settings
The extension offers a variety of scrolling settings. Merchants can use a scroll bar instead of “Show X more / Show less”. The scroll depends on the block height, so customers can easily perceive it. In case merchants want to avoid scrolling, they can define the number of values unfolded.
5. Hidden attributes
After filtering the catalog, some product attributes get unavailable but still stay visible. Merchants can hide unavailable ones for a particular product selection, so it doesn’t distract the customers. Besides, merchants are proposed with facets and filter configuration. The disabled facet turns gray and moves to the bottom of the page, while filters can be added to the sidebar.
Configure hidden attributes in Magento 2 Layered Navigation
To hide unavailable filters and attributes, proceed to Stores → Settings → Configuration → AHEADWORKS EXTENSIONS → Layered Navigation → General Settings. Pull yes next to Hide attribute values if they are not available. The option also decreases the page load time and advances the search process.
6. SEO improvements
7. AJAX reloading
Magento 2 Layered Navigation supports AJAX reloading, which refreshes only produce results instead of an entire page, showing matching items immediately after the filter is selected. It saves customers time and speeds up the website work significantly.
Enable AJAX reloading in Magento 2 Layered Navigation
To add configuration, go to Layered Navigation → General Settings. Choose the yes option next to Enable AJAX to set only product block reloading, otherwise, the whole category page will be reloaded.
Conclusion
Creating quick and intuitive navigation can become super easy with Layered Navigation for Magento 2. Its multiple features cover not only navigation but also loading and SEO issues. To learn more about the extension, visit the product page and read the user guide.
