How to Set up Product Filters for Your Variations

Using Show Single Variations, you’ll be able to allow customers to filter products via their attributes and have single variations show as a result.

We’ve walked you through how to do this briefly in a previous guide. But in this guide, we’ll go into a little more detail and help you set up your product filters from start to finish.

How to set up your product filter sidebar

When you first set up your store, you might noticethe sidebar on your main shop page is missing. This isn’t because it’s not there. It’s simply because you haven’t added anything to the sidebar yet.

Depending on your store’s theme, these steps might look slightly different. So make sure to check your theme’s documentation if you get stuck.

Take the following steps to set up your product filter sidebar:

  1. From your WordPress dashboard, go to Appearance > Widgets.
    • On this page, you’ll see the widget ‘areas’ in the middle of the screen. Depending on your theme, these might include ‘Sidebar,’ ‘Footer Column,’ etc.
  1. We want to add product filters here, so click the plus icon in the Sidebar widget area.
add new widget woocommerce
  1. Then type into the search field ‘Filter Products by Attribute.’
filter products by attribute woocommerce
  1. Once this appears, click on it to add.
  2. You’ll then be able to select which attribute you want to add as a filter. Once selected, click Done.
add color attribute widget woocommerce
  1. Repeat this until you’ve added all your product filters.
filled widget area

Now we’ve set up your filters. We can amend your product variations to show as single products when the filters are used.

How to have product variations show as filter results

To do this for individual products, take the following steps:

  1. Go to Products > All Products in your WordPress dashboard.
  2. Select the variable product you want to edit.
  3. Scroll down to the Product Data section of the page.
  4. Click the Variations tab on the left.
show single variations tab
  1. Click the expand arrow on the variation you want to show in your filter results.
  2. Once expanded, you’ll be able to see a bunch of new options, all added by Show Single Variations.
  3. Click the checkbox next to Show in Filtered Results?
show single variations show in filter
  1. Once you’re happy, click Save Changes in the Product Data section of the page and then scroll up to the Publish section of the page and click Update.

If you want to do this for all product variations in bulk, take the following steps:

  1. From your WordPress dashboard, go to WooCommerce > Show Single Variations and click the Index tab at the top.
  2. Next, click the Run Indexer button.
show single variations index
  1. A popup will show, allowing you to show all product variations in various places. Select the locations you want and click Next.
show single variations visibility
  1. The next screen will allow you to set the variation product visibility (the parent variable product). Click the radio button next to the option you want and click Submit.
  2. Wait a few moments, and all your products will be updated.

Now when you view your shop pages, filter, or search, you’ll be able to see the products you’ve edited displayed as individual products.

show single variations
Variations as individual products

How to improve your product filters further

Setting up your product filters in this way will vastly improve how your customers search for and find products. But if you want to improve them further, you can do so in a few different ways.

Upgrade filter attributes with swatches

In a standard WooCommerce store, attributes in your product filters are either displayed as text with checkboxes or dropdowns.

To give customers a better experience, we recommend using WooCommerce Attribute Swatches to transform your product attributes into color, image, and modern text swatches.

When your attributes are more visual, customers can filter with confidence and find the product they’re looking for faster.

WooCommerce Show Single Variations

Display individual product variations of a variable product in your product listings. Make it easy for your customers to view and filter product variations.

Create advanced product filters

If you’re looking to get a bit more advanced with your product filters, we recommend Barn2’s WooCommerce Product Filters plugin.

This plugin allows you to add filters for any type of product data you want. It updates results using AJAX instead of reloading the page, improving user experience. WooCommerce Product Filters also allows you to upgrade your product filters with dropdowns, checkboxes, radio buttons, swatches, and more.

WooCommerce Product Filters works well with Show Single Variations, so all you need to do is install the plugin, set it up as you want it, and it will take care of the rest.

WooCommerce Show Single Variations

Display individual product variations of a variable product in your product listings. Make it easy for your customers to view and filter product variations.

Was this helpful?

Please let us know if this article was useful. It is the best way to ensure our documentation is as helpful as possible.