Adding product tables to the WooCommerce shop page, category archives & search results
WooCommerce Product Table is primarily designed to be used by adding a shortcode to standard pages or posts. However, you can also display it in your shop by overwriting the relevant WooCommerce template file in your theme.
For example, you can add a product table to the main shop page or product category pages – replacing the usual store layout provided by WooCommerce.
The instructions on this page will add the product table layout to all of the following pages in your store:
- The main shop page
- The product category and product tag archive pages
- Any custom product taxonomy archives
- The product search results page
If you want to show it on some templates but not others (e.g. the search results page but not the main shop page), then this will require custom coding that is outside the scope of under our plugin support.
Please note that this code is aimed at developers and if you don’t know how to use it then you should ask your developer. If you don’t have one, we recommend posting a job on Codeable. Alternatively, please contact us to request a quote from our customizations service.
How to add product tables to the shop page, categories, taxonomies and product search results
1. First create a folder called “woocommerce” in your theme or child theme. If your theme already has this folder, you can skip this step. Upload the folder to your server in this location:
2. Next, download the our sample archive-product.php template, and upload it to the woocommerce folder you just created. It should be in this location:
- If you are using WooCommerce 3.2 or earlier, you will need to download the version 2.0 template instead.
- If you need more information on WooCommerce templates, please refer to the WooCommerce documentation.
You should now see product tables displayed on your main WooCommerce shop page, category pages and elsewhere in your store.
If you don’t see a product table, check the following:
- Is the correct theme active? If you have uploaded your template to the child theme (e.g. flatsome-child) but the parent theme is active, then your template won’t be picked up. In this case you would need to activate the child theme.
- Does your theme have a file called ‘woocommerce.php’? It will be in the theme’s root folder, i.e. /wp-content/themes/<your theme>/woocommerce.php. If so, this file will override the archive-product.php template (and any other template), so it won’t work. To fix this you will need to delete or rename the woocommerce.php file.
- Do you have a caching plugin? Sometimes this can prevent the new template from being picked up. Try disabling the caching plugin temporarily or clearing the cache.
How to configure the product table
If you inspect the sample template file, you’ll see that line 60 sets the product table shortcode:
$shortcode = '[product_table columns="image,name,price,add-to-cart"]';
You can add additional shortcode options (and change the
columns option) as you would with the shortcode on a regular page.
For example, if you wanted to add the
show_quantity options, you would change this line to:
$shortcode = '[product_table columns="image,name,price,add-to-cart" sort_by="price" show_quantity="true"]';
Please see this article for the full list of shortcode options.
Using filter widgets on the shop page, categories and taxonomy archives
WooCommerce Product Table comes with its own set of product filter widgets which you can add to a widgetized area such as a sidebar. These only work for product tables on normal pages and posts. They do NOT work for product tables that have been added directly to the shop page, category pages etc.
To use filter widgets on these pages, you need to use the built-in WooCommerce filter widgets instead of the dedicated product table widgets. You can find these in Appearance > Widgets. They start with ‘Filter Product by’ instead of ‘Product Table’ (see screenshot).
Can I use a different shortcode for each category?
The above instructions assume that you’ll have the same shortcode for each category. To dynamically use different shortcodes depending on the current category, you would need to do some extra custom coding.
This is outside the scope of our standard plugin support. If you don’t know how to do the required coding, then we recommend that you post a job on Codeable where one of their WordPress experts can quote for the work. Alternatively, get in touch if you’d like a quote from our plugin customizations service.
Can I use the product table layout on product search results from other plugins such as Relevannsi and WooCommerce Product Search?
For a more advanced search, some people like to use WooCommerce Product Table with a third party search plugin such as Relevannsi or the official WooCommerce Product Search or Product Finder plugins which have extra features such as advanced search filters and instant results. You can do this by customizing the search results template for the search plugin to include the product table layout.
The sample template above is a good starting point to help you with this. However, this is an advanced task and is not covered by our plugin support. If you don’t know how to do it then you will kneed to ask a developer to do it for you, or post a job on Codeable.
Can I use product tables on the main WordPress search results?
The above instructions will use the product table layout on the product search that comes with WooCommerce. It will not work on the WordPress search box for your whole website. This is because the sitewide search results include other types of content (such as pages and posts), and WooCommerce Product Table can only list products.
If you want to create a table view for your sitewide search results, then you can do this with our other table plugin, Posts Table Pro. This lists all types of WordPress content in a table, instead of just products. (Instructions for Posts Table Pro here.)