Ultimate WooCommerce Filters

July 16, 2024

Ultimate WooCommerce Filters Plugin

Filter WooCommerce products by color, size, attribute, categories and tags. Customize your filtering and set a schedule for ordering.

Ultimate WooCommerce Filters is a plugin that allows you to filter WooCommerce products by color, size, attribute, category or tag. Easy to set up and implement via a block, shortcode or widget.

Key WooCommerce Filter Features

  • Filter WooCommerce products by color, with the actual colors displayed in the widget on your shop page
  • Filter WooCommerce products by size
  • Filter products by any attribute that you have created in WooCommerce
  • Filter products by WooCommerce categories and tags
  • Include a smart product search in the WooCommerce filtering widget
  • Add a smart table format/view to your shop page

It’s very simple and quick to set up your WooCommerce filters. Use an intuitive color picker to select the colors for your shop and then, for each product, just check the ones that apply. It’s as easy as assigning a category or tag.

And it works the same way for the sizes.

For the categories and tags, it’s even easier! Ultimate WooCommerce Filters automatically recognizes the categories and tags that you already have set up in WooCommerce. It’s as simple as enabling the filtering in the plugin options. You will then automatically have all your WooCommerce categories and WooCommerce tags available as filters on your shop page.

Table format option

Ultimate WooCommerce Filters includes a table format view for your shop page. With this enabled, your main WooCommerce shop page will now display in a table format, instead of the regular thumbnail format. With options to display the product title, image, price, rating and “add to cart” button, your customers can find and compare exactly what they need as quickly and easily as possible. If using this layout, we suggest to not use the widget at the same time.

Attributes

Create a powerful, effective and practical product browsing experience for your customers with the ability to filter your products by WooCommerce attributes. This is the attributes functionality that is built into WooCommerce and that you already use to provide specific information about your products. In our WooCommerce filtering options, just enable which attributes you’d like to add to the filtering widget and they’ll automatically display as filters on your WooCommerce shop page. No extra setup required. This is an incredibly useful feature that brings the WooCommerce shopping experience to a whole new level for your customers!

Add Filters to Your Site

It could not be easier to display your WooCommerce filters to your shop page. Just add our widget to your theme’s page sidebar. That’s it. The WooCommerce filter widget is already configured to only show on the WooCommerce shop page, and not your other pages.

WooCommerce Filters block: If you’re using a new block theme, we’ve also included a Gutenberg block, which you can use, instead of the widget, to add the filters to any template on your site. You can find the block by searching for WooCommerce Filters or in the Ultimate WooCommerce Filters block section/category.

[ultimate-woocommerce-filters] 

Alternatively, you can place the WooCommerce filters anywhere you want on a page using the intuitive shortcode shown just above.

Product Search

In addition to the available filters, Ultimate WooCommerce Filters also includes a dynamic and fast product search. With features like auto-complete, your customers can quickly find the exact products they’re looking for. And it works in tandem with the other filters, so only products that match all or your customer’s queries are displayed.

The search can be enable as an option within the existing filtering widget, so there’s no extra setup needed!

Premium WooCommerce Filtering Features

Ultimate WooCommerce Filters comes with a host of advanced features in the premium version that you let you further customize the filtering experience. These include advanced attribute options in the table format. There are also separate layout options and functions for each type of filter, an option to display WooCommerce filter attributes under the thumbnails on your shop page, and more, giving you many ways to configure your WooCommerce filters just how you need.

Ultimate WooCommerce Filters premium features include:

  • Display WooCommerce filter attributes under shop page thumbnails (e.g. adjacent to the rating stars). Gives your customers a visual indication of what’s a available for each product without having to go to the product page.
  • Specific layout options for each type of WooCommerce filter (color, size, attributes, categories and tags).
  • Add a price slider and attributes to the table format
  • Advanced options that allow you to customize the filtering functionality and experience.
  • Labelling options that allow you to quickly change the wording of specific labels.

WooCommerce Scheduling

Ultimate WooCommerce Filters now includes a new scheduling tool that lets you decide when your WooCommerce shop should be open for ordering. This new feature set includes an option to temporarily disable all ordering as well as an option to set a specific schedule for ordering.

