Your online store starts with adding a Store widget to your project. Then, you can add products to your store, enter their details, and upload images (here, you can read about managing products).

Once your product catalog is up and running, you need to introduce product filters. They are indispensable for better conversion of your online store’s visitors as they enable your customers to find their desired products easier and faster. So, filters can help improve your visitors’ shopping experiences and boost your sales. 

Your visitors can employ filters to refine the search by availability, prices, categories, brands, special offers, colors, sizes, and so on. When you assign new qualities to your product, you get yet more filters to cater to your visitors’ needs. Find more info in our Managing Product Attributes article.

An algorithm of your filters: 

  • shows a number of products that come under the filter and updates it with every new filter; 
  • hides the unavailable options to avoid zero result searches; and
  • enables your clients to select multiple options and compare products much better.

Enabling filters

It is simple to set filters. To enable product filtering, follow these steps:

  1. From your Store Manager, go to Settings — Product Filters.
  2. Click Enable Filters.

Using the information about your products (price, stock level, category, size, color, or brand), the store enables a list of filters relevant to your catalog.

Note:

You can add filters manually if you don’t see a required filter among the suggested options.

The activated filters appear within your categories. You can visit a product category and click Refine by to see the filter panel.

Tip:

If you have multifaceted information about your products (various options of size, color, etc.), you can manage product options. To do so, read our Managing Product Options article.

Tip:

You can group your products into categories to make it easier for customers to find them in the store. Read our Managing Product Types article to learn more. 

Adding new filters

When you switch on filtering options, the most useful filters are created automatically. Their position on the list is determined by the number of products that match a specific filtering criterion. You may also add new filtering options to the list.

To add a new filter:

  1. Go to Settings — Product filters from your Store Manager.
  2. Click Add Filter Criteria. 
  3. Hit Add.
  4. Enable the new filter you’ve just added.

If no filters are suggested on the page, it means the store could not find more filtering criteria for your products. To create the criteria, you can add new product attributes. Suppose you sell dresses with different sleeve lengths but haven’t specified them yet. To create a Sleeve length filter:

  1. Go to Settings — Product Types from your Store Manager.
  2. Create a new product attribute.
  3. Go to your Catalog and click Edit on the product to be filtered by this attribute.
  4. Open the Attributes tab, specify values to the attribute field, and then save the changes.
Note:

Attribute names and values with identical spelling are handled as a single filter. If their case or spacing differ, they are processed as two distinct filters.

5) Go to Settings — Product Filters and click Add Filter Criteria.
6) Add the created attribute as a new filter.

Managing filters

You can remove and sort your filters based on your current requirements. If you need to temporarily disable an active filter, you can do it this way: 

  1. Go to Settings — Product filters from your Store Manager.
  2. Switch the toggle to the Disabled state.

To remove the filter altogether, click Actions — Delete.

You can change the filters’ order in the storefront this way:

  1. Сlick Actions — Sort.
  2. Drag and drop filters to sort their order.

Expanding filters in categories

As a rule, the filter panel is collapsed, so if customers want to see the complete list of category filters, they need to click Refine by. To streamline the shopping process, you can unfold filters and display the panel right on the category page. It will let customers see all the filters at once and will cut search time.

The expanded view suits apparel shops best of all. It can also benefit other shop types by offering a more refined image of the items inside the category, thus, encouraging customers to keep shopping. 

Note:

Customers can hide the filter panel at any time. They just need to click Refine by at the top of the category.

Caution!

Currently, you cannot expand the filter panel on your store’s front page. Still, you can see it after you click on Refine by.

To expand product filters:

  1. Go to Design.
  2. Scroll to Storefront navigation & colors.
  3. Find the Product filters section and select Expand in the drop-down menu.

All changes are autosaved. If you don’t need the expanded filter panel anymore, you can collapse it in the same way in the Design menu.

If you want to get more from the Store Widget, please check the article about its paid plans. 

We hope this article has illuminated for you how to manage product filters in your online store.

Now, it’s time to start managing product filters on your website as you wish.

Go to Editor