How to Enable Advanced Layered Navigation in Magento 2

Imagine you are standing next to a huge shelf with various all season shoes and looking for white and black winter sneakers. How to find necessary products in that wide range of items? Your customers face the same situation searching for specific items among thousands of products within one store. Thanks to the high-speed technology fast and convenient product navigation is one of the crucial part of attracting more customers and increasing sales.

Running a website with good navigation helps to improve search process by selecting several attribute values at once, for example multiple colors and brands. By default Magento 2 allows to pick one value from each attribute limiting products selection. The Layered Navigation extension for Magento 2 allows to select multiple attribute values at once updating the results only.

What is Layered Navigation?

Layered navigation allows to search products based on categories, colors, style, material, prices and other available attributes. The navigation menu is available in the left column of category pages and search results pages. Customers can check necessary values within the attribute narrowing the suggestions by certain criteria. Each attribute can be configured to display the number of matching products found.

The default layered navigation is based on product attributes and categories as filters. Users can open attributes one by one and select a value per each attribute. The plugin extends this functionality. Customers can get access to specific products easily by choosing multiple values at once, for example the Nike summer running shoes of different colors for men within certain price intervals.

Before configuring the main advanced layered navigation settings, let's enable the necessary attributes to be shown on the catalog page and search results page as well.

How to Enable Attributes for Layered Navigation

To make certain attributes visible on the catalog pages and search pages open the attribute settings following Stores > Attributes > Product. Let's enable the "material" attribute to be visible on Frontend.

A. Choose "material" on the grid and open the Storefront Properties section.

B. Select "Filterable (with results)" in dropdown "Use in Layered Navigation" to show on catalog pages.

C. To make "cost" visible on search results page, choose "Yes" in the "Use in Search" dropdown. Then select "Yes" in "Use in Search Results Layered Navigation" as well.

D. Save the changes.

How to Configure Advanced Layered Navigation

After the extension has been installed, you can find the general settings following STORES > Settings > Configuration > ITORIS EXTENSIONS > Layered Navigation.

By default Magento 2 allows to expand one attribute only. The extension helps to open multiple attributes and defines sections to be opened by default. For example, you can make "Size", "Price" and "Category" expanded by default.

After you install the extension the slider will be available for the price attribute. You can filter the prices using the slider or the "from-to" input boxes. If the sliders are disabled, the intervals will be shown as checkboxes.

How to Manage Advanced Layered Navigation on Frontend

The Layered Navigation extension allows to open multiple attributes and select several values. For example, you are looking for sport tees within a specific price range. You can choose sizes, define the prices, brands and more. Let's select several values and see the final search results. The extension also generates the URL including all chosen values allowing to share with a third party.

Automatic Color Swatches and Product Count

Does your customer prefer gray jackets only? Let customers pick the color in the attribute and apply it to all found products. Users can also check the number of products next to each attribute value.