For example, let’s say you wanted ordering to only be available on certain days and/or at certain times, to help you manage your fulfilment process. With the included scheduling tool, you can easily pick the days and times that you want and the plugin will automatically turn off WooCommerce purchasing at all other times. You can even set exceptions to your normal schedule, for holidays, special events, etc.

This feature set also includes the ability to hide the “read more” button and the product prices when ordering is disabled.

Features available with the new scheduling tool include:

  • Set a specific schedule for when WooCommerce ordering should be available.
  • Temporarily disable all ordering/purchasing.
  • Hide the “read more” button when ordering is disabled.
  • Hide the prices from the shop, product and archive pages when ordering is disabled.

Ultimate WooCommerce Filters is great for WooCommerce shops that want to show available product colors, such as clothing stores, sports equipment, electronics, music shops, collectibles and more. By having all your filters and your search in one place, it will save a lot of time for your WooCommerce store visitors and enhance their shopping experience.

Ultimate WooCommerce Filters is fully compatible with WPML. So, if you’re running a WooCommerce shop in multiple languages, you can use it without any doubts.

Installation

  1. Make sure you have the latest version of WooCommerce plugin installed and active
  2. Upload the ‘color-filters’ folder to the ‘/wp-content/plugins/’ directory
  3. Activate the plugin through the ‘Plugins’ menu in WordPress

or

  1. Make sure you have the latest version of WooCommerce plugin installed and active
  2. Go to the ‘Plugins’ menu in WordPress and click ‘Add New’
  3. Search for ‘Color Filters for WooCommerce’ and select ‘Install Now’
  4. Activate the plugin when prompted

Getting Started

  1. To add a new color filter:

    • Click on ‘WC Filters’ in the WordPress admin sidebar menu
    • Go to the ‘Colors’ tab. The ‘Add a New Color’ area will be on the left.
    • Fill in the fields, use the color picker to select your exact color, and then click the ‘Add New Color’ button
  2. To add a new size filter:

    • Click on ‘WC Filters’ in the WordPress admin sidebar menu
    • Go to the ‘Sizes’ tab. The ‘Add a New Size’ area will be on the left.
    • Give your size a name (e.g. “Medium”), fill in the other fields, and then click the ‘Add New Size’ button
  3. Choose color(s) and size(s) for your products:

    • Go to the WooCommerce ‘Products’ area of your WordPress admin and click on a specific product to edit it
    • On the right side of the screen, you’ll see a box called “Colors” and one called “Sizes”
    • There you will be able to choose the colors and sizes that apply for a specific product
  4. Enable filtering:

    • Go to the ‘Options’ tab
    • There you will see options called “Enable Color Filtering”, “Enable Size Filtering”, “Enable Category Filtering” and “Enable Tag Filtering”. You will also see options to enable filtering for every custom attribute that you have in your WooCommerce. Set any of these to “Yes” to enable the filtering.
  5. Displaying the filters on your shop page:

    • To add the WooCommerce filters widget to your shop page, go to the ‘Appearances > Widgets’ area of your WordPress admin
    • Drag our widget over to your the page sidebar area of your theme. (The widget is already configured to only show on the WooCommerce shop page, and not your other pages.)
    • You can also place the filters anywhere you want on a page using our intuitive [ultimate-woocommerce-filter] shortcode.
    • Or, if you’re using a block theme, add the ‘WooCommerce Filters’ block to your template.
  6. Customize your WooCommerce filter experience by making use of the many available settings and options, including a smart product search, product count display, displaying filter attributes under shop page thumbnails (premium), layout and functionality options and more.

For a list of specific features, see the Ultimate WooCommerce Filters description page here: https://wordpress.org/plugins/color-filters/.

For help and support, please see:

  • Our FAQ page, here: https://wordpress.org/plugins/color-filters/#faq
  • The Ultimate WooCommerce Filters support forum, here: https://wordpress.org/support/plugin/color-filters

