WooCommerce: How to Enable Product Filters (i.e. “Ajax Filters”)?

If your WooCommerce store has many products, online customers might get easily lost. There might be way too many pages to visit (“product pagination”) before finding the product they’re looking for. Needless to say, this is a huge loss for your business. Possibly, they’ll never come back.

If you shop on popular ecommerce websites such as Amazon and eBay, you know they carry a billion products each or so. Thankfully, on top of the very useful search bar, these websites provide “product filters” in the sidebar. You can refine by price, reviews, tag, category and so on; the website won’t “refresh” but instead it will return the filtered results immediately on that same page.

These are called “Ajax Product Filters” (Ajax is a set of applications that run in the background without forcing a website page refresh). And as Amazon and eBay just proved to you, these filters are absolutely a must if you have 100+ WooCommerce products.

Luckily, there are plugins for that. And they’re either free or quite cheap when you compare this small cost to your potential Return On the Investment (ROI).

Besides, if you have lots of products you also already have several WooCommerce product categories, product tags, product attributes, product custom fields, prices, stock statuses. This means that implementing Ajax Product Filters in your WooCommerce store might be a matter of 10 minutes: activate the plugin, choose the filter criteria and your users will automatically see a smooth filter widget in the sidebar!

So, what are the best “WooCommerce Ajax Product Filter” plugins?

1. WooCommerce Default Product Filter Widgets (FREE)

Surprise 🙂

WooCommerce gives you product filter widgets by default. To use WooCommerce inbuilt filters, go to Appearance > Widgets and drag & drop the following filters in your sidebar: “Filter Products by Attribute“, “Filter Products by Rating” and “Filter Products by Price“.

WooCommerce inbuilt product filter widgets

Some of my test products have an attribute called “Size”, so I set up the “Filter Products by Attribute” widget to filter product sizes. This is all automatic, as long as your products have existing attributes. Now the front-end looks like this:

WooCommerce Shop page with the default WooCommerce product filter widgets enabled

In about 1 minute, I was able to add filters by attribute, rating and a price “slider”. Super easy. However, there two major problems: these WooCommerce filters are not powered by Ajax (hence the page “reloads” after using one of the filters) and they’re way too limited. There are only 3 default widgets, you can only have attribute dropdown or list, only have a price slider and not a list of price ranges á la Amazon… basically you can’t do much with this setup.

You probably need more advanced widgets, more design options, an Ajax-powered system and something more robust yet flexible.

2. Ajax-Enabled Enhanced Layered Navigation plugin by WooCommerce (PREMIUM)

This official plugin by WooCommerce is a great first step towards product filtering perfection. This plugin provides a better UX and more widget options than the default non-Ajax inbuilt product filter widgets.

Once active, Ajax-Enabled Enhanced Layered Navigation plugin gives you an additional widget you can use on the shop / archive / category pages called “WooCommerce Ajax Layered Nav“.

The great thing about this advanced widget is that you can decide how to show the attribute filter on the front-end i.e. as a list, checkbox, drop-down, or label selector / color swatches.

WooCommerce Ajax Layered Nav plugin widget setup and front-end result

Pity there is no demo I can direct you to. You can use as many widgets as you like, but there is no price filter, rating filter, stock filter, etc. This is just for attributes (size, color, etc).

So, unless this is sufficient for your objectives, this plugin is not complete.

3. WooCommerce Ajax Product Filter plugin by YITH (FREE & PREMIUM)

When it comes to YITH, you know they have a WooCommerce plugin for everything… needless to say they also sell an advanced Ajax Product Filter plugin.

Good news is – this also comes as a free version (which does almost the same things as the WooCommerce premium plugin we described in the previous section). Besides, from the plugin page you can view a demo and test the product before purchase.

Once the premium plugin is active, you’ll see 5 new widgets:

  • Ajax Sort by (this sorts products as per the WooCommerce sorting options, but it does it with Ajax!)
  • Ajax Product Filter (sort by attribute / category / tag / brand and display as dropdown / checkboxes / list / swatches / labels)
  • Ajax Price Filter (create price ranges in a filterable list)
  • Ajax Stock/on Sale Filter (add a widget to filter in/out product on sale or in stock)
  • Ajax Reset Filter (reset filters with a single click)

This is the back-end:

YITH WooCommerce Ajax Product Filter back-end

And this is the Shop page once these filter widgets are active:

Shop page sidebar after installing the YITH WooCommerce Ajax Product Filter plugin

You have unlimited filter combinations and can use multiple “Ajax Product Filter” widgets. This means in the same sidebar you can filter by attribute, tag, category, price and/or brand at the same time. And without refreshing the page – results display immediately.

