WooCommerce Filter for Product Table: Adding and Customizing

This is a complete guide about adding and customizing the WooCommerce Filter for Product Table.

What is filter in WooCommerce?

Actually, filtering in WooCommerce is the feature that enables a dropdown to filter your products. The procedure is performed with Ajax and needs no page reload.

So filtering helps to find the desired products, more specifically, that saves the valuable time of your customers. As a result, sales increase with the conversion rate.

Why should I use?

A few days back, I just needed to buy a pair of shoes. So I had a look into a Ecommerce site that is famous for exporting worldwide brand shoes, slippers and some other accessories. They have thousands of products in their store, which are assigned different categories.

I wanted to purchase a pair of casual shoes in size 9 in Black. But unfortunately, there was no functionality for filtering products by size. For this, I had to switch to another site as I was then in a little hurry.

Now let’s see how to add Filter in WooCommerce Product Table.

In this guide, I’ve used Woo Product Table pro (the bestselling Product table from CoeCanyon) to use Filter in Product Table. The good news is that you can add filters to the product table in three ways. There are:

• Default filter in Woo Product Table
• Add Filter by Custom Taxonomy
• Filter by Custom Fields

Default Filter in Woo Product Table

Now we’ll add the WooCommerce Filter for Product Table, which is given by default. First, make a product table. To do so, navigate to Dashboard->Product Table->Add New Shortcode.

Now customize your table by shortcode post and click the update button. Copy the shortcode and paste it on a new page.

If you don’t know about using Woo Product Table, please follow this  How to Make a WooCommerce Product Table Using Woo Product Table Pro

Let’s have a look at what the product table looks like before using Filter.

Now we’ll add a filter to the table.

To add a filter navigate to Dashboard->Product Table-> Add New Shortcode and customize shortcode. Go to the Search Box And Filter Tab and in the Mini Filter Box, choose Filter Show (Default).

Now update the shortcode and paste it to a page or post where you want to show the filter.

Here I’ve created a new page named “Filter” and pasted the previously copied shortcode in the text area. Now publish the page and click on “view page.”

At the top of the table, there is a WooCommerce Filter for Product Table by which you can filter your products in Category and Tag.

Add Filter by Custom Taxonomy

There is a good news that you can add WooCommerce Filter for Product Table  by custom taxonomy. Following the five steps given below, you can do that very easily.

Step 1: Installation plugin

To add filter by custom taxonomy we need to install an additional plugin to create custom taxonomy. There are some plugins in wordpress to do that. I’ve used  Custom Post Types and Custom Fields creator – WCK.

Navigate to Dashboard->Plugins->Add New search for  Custom Post Types and Custom Fields creator – WCK.

Install and activate the plugin.

Step 2: Create Custom Taxonomy

Go to Dashboard->WCK->Taxonomy Creator

Select the name of the taxonomy (must not contain capital letters or spaces), Singular Label and plural Label. Then choose Attach to Page/Post/Product.

Here I’ve chosen product as I’ll show it for product. Select Hierarchical True and click on Add Entry.

To see more on using Custom Taxonomy please see Custom Taxonomy in WooCommerce

Step 3: Add Taxonomy to Products

Now Navigate to Dashboard->Products->All Products and edit the products you want to do.

At the right sidebar you’ll get the taxonomy what you have created before.

Click on Add New(Taxonomy Name) and input the value. Then click on on Add New (Taxonomy Name) button.

Step 4: Customize in Shortcode  Configuration

Now navigate to Dashboard->Product Table->Add New Shortcode->Search Box And Filter.

In Taxonomy Keywords for Filter (Separate with comma[,]) type your taxonomy name. In the box there is color and size for taxonomy that we created in taxonomy creator and product_cat and product_tag for default taxonomy in Product Table Plugin.

Remember here, each taxonomy must be separated with comma.

In the given screenshot color and size are for custom taxonomy. The rest of two are for WordPress default Taxonomy Category and Tag.

Step 5: Use the Shortcode

Update shortcode and paste to a page/post and publish it. Go go View Page to look the change.

So in table shown above you can see a WooCommerce Filter for Product Table.

Filter from Custom Field

There is a great news that in WooCommerce Product Table plugin you can use Custom Fields. You can use Advanced Custom Fields with this WooCommerce Filter for Product Table to show extra product data.

With the comparability of Custom Field it can be used to Filter products. Isn’t that awesome.

When there are too many products in product table to find the exact desired one, customer can find by Filtering products from table.

You can make a WooCommerce Filter for Product Table in easy three steps.

Step 1: Install and Configure Advanced Custom Fields

Install and activate Advanced Custom Fields plugin from WordPress Plugins root directory.

There are some customization needed to use Advance Custom Field.

To know about creating and customizing Custom Field please see How to Use Custom Field in WooCommerce Product Table Pro.

Step 3: View the Table

Then update the page and, from the top of the page, click on “view page.”

Then there will be an additional column for Brand. And this is what the Product table may look like after adding the custom field:

So here an extra column has appeared, than before named Brand. I hope you’ve got it customizing WooCommerce Filter for Product Table.