Screenshots

  1. Shop page showing WooCommerce filters widget in right sidebar

    Shop page showing WooCommerce filters widget in right sidebar

  2. Close-up of WooCommerce color filter display under thumbnails

    Close-up of WooCommerce color filter display under thumbnails

  3. Close-up of WooCommerce filter widget

    Close-up of WooCommerce filter widget

  4. View of Colors tab in plugin admin

    View of Colors tab in plugin admin

  5. View of Sizes tab in plugin admin

    View of Sizes tab in plugin admin

  6. Options page in plugin admin

    Options page in plugin admin

  7. Adding color filter to a WooCommerce product

    Adding color filter to a WooCommerce product

FAQ

How do I add the filters to my WooCommerce shop?

  • To add the WooCommerce filters widget to your shop page, go to the ‘Appearances > Widgets’ area of your WordPress admin
  • Drag our widget over to your the page sidebar area of your theme. (The widget is already configured to only show on the WooCommerce shop page, and not your other pages.)
  • You can also place the filters anywhere you want on a page using our intuitive [ultimate-woocommerce-filter] shortcode.
  • Or, if you’re using a block theme, add the ‘WooCommerce Filters’ block to your template.

How do I add a color?

  • Click on ‘WC Filters’ in the WordPress admin sidebar menu
  • Go to the ‘Colors’ tab. The ‘Add a New Color’ area will be on the left.
  • Fill in the fields, use the color picker to select your exact color, and then click the ‘Add New Color’ button

How do I add a size?

  • Click on ‘WC Filters’ in the WordPress admin sidebar menu
  • Go to the ‘Sizes’ tab. The ‘Add a New Size’ area will be on the left.
  • Give your size a name (e.g. “Medium”), fill in the other fields, and then click the ‘Add New Size’ button

How do I assign colors and sizes to products in WooCommerce?

  • Go to the WooCommerce ‘Products’ area of your WordPress admin and click on a specific product to edit it
  • On the right side of the screen, you’ll see a box called “Colors” and one called “Sizes”
  • There you will be able to choose the colors and sizes that apply for a specific product

I’ve added colors and sizes, but still don’t see any filters in my shop

To enable the filtering, go to the ‘Options’ tab in our plugin admin. There you will see options called “Enable Color Filtering”, “Enable Size Filtering”, “Enable Category Filtering” and “Enable Tag Filtering”. You will also see options to enable filtering for every custom attribute that you have in your WooCommerce. Set any of these to “Yes” to enable the filtering.

How do I set up my WooCommerce product attributes to be filterable?

In our WooCommerce filtering options, just enable which attributes you’d like to add to the filtering widget and they’ll automatically display as filters on your WooCommerce shop page. All the data is automatically pulled from WooCommerce. No extra setup required.

How do I make my WooCommerce categories and tags appear as filters?

Ultimate WooCommerce Filters automatically recognizes the categories and tags that you already have in your WooCommerce. All you have to do is enable the filtering in our options. All of your WooCommerce categories and WooCommerce tags will then automatically be available as filters on your shop page.

Is there a shortcode to display the filters, or is it only a widget?

You can place the filters anywhere you want on a page using our intuitive [ultimate-woocommerce-filter] shortcode.

How do I turn on the product search field?

In the “Basic” area of the “Options” tab in our WooCommerce filters plugin, there is a setting called “Enable Text Search”. If you set this to “Yes”, it will display a search field alongside your filters on your shop page, giving your customers everything they need in one spot.

Changelog

3.3.4 (2024-07-16)

  • Tested with WordPress 6.6.

3.3.3 (2024-04-03)

  • Tested for compatibility with WordPress 6.5 and PHP 8.2 and eliminated/fixed deprecated notices associated with this.

3.3.2 (2023-11-07)

  • Tested for WordPress 6.4 and WooCommerce High-Performance Order Storage compatibility/support.

3.3.1 (2023-08-08)

  • Tested for WordPress 6.3 compatibility/support.

3.3.0 (2023-04-14)

  • Added a new scheduling section to the settings.
  • Added the ability to set a schedule for when WooCommerce ordering should be available.
  • Added option to hide “read more” button when ordering is disabled.
  • Added option to hide prices when ordering is disabled.
  • Added option to temporarily disable all ordering/purchasing, regardless of schedule.

