How to configure layered navigation filters
This guide provides a comprehensive overview of how to configure filter behavior, appearance, and SEO settings. To configure your Layered Navigation, go to Stores -> Configuration -> Layered Navigation Filters.
The following steps should be sufficient for the initial setup of filters and their seamless integration into the store interface.
After saving the configuration, clear the Magento cache to apply changes.
1. Configure behavior of filters
If you want to shorten the time it takes for results to appear after a filter is applied, choose Yes in Enable AJAX filtering option. This ensures that only filter-related information is loaded without the need to reload the entire page.
Next, decide how filters will be applied by configuring the Filters application mode option. Choose between applying filters instantly or requiring a button click (a confirmation window will appear when selecting an option). If you choose the Instantly option, you can still allow mobile users to apply filters via a button click by enabling the Apply filters by button click on mobile option, separating desktop layout from mobile layout in Screen width breakpoint configuration.
Define whether to dynamically pre-calculate filter option combinations using the Options counts precalculation setting, which allows predicting number of results (products shown) on product listing pages. This is allowed if you have previously selected By button click.
Then, select how a listing page will react to filtering with the Scroll to top after filtering option. You may set it to scroll up or stay at the position where the filter was activated.
If you want to allow your users to select multiple options within a single filter to create more complex and result-narrowing filters, Enable multiselect.
While scrolling down the page in a large category, you may notice that the filters disappear. To prevent this, enable the Sticky sidebar, which keeps your sidebar in a fixed position.
2. Configure filter appearance settings
If your theme is specific and requires all elements to follow a consistent visual style, navigate to the Appearance settings -> Filter Appearance section. There, you can change the filter option selection mark using the Filter selection display style and customize it with the Selection border and mark colors for all options, as well as the Selection background color for selected options.
Aditionally, here you can set whether to Show expanded filters by default — when opening any category page, the filters will already be expanded. This option is useful if want to promote top filters.
Next, customize how filter options appear in the Filter options appearance section, adjust filter link highlighting in the Link highlighting section, and set colors for slider-type filters in the Price slider styling section.
3. Configure SEO settings for filtered pages and filters
We recommend consulting with your SEO specialist to determine the most effective solution.
Navigate to the SEO settings section. There, you can configure how search engines handle filtered results pages using the Meta header for filtered pages setting, where you define instructions for robots, specifying whether they are allowed to index and follow the results.
Set the canonical links format for filtered results pages using the Canonical links for filtered pages setting to ensure the content of your store appears unique and not duplicated to search engines.
In addition, you can configure the Rel attribute for filter links to specify whether robots should follow the links in the filter.
To learn more about additional features, such as:
- Additional filters — extra filters based on dynamic attributes
- Horizontal filters — additional filters at the top of product listing page
- Filter clear block — block to discard applied filters
- Product attribute links — shows attributes as links on detailed product pages
Please refer to the appropriate sections on the layered navigation filters page.