Adding product tables to the WooCommerce shop page, category archives & search results
Our WooCommerce Product Table plugin lists your products in a table view. You can create product tables either by adding a shortcode to a page, or by enabling the product table layout on your main shop page and/or product category archives and product search results. This article provides more information about adding product tables to the shop, category and search results pages.
The easiest way to automatically enable product tables throughout your store is to use the options on the plugin settings page:
- Go to WooCommerce → Settings → Products → Product tables.
- Tick one or more of the boxes in the 'Store integration' section:
- Main shop page - this enables the product table on the main shop page, which you select under WooCommerce → Settings → Products → General.
- Product category pages - this enables the product table on all product category pages, and also the product search results page.
- There are also options to enable product tables on product attribute archives, tag archives, taxonomy archives, and so on.
When you enable these options, the product table layout will be used instead of the default layout that comes with your theme.
If your shop and category pages normally have a left or right sidebar, then the sidebar will still appear when you switch to the product table layout. Similarly, if the shop is normally full-width then it will remain full-width when you activate the product table layout.
Many WordPress themes have options allowing you to choose whether or not your shop and category pages have a sidebar. You can use these to show/hide/remove the sidebar.
We have tested with a wide range of themes, including the popular themes such as Astra, Atelier, Avada, Bridge, Enfold, Flatsome, Genesis Framework, JupiterX, OceanWP, Porto, Shapely, Storefront, Total, Uncode, Woodmart, and all of the default WordPress themes such as TwentyTwenty. Don't worry if your theme isn't listed here.
You may find these options don't work as expected in a small number of themes. This may happen if your theme has a modified version of the archive-product.php template file with theme-specific HTML formatting. If this happens, it will not be possible to use the options shown above. Instead, you will need to use one of these methods:
- Ask a developer to customize the archive-product.php template in your theme.
- Use the 'Developer method' below to override the custom archive-product.php template in your theme with the sample template we provide.
If you need more flexibility, or if the options on the plugin settings page don't work with your theme, then you can add the product table shortcode to the archive-product.php template, overwriting the relevant WooCommerce template file in your theme.
This will replace the usual store layout provided by WooCommerce. You can either use the sample archive-product.php template provided below, or create your own.
About the sample template
Our sample archive-product.php template 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
This is because the WooCommerce shop page template (archive-product.php) is used for all these layouts, and there isn't a separate WooCommerce category page template file. If you want to use product tables on some templates but not others (e.g. the search results page but not the main shop page), then you need to add some additional code.
- Create a folder name “woocommerce” in your theme or child theme. If your theme already has this folder, you can skip this step. Upload this folder to your server. The folder structure will look like this:
- Download the archive-product.php template, and upload it to the /woocommerce/ folder you just created.
If you need more information on WooCommerce templates, please refer to the WooCommerce documentation.
You should now see a product table displayed on your main shop page, category pages and elsewhere in your store.
If you don't see a product table:
- 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,buy"]';
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
quantities options, you would change this line to:
$shortcode = '[product_table columns="image,name,price,buy" sort_by="price" quantities="true"]';
Please see this article for the full list of shortcode options. Alternatively, you can set the options globally on the plugin settings page.
Using filter widgets on shop and category pages
Product Table comes with its own set of product filter widgets that you can add to any sidebar. The default widgets in WooCommerce are not available for regular pages, so the product table widgets allow you to display the same widgets on other pages. This can be confusing when you are also display product tables on your shop pages!
The widgets you should use depend on the type of page your sidebar is on:
- Shop pages - e.g. the main Shop page, product categories, individual products, etc - use the WooCommerce widgets.
- Other pages - e.g. you have created a page called 'Order Form' and added the [product_table] shortcode to that page - use the Product Table widgets.
Can I have different product table settings for each category?
No. The product tables will have the same columns and settings. For product categories, the table will list products in the current category.
This is outside the scope of our plugin support. If you need help, we recommend you post a job on Codeable where one of their WordPress experts can quote for the work.
Can I list categories on the shop and parent category pages, and product tables on child categories?
Yes, you can do this as follows:
- On the WooCommerce Product Table settings page (WooCommerce → Settings → Products → Product tables), tick the option to show the product tables on the product category pages but NOT the shop page.
- Under Appearance → Customize →WooCommerce, set 'Shop page display' to 'Show categories' and 'Category display' to 'Show categories & products'.
This will display the following:
- Shop page - list of categories
- Categories with subcategories - list of categories with a product table underneath listing the products from all those subcategories
- Subcategory pages - product table only
Can I add the product table layout to some categories but not others?
The above instructions will add the product table layout to all category pages. Some people like to use the product table on specific categories only. For example, you might be creating a WooCommerce wholesale store and want to use product tables to add a wholesale order form to your B2B categories only.
To just show the product table layout on specific categories, you would need to add some custom code to the archive-product.php template. If you want to specify which categories should have the product table layout then you will need to reference these categories in the template. This is a developer-level task and if you don't have a developer then we recommend posting a job on Codeable.
If you are using WooCommerce Product Table with our WooCommerce Protected Categories plugin, then you might want to only use the product table layout in your protected categories - while keeping the default store layout for your public categories. To do that, please refer to the WooCommerce Protected Categories developer documentation as a starting point.
Can I list categories as well as products?
Yes, you can do this in the general WooCommerce settings. Go to Appearance → Customize → WooCommerce → Product Catalog and change the 'Shop page display' or 'Category page display' options to 'Show categories & products'. With this option, the categories will be listed in a grid layout at the top of the page, with a product table listing the products underneath.
Please note that it is not possible to list actual categories in a table layout, because WooCommerce Product Table is only designed to list products. The only way to include categories within the product table is in the 'category' column, which lists the categories that each product is assigned to.
If you choose the 'Show categories' option then the product table layout will NOT be used because this layout lists categories rather than products.
Can I use the product table layout on product search results from other plugins such as Relevanssi?
You can use WooCommerce Product Table with third party search plugins such as SearchWP or Relevanssi, which work by improving the native WooCommerce product search. To set it up, simply use one of the above methods to add the product table layout to your product search results.
If you are using a search plugin that provides its own search results template – instead of using the native WooCommerce product search results – then you would need to modify that template to use the table layout. Again, this is a developer-level task so if you don't know how to do it then you will need to ask a developer to do it for you, or post a job on Codeable.
Tip: If you want to use a third party search plugin to power the search box above the table, then learn how here.
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.)
Can I add product tables to attribute archive pages?
Attributes use a different template from the shop page and category archives. This means that if you use the above methods to add product tables to your shop and/or category pages then this will not change the layout of your attribute archive pages.
Attribute archives use the taxonomy-product_cat.php file rather than archive-product.php.
To add the product table layout to attribute archives, you should create a child theme and use it to override the taxonomy-product_cat.php template, adding a
[product_table] shortcode to the template file in place of the code for the default grid layout. This is a developer-level task and you should ask your developer if you don't know how to do this.