3.2.3 (2023-03-30)

  • Updated block for compatibility with WordPress 6.2.

3.2.2 (2023-01-04)

  • Fixes a potential fatal error on the settings page.

3.2.1 (2023-01-03)

  • Update to correct an issue that could cause an error to display on the settings page.

3.2.0 (2022-12-21)

  • Added quick links to the admin about page to re-run the walk-through and suggest a feature.
  • Fixed an issue in which, when filtering for an attribute, it would load all products and wouldn’t highlight that attribute in the filtering sidebar.
  • Fixed an issue where the max price for the slider was being set to 0 on page load.
  • Tested with PHP 8.1 and corrected an issue with the upload image button not working when adding or editing a color.

3.1.1 (2022-05-20)

  • Tested with WordPress 6.0.

3.1.0 (2022-02-10)

  • Updated escaping and sanitizing.
  • Updated nonces and capability checks.
  • Changed how premium settings areas are previewed.
  • Fixed compatibility issue when using block-based themes.

3.0.9 (2022-01-21)

  • Fixed the issue with the price and rating sliders not showing.
  • Fixed a couple small display issues with the walk-through.
  • Updated nonces in the admin.

3.0.8 (2021-11-03)

  • Updated to SAP 2.6.1 library
  • Makes a number of setting’s visibility conditional on another setting’s value

3.0.7 (2021-09-02)

  • Updated the settings page library.
  • Fixed issue with price slider maximum being set to 0.
  • Fixed styling issue with table format price slider.
  • Fixed an issue in which, if changes were made in the table format settings tab, it would sometimes disable color/size filtering.
  • Eliminated a PHP warning.

3.0.6 (2021-08-12)

  • Updated deprecated block_categories.
  • Fixed Gutenberg block.

3.0.5 (2021-04-13)

  • Fixes a typo in yesterday’s update that was throwing a warning.

3.0.4 (2021-04-12)

  • Fixing incorrect path for loading plugin text domain.
  • Fresh .pot file.

3.0.3 (2021-03-26)

  • Corrects an issue with option saving on plugin update.

3.0.2 (2021-03-19)

  • Fixes an error that was preventing a modal from submitting.

3.0.1 (2021-03-12)

  • This update includes quite a big change to the construction of the plugin, so please take caution and test before updating on a live site (or wait a few days before updating in case some minor corrective updates need to be released).
  • This version 3.0.1 fixes an issue with the premium upgrade process.
  • Rebuilt the plugin, from the ground up, to be object oriented.
  • Updated the structure of the settings pages.
  • Styling updates for the color filter swatch and tiles.
  • Styling and functionality updates for the table format.
  • Added in a guided walk-through, which runs on plugin activation.
  • Fixed a few issues with the filtering and URL parameters.
  • WooCommerce attribute filtering issue: WooCommerce is currently experiencing an issue with widget attribute filtering. More info can be found here: https://github.com/woocommerce/woocommerce/issues/27419. If you are affected by the above WooCommerce issue, we suggest turning off attribute filtering for the time being.

3.0.0 (2021-03-12)

  • This update includes quite a big change to the construction of the plugin, so please take caution and test before updating on a live site (or wait a few days before updating in case some minor corrective updates need to be released).
  • Rebuilt the plugin, from the ground up, to be object oriented.
  • Updated the structure of the settings pages.
  • Styling updates for the color filter swatch and tiles.
  • Styling and functionality updates for the table format.
  • Added in a guided walk-through, which runs on plugin activation.
  • Fixed a few issues with the filtering and URL parameters.
  • WooCommerce attribute filtering issue: WooCommerce is currently experiencing an issue with widget attribute filtering. More info can be found here: https://github.com/woocommerce/woocommerce/issues/27419. If you are affected by the above WooCommerce issue, we suggest turning off attribute filtering for the time being.

2.1.15

  • Corrects recent issue causing the feedback notice to not dismiss correctly

2.1.14

  • Corrected/eliminated several PHP notices.
  • Fixed an issue that would sometimes cause an error if you installed and activated this plugin without first having WooCommerce activated.

2.1.13

  • Corrected issue preventing a few options from saving correctly