As you can imagine, YITH WooCommerce Ajax Product Filter is compatible with all the other YITH plugins and can therefore do pretty advanced stuff.

You can also “toggle” each widget and make it “closed” by default. Besides, within each widget you can select / deselect which attribute / tag / category should be excluded from the filter.

Yes, this is very flexible. And it works.

4. FacetWP (PREMIUM)

Last but not least, FacetWP, a powerful filtering tool also compatible with WooCommerce, is a very advanced product for developers – if you want to make the most of it some technical knowledge is indeed required. It comes with hooks, shortcodes, performance-driven Ajax coding and integrations.

To add a filter, you must add a shortcode into a text widget or – even better – add it via PHP into your theme files (this means you can also display the filters outside the sidebar).

FacetWP allows you to create several “facets”, i.e. filter displays, such as:

  • Checkboxes
  • Dropdown
  • fSelect
  • Radio
  • Hierarchy
  • Slider
  • Search
  • Autocomplete
  • Date Range
  • Number Range
  • Star Rating
  • Proximity

In regard to WooCommerce, each facet or product filter can target the following data sources:

  1. Price
  2. Sale Price
  3. Regular Price
  4. Average Rating
  5. Stock Status (in stock / out of stock)
  6. On Sale
  7. Product Categories
  8. Product tags
  9. Product attributes

As you can see creating a WooCommerce facet is pretty straightforward:

FacetWP: select the appropriate data source choice such as product attributes, product categories, and so on

FacetWP comes with great developer documentation and is a must-have for advanced projects. If, on the other end, FacetWP is too much for you, then my preference would be the YITH WooCommerce Ajax Product Filter plugin.

5. JetSmartFilters by Crocoblock

JetSmartFilters by Crocoblock is an easy to use plugin with AJAX-based filter system and 9 handy widgets which make a WooCommerce website user-friendly without writing any single line of code:

  1. Rating filter – arranges products by rating.
  2. Visual filter – highly effective for online shops that stock different colors or brands.
  3. Search filter – allows searching either by words or phrases and quickly displays the corresponding results.
  4. Radio filter – provides an option to choose one product or post from the list.
  5. Checkbox filter – lets choosing several options from the checklist.
  6. Date Range – a good option if you are going to filter posts or products based on the date they were added or events by the date when they’re supposed to take place.
  7. Check Range filter – helps to create a range of options in the form of a checkbox list.
  8. Range filter – allows you to set up the search range with the help of a slider.
  9. Select filter – lets choosing options in the form of a drop-down list.

Additional widgets inside the JetSmartFilters plugin help website users to go through the relevant products without refreshing the page, see filters currently applied and remove the necessary ones for more convenience.

JetSmartFilters is closely connected to another addon produced by Crocoblock – JetWooBuilder. This plugin is a must-have tool for ecommerce website creators as it provides versatile options to showcase the products starting from different variations of product grids up to review and rating forms.

