Large product catalogues often make it difficult for shoppers to find what they are looking for, especially if you keep too many options on one page. Although you can fix that using pagination in Magento, only Magento 2 layered navigation helps to narrow down products based on price, colour and multiple other attributes.
This guide explains how to configure layered navigation in Magento 2 effectively and how to avoid common SEO pitfalls along the way. You'll also find the most popular layered navigation extensions and learn how to avoid issues related to the filters.
- Magento layered navigation allows filtering products by price and product attributes, e.g., color, size, brand, material.
- Missing filters in layered navigation are often caused by incorrect category or attribute settings.
- Reindexing Magento and cleaning cache can troubleshoot many layered navigation issues.
- Default layered navigation can be extended with third-party extensions that offer more advanced filtering functionality.
- Layered navigation in Magento creates multiple parameterised URLs and requires an SEO extension like Magefan SEO Suite to avoid duplicate content and indexation issues.
What is Magento 2 Layered Navigation?
Magento 2 layered navigation is a built-in filtering system that allows customers to filter products based on price, brand, colour, size, or other product attributes. Layered navigation is already set up in Magento by default. It usually appears on the left side of the Magento product listing on certain categories and search pages.
Layered navigation narrows down product results so customers can quickly find exactly what they need, not only on desktop, but especially on mobile devices.
e.g. without navigation, if customers visit a fashion store with 1,000 products, they would need to scroll through hundreds of pages before finding brown Puma sneakers under $100.
When customers apply those filters, Magento automatically shows the items that match, thus helping to search for a preferred product more quickly.
How to Configure Layered Navigation in Magento 2?
To configure Magento 2 layered navigation, go to Stores > Configuration > Catalog > Catalog > Layered Navigation and configure how pricing and attribute options will be used. Even though Magento offers layered functionality out of the box, it's recommended to add additional configuration relevant to your store to make filtering fully functional and user-friendly.
Step 1: Configure price filter in layered navigation
The first option in the layered navigation settings is the price filter. There are two main options: product count and price navigation step calculation.
- Display Product Count defines whether to display the number of products corresponding to product attributes, price, or category near the layered navigation options, e.g., Black (20), White (15), Blue (10).
- Price Navigation Step Calculation determines the method used in the price navigation step.
There are three price calculation options here.
Automatic (equalize price ranges)
With this method, price navigation steps in layered navigation are calculated automatically based on the price range of products (the lowest and highest prices) in the group.
e.g. the price in this case is displayed in intervals like $0.00 - $49.99, $50.00 - $99.99.
Automatic (equalise product count)
In this method, price navigation steps are calculated automatically based on the number of products in the group. Once you choose this option, new fields appear:
- Display Price Interval as One Price, which you need to enable in case all prices in the specific price interval are equal.
e.g. if you have 15 different T-shirts (different colours, sizes, brands) in the "T-Shirts" category and each costs $19.99, the sidebar price filter will look like $19.99 (15).
- Interval Division Limit, or the number of products that will not be divided into subintervals.
e.g. if you have an "Accessories" category with only 7 products and their prices are $5, $6, $8, $12, $15, $22, $30, Magento will display the price filter as $5.00 - $30.00 (7) (in case you set the division limit to 9).
Manual
According to this method, admins have to define price ranges for layered navigation manually.
The following options are available for the Manual price step calculation:
- Default Price Navigation Step that determines the number of products included in each step.
e.g. if you have a "Shoes" category with products priced from $10 to $160 and you set the default price navigation step to 50, the sidebar will generate these price ranges: $0.00 - $49.99, $50.00 - $99.99, $100.00 - $149.99.
- Maximum Number of Price Intervals defines the maximum price step available in the Magento 2 layered navigation.
e.g. if you keep default price navigation step at 50, for a category with products ranging from $20 up to $5,000, the $50 step would force Magento to generate 100 filters. By limiting the maximum number of price intervals to 3, you tell the system to build the first two intervals normally - $0.00 - $49.99, $50.00 - $99.99, and all the remaining price ranges into $99.99 and above.
Step 2: Configure filterable attributes
Magento doesn't include product attributes in the layered navigation by default. So, in case you want customers to filter products by attributes in a layered navigation, you have to add them for filterable options.
Note: not every product attribute is compatible with layered navigation. Magento supports only dropdown, multiple select, or price input types.
If there is no attribute you'd like to include in the layered navigation, first create product attribute in Magento and then assign it to an attribute set.
To add a product attribute to layered navigation in Magento:
1. Navigate to Stores > Attributes > Product and choose the attribute you want to include in the layered navigation.
Note: you can see that Use in Layered Navigation has already been added to the product attribute options.
2. Go to the Storefront Properties section of the Attribute Information.
3. Select Filterable (with results) from the Use in Layered Navigation select box to show the number of products in the category associated with this attribute. Select the Filterable (no results) option if you don't want to display the number of products.
4. Choose Yes in the Use in Search Results Layered Navigation for this attribute to be shown on the search results pages layered navigation.
Don't forget to Save Attribute once you finish and check product attributes on the frontend category.
Step 3: Enable layered navigation on Magento category
To add the layered navigation to the Magento 2 category page, navigate to Catalog > Categories, select a Category and enable the Anchor option in the category Display Settings.
A layered navigation menu will be displayed on every category on which this option is enabled, which is great if you have multiple categories on your website.
Step 4: Customize layout
You can change the place of the layered navigation on the page by configuring the Magento category design. To achieve this, go to the Catalog > Categories > Design and change the Layout to one of the available options:
- 2 columns with left sidebar
- 2 columns with right sidebar
- 3 columns layout
Once you fill out all these options, your customers will benefit from a faster catalog search through price and attribute filtering. However, you can achieve even more with a proper layered navigation extension.
Best Layered Navigation Extensions for Magento
Default Magento layered navigation helps a lot when it comes to filtering product attributes. However, it is still not enough to satisfy the needs of empowered shoppers.
Therefore, to exceed default Magento functionality and increase your conversion rates, you need Magento layered navigation extensions. There are several solutions worth your attention.
Magento 2 Layered Navigation Extension by Mirasvit
This extension lets you enable multiple filtering options for the same attribute, select multiple filters at once, add convenient sliders, and apply eye-catching images to attribute values.
What is more, the extension analyses what filters are used more frequently and displays them at the top of the product list. You can offer your customers to filter through products by product attribute groups, sales, rating, availability, and new arrivals.
(Attribute multi-select in layered navigation - Mirasvit Demo)
Magento 2 Layered Navigation Extension by Plumrocket
Another great option for product filtering is Plumrocket. It also allows you to customize the layered navigation bar, create custom filters, set the sort order, group filter attributes, and much more.
Powered with AJAX, this Layered Navigation module for Magento allows you to handle catalogs of any scale. The latest tests run by Plumrocket proved the extension's ability to work with 80.000+ product databases where 1200+ products are displayed per page.
(Layered navigation - Plumrocket Demo)
Layered Navigation for Magento 2 by Aheadworks
With this extension, you can allow customers to select single or multiple filters provided in different display modes: buttons, checkboxes, matches, text fields, etc.
It also offers a convenient category tree option available on any catalog page. Your customers can reload a page after applying filters manually, or you can improve their experience and show filtered products instantly, without reloading.
(Product filters - Aheadworks Demo)
Layered Navigation by Amasty
Once you scroll through their product page, you'll notice that the Layered Navigation by Amasty is very similar to the one by Mirasvit. They also pay close attention to the brands and filter usability options. However, there are a number of unique features we'd like to focus your attention on.
Except for a variety of filter display modes and attribute mapping options, you can enable the search box and a tooltip for every filter. It is extremely useful since it allows customers to search for products not only globally but within a narrow group of products.
(Layered navigation - Amasty Demo)
Layered Navigation extension by Mageworx
Magento Layered Navigation by Mageworx offers your customers the ability to select one or multiple attributes, show specific attributes on certain categories, and enable a multi-select option for each attribute.
Besides, you can define whether to collapse or expand the layered navigation filters. It is still a great option for those who need to exceed the default Magento functionality and offer advanced filtering.
(Layered navigation setting - Mageworx Demo)
Magento 2 Layered Navigation by Mageplaza
Last but not least — the Mageplaza extension for Layered Navigation. You might think this one can't surprise you with anything since you've already heard about so many awesome features. But the Mageplaza module, in fact, has something unique to offer.
Besides the AJAX loading, which allows showing products instantly after the filter is applied, you can benefit from the AJAX search. This feature allows you to load search results in a dropdown after the first letter of the keyword is typed.
What is more, you can set the 10 most-viewed, bestselling or new products to be displayed when customers press on the search option. It is a great feature if you want to encourage more sales.
(AJAX catalog search - Mageplaza Demo)
Layered Navigation Issues (With Fixes)
To fix layered navigation issues in Magento, first try reindexing Magento and flushing the cache. In many cases, layered navigation filters do not appear or work as expected because Magento is still using outdated index or cache data. Therefore, run the following commands:
php bin/magento indexer:reindex
php bin/magento cache:clean
php bin/magento cache:flush
However, sometimes, the problem can be related to category or product attribute settings. So, here is a list of the most common layered navigation issues and the ways to fix them.
Filters do not appear
If filters do not appear at all, check whether the category is set up as an Anchor category. If this setting is disabled, Magento won't be able to show filters on a category page.
Navigate to Catalog > Categories > Display Settings and check whether the Anchor is set to Yes.
Filter options are missing
Since Magento only displays filter values that are assigned to products, review the following:
- whether products contain attribute values
- whether the products are enabled and assigned to a category
- whether Use in Layered Navigation is Filterable
Newly added products do not appear in filters
This issue sometimes occurs after attribute, category, or mass product updates, or product imports.
These changes may make Magento indexes outdated. In this case, reindex Magento to rebuild product and filter data.
Filtering shows no products
This happens when products are disabled, out of stock, lack attribute values, or are not assigned to a category.
In this case, check the product settings carefully and reindex Magento.
Attributes do not appear in layered navigation
If attributes are not configured as filterable, they won't appear in layered navigation. Therefore, go to Stores > Attributes > Product, open the attribute, and check if the Use in Layered Navigation field is set to Filterable.
You may also have to scroll down to the Storefront Properties section to set Visible on Catalog Pages on Storefront to Yes. After saving the attribute configuration, don't forget to clear cache and reindex your Magento.
Magento Layered Navigation SEO Best Practices
Magento offers limited layered navigation SEO options which are not enough to prevent duplicate content issues, wasted crawl budget, and indexing problems. You need to use a dedicated SEO extension like Magefan to optimise layered navigation URLs, metadata, and meta robots.
Follow these layered navigation SEO best practices.
Index only valuable filter pages
Every time customers apply filters, Magento generates a new URL:
/men/tops.html
/men/tops.html?color=black
/men/tops.html?color=black&size=m
/men/tops.html?color=black&size=m&brand=nike
If search engines index all of them, your store can quickly end up with thousands of identical pages competing with each other.
Since search engines operate on a limited crawl budget, they may waste time crawling these filtered pages rather than discovering and indexing your most important ones.
Therefore, allow indexing of filter pages only when they target keywords your customers are looking for. Otherwise, just block pagination pages from indexing by setting NOINDEX FOLLOW robots for all or specific filters in bulk, using the Magefan SEO rules.
Example of the meta robots setting for layered navigation weather filter in Magefan SEO rules
Optimize the filter pages that have ranking potential
If your filtered pages target popular search queries like "running shoes" or "waterproof hiking boots", they deserve to rank.
Optimize these pages with unique H1 headings, meta titles, and meta descriptions. This improves click-through rates for search results and attracts valuable organic traffic.
Create SEO-friendly filter URLs
Default layered navigation URLs provide little keyword context. They often look like this /men/shoes.html?color=black&brand=nike.
To make them more user-friendly, consider using cleaner URLs such as /men/shoes/nike/black. This way, not only shoppers but also search engines will recognise the keyword hierarchy of your store and map out your site structure better.
Set up canonical tags and unique metadata for filter pages
Search engines treat filtered URLs as separate pages, even when they show identical products.
e.g., "/men/shoes.html", "/men/shoes.html?brand=nike", and "/men/shoes.html?brand=nike&color=black" may show the same pair of shoes, making it difficult for search engines to decide which page they should rank.
So, to avoid duplicate content issues, you have to specify the main version of the page for search engines using Magento 2 canonical URLs. In most cases, it's recommended to point the canonical tags of filtered pages to the parent category page "men/shoes.html", unless they target valuable keywords.
Alternatively, you can add filterable options to the filter page title and metadata using the Magefan SEO Extension.
Layered navigation SEO options in the Magefan SEO Extension
This way, you prevent similar filter URLs from competing against one another in search results.
Monitor filter pages' performance in search results
Both your products and customer searches will change over time. Monitor which filter pages get traffic, which ones rank in Google, and which users ignore.
This information helps you improve crawl efficiency and make search engines focus on the most valuable pages.
FAQs
Which attribute types support Magento layered navigation?
How do I refresh layered navigation in Magento 2?
php bin/magento indexer:reindex
php bin/magento cache:clean
Why are Magento filters not showing?
How to noindex nofollow layered navigation pages in Magento?
Should I noindex all filter pages in Magento?