2.1.12

  • Added in a brand new table format/view for your shop page (best to use no sidebar if using this option)

2.1.11

  • Update for the admin dashboard

2.1.10

  • Removing placeholder text from the admin

2.1.9

  • Fixing issue where the min_rating and max_rating strings were showing in the address bar even if the ratings filters wasn’t enabled.

2.1.8

  • Updating widgets files to remove deprecated create_function

2.1.7

  • Corrected an issue that was causing the color pattern image upload box to not open

2.1.6

  • Updated the review ask pop-up

2.1.5

  • Corrected issue that was causing the review request to sometimes pop back up even after a review had been left or feedback sent

2.1.4

  • Corrected issue causing color pickers to not show in the styling options

2.1.3

  • Additional correction to Gutenberg block

2.1.2

  • Corrected issue with Gutenberg block not displaying in new WordPress 5.0

2.1.1

  • Corrected issue in which, in certain cases, the Colors and Sizes meta boxes were not showing on the WooCommerce product edit screen.

2.1.0

  • This is a big update with many new features, corrections, revised admin styling, etc., so please take caution and test before updating on a live site (or wait a few days before updating in case some minor corrective updates need to be put out)
  • Added in easy-to-use Gutenberg block for the ultimate-woocommerce-filters shortcode
  • Added the ability to filter products by rating (either WooCommerce ratings or ratings from the Ultimate Reviews plugin)
  • Added a “Reset All Filters” option
  • Added option to filter products by in stock
  • Added option to filter products by on sale
  • Added a Custom CSS area to the options
  • Added in new labelling options
  • Added in new styling options for more control over the look of the widget/shortcode and the display of the information in the product thumbnails on the shop page
  • Re-arranged the order of certain options
  • Updated the styling of the options pages
  • Updated the styling of the information in the product thumbnails on the shop page
  • Corrected issue in which, if, while editing a color, you clicked on one of the associated products, it wouldn’t correctly redirect to that product edit screen
  • Corrected issue with attributes not displaying properly in the product thumbnails
  • Corrected issue with the attributes not appearing as filtering options
  • Minor styling updates to certain admin screens
  • Removed a few unused/unnecessary files from the plugin
  • Loaded the textdomain and generated .pot file

2.0.5

  • Making it so the widget also shows on WooCommerce archive and taxonomy pages, and not just the main shop page.
  • Correcting issue with filtering that was causing the colors and sizes to not display when selected for some users.

2.0.4

  • Fixed issue with an option not appearing in the trial

2.0.3

  • Fixed an error where the search term was set to undefined when text search as turned off
  • Fixed an error where variations weren’t available for colors that already existed. Simply re-save the colors and this feature should work correctly now.
  • Removed a number of notices

2.0.2

  • Minor CSS updates to the admin Dashboard

2.0.1

  • Fixed an issue where the new WooCommerce attributes for colors and sizes were visible

2.0.0

This is a big update, so please use caution (and test) when updating on live sites

  • Added new color filter layouts and options
  • Added size filter
  • Added filtering for any WooCommerce attribute
  • Added category filter
  • Added tag filter
  • Added text search
  • Added many new options in the plugin

1.2.2

  • Bug fix: Color Filters widget echoing extra space in anchor tag – Reported by dkcreatto
  • Bug fix: Color picker is not showing in color edit page
  • Bug fix: Permalinks are not flushed on plugin activation
  • Bug fix: Widget bottom is broken

1.2.1

  • Fixed typo
  • Tweak: better sanitizing color value field

1.2

  • Feature: Added an option to Color Filters Widget for hiding empty colors
  • Feature: Added an option to Color Filters Widget for including the number of assigned products
  • Tweak: Reduce space between colors when layout is color
  • Tweak: Added language (.po) file

1.1.1

  • Feature: Added the color next to its text in admin side
  • Fixed an issue with widget wrapper closing
  • Fixed an issue with quick edit color saving

1.1

  • WPML support

1.0

  • Initial release.

Details

  • Version: 3.3.4
  • Active installations: 1,000
  • WordPress Version: 4.0
  • Tested up to: 6.6.1

Ratings


5 Stars
4 Stars
3 Stars
2 Stars
1 Stars