WooCommerce product filter

Plugins, Tips, WooCommerce Tutorials

How to Customize the WooCommerce Product Filter

Allowing customers to filter products in your WooCommerce store is one of the simplest ways to improve user experience and increase sales. WooCommerce product filter options make it easier for customers to quickly find products and add them to the shopping cart.

However, the standard product filter options that come with WooCommerce are fairly basic. So by the end of this article, we’ll have shown you 2 ways to customize your product filters with the help of some plugins.

How to add product filters to WooCommerce

First thing’s first, let’s get your product filters set up and running.

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.

When you first set up your store, you might find the 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.

WooCommerce no sidebar
WooCommerce store with no sidebar

So, to add your product filter widgets, take the following steps:

  1. From your WordPress dashboard, go to Appearance > Widgets.
    • On this page, you’ll see a bunch of widgets with titles like ‘Archives’ and ‘Basket’ on the left. You’ll also see the widget ‘areas’ on the right. These might include ‘Sidebar’, ‘Footer Column 1’ etc, depending on your theme.
WooCommerce filter widgets
  1. We’re looking to include some of the key product filter widgets in the sidebar. This includes ‘Filter Products by Price’, ‘Filter Products by Attribute’, and more.
  2. To add these, drag the widget on the left, over to the Sidebar widget area on the right. Do this until you’re happy with your added filters.
add WooCommerce product filters
  1. At this point, you can customize each filter widget by changing its title and more. You don’t need to save this page because it saves automatically.
  2. Once happy with your selection, view your store on the front end of your site and your new product filters will be added.
product filters added

Now we have your product filters set up, let’s give them a boost with some plugins.

Improve product filters with a WooCommerce product filter plugin

The standard WooCommerce product filters do a good job of allowing customers to sort through products and find what they’re looking for. But they could be working harder. 

Below we’ll outline a few ways you can improve your product filters to help you make more sales and improve your customer experience too. All with the help of some plugins.

Filter and show variations as single products

WooCommerce Show Single Variations allows you to show variations on the WooCommerce search and filter results pages as if they were ‘simple’ or single products. These then link through to the parent variable product page with the options pre-selected.

By doing this, filtered products will show relevant variations and images rather than a generic parent product. Customers won’t have to go to the single product page to select the correct variation using dropdowns.

The more accurate you make your filter and search results, the higher the chance for a sale!

Start your 14-day free trial of Show Single Variations

Start your free trial now and instantly show variations as single products in your product filters.

or learn more

Add color and image swatches to your product filters

In WooCommerce, variable product attributes are displayed as simple words with checkboxes when filtering. 

checkbox filter woocommerce
Standard WooCommerce filter attributes

While browsing the products in your store, customers have come to expect a better experience. 

By adding color and image swatches to your product filters with WooCommerce Attribute Swatches, you’ll give customers a much more visual way to browse. One that will help them find the product they’re looking for, faster.

attribute swatches woocommerce
Filters now using swatches using WooCommerce Attribute Swatches

Not only this, but with WooCommerce Attribute Swatches you can change the appearance of any attribute in your store’s filter options. Attribute Swatches allows you to use anything from color and image swatches to text-based and radio buttons.

text buttons attributes
Filters using text-based buttons using WooCommerce Attribute Swatches

Start your 14-day free trial of WooCommerce Attribute Swatches

Start your free trial now and instantly add color and image swatches to your WooCommerce variations.

or learn more

Get customizing your WooCommerce product filters

Giving customers the ability to filter WooCommerce products by variation can help you increase product visibility and boost sales. Similarly, giving them a better visual experience with attribute swatches will help them find what they’re looking for, faster.

Making these changes to your WooCommerce product filters will be invaluable when looking to increase sales in your online store.

Get both up and running with a 14-day free trial:

Avatar

Gina is our in-house content creator and partnership manager. She’s passionate about working with plugin companies with copywriting/storytelling, content creation & marketing.

She can typically be found tending to her vegetable garden, writing, and travelling to mainland Europe.

1 Response

Avatar
Jigar shah 1 year ago

great source for us, thanks for sharing these all the details and quite useful

Leave a Reply

Your email address will not be published. Required fields are marked *