1. Home
  2. Knowledge Base
  3. WooCommerce Product Table
  4. Advanced Usage

Adding product tables to the single product page

WooCommerce Product Table is most commonly used on normal pages and WooCommerce shop templates. Some of our customers also like to display product tables on the single product page, as a way to display other products or list the current product's variations.

Most themes show the short description field towards the top of the single product template, above the add to cart button. This is a useful place to display a variations table for that product, instead of using the standard WooCommerce variation dropdowns and add to cart button. You can also add product tables to the main product description, if you prefer.

Simple products

If you're using simple products without variations, then you can easily add a product table listing other products to the short or long description fields. You can do this in the same way as adding a product table to a normal page or post.

See the rest of this knowledge base for instructions. In particular, check out the page listing all the options for choosing which products to list in the table.

Plotter Shop, SharkCrates and First Kitchens are three great examples of this in action. Each site uses WooCommerce Product Table to list a range of products from a specific category on a single product page.

Variable products

If you're using variable products, then you might want to list the current product's variations in a table on the single product page. This is an alternative to using the default variation dropdowns that appear above the add to cart button.

  1. Go to Products → Product Tables and create the table that will be added to the single product page for a particular product.
  2. In the 'Which products?' section, select the 'Individual products' option and choose the product that you wish to display the variations for.
  3. In the 'Add to cart' section, select the option to show variations on separate rows of the table.
  4. The final page of the table builder will provide a shortcode for inserting the table. Add this to the short or long description on the 'Edit Product' screen. Alternatively, if you have built your product pages using the block editor then you can insert the 'Product Table' block and select the relevant table.

You can then go back to the main list of tables at Products → Product Tables and duplicate the above table to create different tables for your other products. The only detail that you need to edit for each table is to change which product will be displayed.

Tip: When displaying the variations for a specific product, it is generally beneficial to hide the elements that normally appear above the table such as the search box and number of products per page. You can do this on the plugin settings page or in the shortcode.

See this shortcode in action on this product on our demo site.

Product table single product pageTips on how to achieve this:

  • To save having to create a separate table for each product, you could add some custom code to dynamically populate the include option with the ID of the current product. We have provided code snippets on how to do this.
  • In the screenshot, a product table has been added to the short description field. The product table has its own check boxes and 'Add Selected to Cart' options, but the single product template has added its own variation fields, quantity selector and Add to Cart button underneath the short description field. You will need to hide these elements - either using CSS (code snippet here) or by modifying the single product template.

Tip: If you're using our WooCommerce Product Options plugin, then your add-on options are compatible with both of the methods on this page. They will appear in the buy column of the product table.

Showing custom fields on the single product page

If you want to show extra product data on the single product page, then you might like our separate tutorial about this. It's about how to add custom fields to WooCommerce products and show them on the single product page.

Related Articles

If searching the knowledge base hasn't answered your question, please contact support.