Related content

  • WooCommerce: Display “In Stock” Products First @ Shop
    We’ve already seen how to add a custom “Product Sorting” option to the “Default Sorting” dropdown in the WooCommerce Shop page. The task I was presented with, however, was to display items based on a custom “meta key”. Now, if you have no idea what a “meta key” is, don’t worry too much. For example, […]
  • WooCommerce: Display Custom Filters @ WP Dashboard > Products
    If you go to WordPress Dashboard > Products you will find default product admin filters such as “Select a category”, “Filter by product type”, “Filter by stock status”. What if you want to add more custom filters to let your shop managers find products easily? For example, you could add “Filter by product tag” (“product […]
  • WooCommerce: Why & How to Disable Ajax Cart Fragments
    If you’re here it’s because your WooCommerce website is slow and you’re wondering why the “/?wc-ajax=get_refreshed_fragments” URL generates delays and server loads (spikes). Besides, there is too much online literature about WooCommerce Ajax Cart Fragments (including specific plugins and performance plugin options), and you want to learn quickly what they are before understanding if and […]
  • WooCommerce: Ajax Add to Cart Quantity @ Shop
    As you know, you can tick the “Enable AJAX add to cart buttons on archives” checkbox in the WooCommerce settings in order to add products to cart from the Shop / Category / Tag / loop pages without refreshing the page. This is great for certain businesses, especially those who sell in bulk and where […]
  • WooCommerce: How to Show Product Search Suggestions?
    “Ajax Search” (displaying product search suggestions while a WooCommerce user is typing something in the search bar), is a brilliant idea for all of you ecommerce entrepreneurs. Saving time to a potential customer is your number one goal. Besides, if your website has a lot of traffic, search should be one of your sales propositions […]

Rodolfo Melogli

Business Bloomer Founder

Author, WooCommerce expert and WordCamp speaker, Rodolfo has worked as an independent WooCommerce freelancer since 2011. His goal is to help entrepreneurs and developers overcome their WooCommerce nightmares. Rodolfo loves travelling, chasing tennis & soccer balls and, of course, wood fired oven pizza. Follow @rmelogli

38 thoughts on “WooCommerce: How to Enable Product Filters (i.e. “Ajax Filters”)?

  1. Hi There,
    I can’t find any product filter which will work with the variable product and in stock. The issue is let’s say customer is filtering the product with size “M”. Now if shows all the products which have variations “M”. Some of the products does not have stocks with size “M”. How will i show only the products which have stocks with the filtered variations.


    1. Hello Sujon, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

  2. Hi Rodolfo,

    Is there a possibility to synchronise the filters in the categories with those in the search.
    If for example we use woof categories as a plugin it is fine for the filters in the categories but it is not synchronised with the search. Example if I do an ‘x’ search I have filters on the whole set of products instead of just the results.

    Do you know of a plugin that integrates category filters and search filters.

    Thank you

    1. No idea to be honest, sorry. Did you ask the Woof developers already?

  3. Hi, fyi, WooCommerce default filtering has some errors: https://wordpress.org/support/topic/missing-attributes-in-product-filter/
    Its’ not you making a mistake 🙂

  4. hello

    i want to delete the word “all” in y filter, how can i do?

    1. Ask the plugin dev please

  5. Hi there! My client wanna have filters on the page where I am displaying products on sale. But I can’t apply filters over there. I think there must be something special that we need to do to show filters on pages other than the shop page?

    1. It depends on how you coded the products on sale page. You could try placing filters in the page sidebar and see if they work

  6. Hi, I want to enable the filter using woocommerce native filter. I did work but for a reason only the dropdown filter dosent work… Nothing change on the page when I select…

    1. Did you contact WooCommerce support?

  7. Hi,
    Hope all are doing good.

    I realised WooCommerce has several options to filter using widgets and so on. However, my requirments made me to buy JetSmartFilters from CrocoBlock and started using it. I have a clarification regarding “Range Filter”.

    *** I am using “Range Filter” for my products prices, I do understand the price is connected with WooCommerce with query variables. However I need to use “Range Filter” for other attributes also like my manual attributes for measurements (like 5 Cm – 10 Cm – 20 Cm). I tried it but the result is failure. ***

    Can anyone can guide me ?

    Thank you in advance.

    1. Hi Maddy, did you ask the plugin devs already?

  8. Hello! great article, i am looking for a plugin that will use drop down list in order to filter the results, eg
    three dropdown form fields the first will search the vendor, the second the model and the third part category

    is it possible?

    1. I guess so, please ask the plugin vendors

  9. Hi, I’m looking for a simple filtering plugin that will allow me to add above shop products filtering boxes like here https://codepen.io/joe-oli/pen/KKwqRdw. Do you know something?

    1. I think almost all plugins mentioned in this article should let you do that. Maybe it’s worth contacting their support teams to see if they can help?

  10. Hi Rodolfo,
    I have a question which I was not able to find in support forms, could you please can you write me your quick comments please? I want to use two filters for two different categories on one page. Web page for vehicle parts, on home page I am using tab widget and in first tab filter should sort passenger vehicle parts on second tab it should sort commercial vehicle parts. I have already created two different categories with sub categories. Could you please let me know if WooCommerce plugin Products Filter can work in this way.

    1. Ask the plugin developers directly. In my opinion, you can have as many “category filter” widgets as you like, but I’m not 100% sure.

  11. Hi,

    Is it possible to show woo-commerce price filter on custom page?

    1. Syed, thanks so much for your comment! Yes, this is definitely possible, but I’m afraid it’s custom work. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding!

  12. Hi Rodolfo,

    Great article. One of the things that I cannot find on the web is where exactly does woocommerce native product search actually search? Might sound slightly daft but… Somebody searched our website for “Nanny”. I know we have a product variation, in fact 63 variations that contain the word “Nanny” in our florist card catagory. So kind of obvious, it is not searching the variations of a product or I am not optimising the variation for the word “Nanny” to be found. I cannot find anything to give me a clue as to what the product search is actually doing. Can you shed some light on this perhaps?

    Many thanks in advance. Ian

    1. Hey Ian, as long as I remember, it searches for Product Title and Product Description. So if you have a variable product, it will only search through the “parent” product and not its variations.

  13. Great articles. Great website. I have a query. How can I have static sort and filter buttons on archive in woo?

    1. Thank you! The sorting dropdown is already in the shop page, do you mean that one?

  14. Hi I am trying for the last 4 months to make my WooCommerce WordPress site have the same functionality as the site below, but it does not seem to be possible. with any of the Filter extensions offered. Although many extension writers claim that their product is able to do so, and offer money back guarantees instead of definate advice


    On the site above as the Main menu category changes so does the set of attributes available in the widget. INCLUDING THE BRAND.

    Is this possible to achieve WITH WOOCOMMERCE as we have 12 different Main Categories on our WordPress site

    We have set 5 different Woo attributes (visible on the front end) on each of 700 products, and Marked the correct Brand.

    Now I am looking to filter them.

    Another problem we have had in the past (with filters that we have tried) is that the Brand might apply to more than one category

    i.e. The Brand I’ve used here “Clarke” manufacture “Air Compressors” but they also make products in the “Fans & Air Conditioning” category and the “Water Pumps” category. Can ANY plugin make the Brand count separate for each main category so that it only applies to the relevant category even though the Brand might be the same in more than one category?

    I have linked to an image to show what I am trying to achieve.

    Most Grateful for any help you can supply.

    1. Hello Jeff 🙂 If no plugin suits, then you need to custom code it. I’m not sure WooCommerce or a plugin can do that out of the box

  15. Hello,
    I have been reading your articles for some time now, I always learn something new, thank you very much.
    I have a question about product filtering.

    In the top menu bar on white background first on the left is „WYSZUKAJ WG CECH:” button which means SEARCH BY. On hover appears widget with global product attributes and you can search for products by these attributes.

    Currently, I managed to do, that product filtering appears only on store pages (not on static ones) and unfortunately after selecting at least one attribute, the website automatically filters the products, the entire container with filters disappears and reappears on mouse hover. I used the Mega Menu plugin to do it.
    I’m trying to achieve:
    1. Product filtering will appear on every page (on hover or on click), not only on the category page, but also on static pages like CONTACT or ABOUT US
    2. The products will be filtered only after selecting all interesting attributes and clicking the FILTER button
    Is there any PLUGIN which does these things? If the changes require writing code in PHP, I also manage it somehow, but I do not what should I chande – I’ve searched the whole Internet 🙂

    I know what theme it is, I don’t want to buy it, I have entire website made only without this one functionality.

    Can you please help me?

    Have a nice day

    1. Hello Kachna, thanks so much for your comment! Yes, this is possible – unfortunately this is custom work and I cannot provide a complementary solution here via the blog comments. Thanks a lot for your understanding! ~R

  16. Hi! Thanks for the analysis Rodolfo! I have a question… In my case, I am selling spare parts for spa-baths and swimmingpools. In order to make the most out of filters, I would need to use different type of filters depending on which category of products the customer is looking at…
    Example based on clothing/shoes: If you sell both shirts and shoes, a filter based on size would be different depending on if you are looking at the shirts or the shoes…
    One way of solving this problem (based on your article above) might be to use shortcodes in the category descriptions… However, it seems better to be able to put this in the widget area but not sure how/if that could be done.
    Any thoughts on this?

    1. Hey Tobias, thanks for your comment! I’m pretty sure you can use “widget logic” (https://wordpress.org/plugins/widget-logic/) to show/hide widgets based on where you are. Hope this helps 🙂

  17. In WooCommerce has a new extension “WooCommerce Product Filters”.

    – Quick filtering of products using AJAX technology
    – Filter by criteria: categories, attributes, tags, taxonomies, price
    – Pagination and product sorting without reloading page
    – Elements: price slider, checkbox list, radio list, dropdown, color list, box list, text list and others
    – Widgets “Products Filter” and “Notes for Product Filters”
    – Shortcodes and integration with product shortcodes
    – Adaptive filter options and product counts

    1. Thanks Dima 🙂

  18. The biggest problem of woocommerce regarding the filters options is that.

    Let’s say we have a clothe store and we have 3 products (T-Shirts) with variations: Small, Medium, Large.

    If one of these product has the Medium variation Out of Stock and in filters you choose to bring the products that they have Medium in variation, it also brings the product with the out of stock variation.

    This is really frustrating and we would be glad if there was a custom script or snippet to prevent that from happening.

    Other people have reported this also.



    1. Michael, thanks for your comment 🙂 Let’s hope they fix this!

  19. I would like to add i am using the YITH and it works good with WPML in 4 languages

    1. Nice, thanks Mark 🙂

Leave a Reply

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