How to Create a Table of Affiliate Products with WooCommerce

If there's one feature that you'll find on nearly every single affiliate website, it's a product comparison table. Seriously - I think a requirement for joining the Amazon Associates affiliate program is that you be able to create product comparison tables - they're that common. But despite their ubiquity, most people still laboriously create their product tables using page builders, custom HTML, or an Excel-like table plugin like TablePress. In this article, I'm going to show you an alternative solution that's a great option if you're running an affiliate website powered by WooCommerce.
Table of Contents

Sponsored Ad

If you purchase through a link on our site, we may earn a commission.

If there’s one feature that you’ll find on nearly every single affiliate website, it’s a product comparison table. Seriously – I think a requirement for joining the Amazon Associates affiliate program is that you be able to create product comparison tables – they’re that common.

But despite their ubiquity, most people still laboriously create their product tables using page builders, custom HTML, or an Excel-like table plugin like TablePress.

In this article, I’m going to show you an alternative solution that’s a great option if you’re running an affiliate website powered by WooCommerce.

You’ll learn how to create dynamically generated tables that are searchable, filterable, and sortable. Better yet, you’ll have full control over exactly what information you display in your table of affiliate products.

Not only will this save you time, but it will also make things better for your visitors (and a better experience means more conversions!).

How To Create A Table Of Affiliate Products Using WooCommerce + WooCommerce Product Table

In order for this guide to work, you’re going to need two plugins:

  • WooCommerce – this is what you’ll use to actually manage your various affiliate products.
  • WooCommerce Product Table by Barn2- this is what you’ll use to display those affiliate products in a filterable, sortable, and searchable table.

I’m going to assume that you have both of these plugins installed and activated before you start the guide.

That is, while I will show you how to add an affiliate product to WooCommerce, I’m not going to show you how to set up the basic WooCommerce store. If you need help with that, check out WooCommerce’s Getting Started guide.

Step 1: Add Your Affiliate Products To WooCommerce

Lots of people think WooCommerce is just a solution to sell your own products. But it actually includes core functionality to sell external affiliate products – no tweaking required!

To add your first affiliate product, go to Products β†’ Add New in your dashboard.

The important thing is to find the Product data meta box and change the product type to External/Affiliate:

create woocommerce affiliate product

Then, fill in the information for:

  • Product URL – this is your affiliate URL that goes directly to the product.
  • Button text – WooCommerce will display a button to link to where the visitor can purchase the product, rather than an Add to Cart button.
  • Price this is not required. And if you’re linking to Amazon, be careful about inputting a static price because it goes against the Amazon Associates policy to have inaccurate pricing (which is likely because of how often Amazon changes prices). For other affiliate programs, you should be fine (make sure to verify this first, though)

Along with the affiliate-specific information, you’ll also want to fill out the general product details like:

  • Title
  • Description
  • Image
  • Etc.

Once you publish your affiliate product, you can verify that the product page does indeed display a button with a CTA to buy at an external store:

example of affiliate CTA

Now, all you need to do is repeat the same process for as many affiliate products as you want to add.

I recommend using a category or tag to divide up products by topic because it will come in handy later on if you want to create multiple affiliate product tables for different topics.

Step 2: Set Up WooCommerce Product Table Shortcode

In order to display a table of affiliate products, you’ll use the shortcode from the WooCommerce Product Table plugin.

While you can always manually tweak the shortcode on a per-table basis, the plugin lets you set up the default functionality for the shortcode by going to WooCommerce β†’ Settings β†’ Products β†’ Product tables:

Configure WooCommerce Product Table

For a full explanation of all the settings here, check out my complete tutorial on how to create a WooCommerce product table.

But for this post, I’m just going to focus on the settings that most apply to creating a table of affiliate products.

In the Table design area, you can set up a custom design for your table if desired:

table design

Or, you can always stick with the plugin’s default styling.

Moving down a bit, you can choose what information to display as columns in your table. Personally, I think the default configuration is pretty solid. It will display:

  • Product image
  • Name
  • Short-description
  • Price
  • Add to cart button (this links directly to the affiliate store)

If you’re not planning to display prices, you might want to remove the price column. Additionally, you might want to remove the short description as it can make your table a little cluttered if you have long descriptions.

Similarly, you can add additional columns to display more information. This help article has a full list of potential columns.

column settings

Those are really the only two things you need to consider. While you can always change the other settings to suit your liking, I think the defaults are pretty well suited for most uses.

Create Your Affiliate Product Table

Get started creating your affiliate product table with WooCommerce Product Table and generate more revenue in no time!

Get It Now

Step 3: Insert WooCommerce Product Table Shortcode

Now that you’ve set up the defaults, you can insert your table of affiliate products by using the [ product_table ] shortcode (without the spaces).

The only thing that you need to add to your shortcode is a parameter to indicate which specific products to include (otherwise, the shortcode will display every single product in WooCommerce, which might not be what you want).

To do that, you can either use tag="tag_name" or category="category_name".

For example, here’s what it looks like on my test site when I pull in products that are tagged with “Affiliate”:

table shortcode

And here’s how that looks on the front-end:

example of table of affiliate products

A few things to notice in that table to consider when you build your table:

  • The table will use the button text that you enter when you set up your affiliate product. So you can either make them all the same text or make them different like in my example.
  • If you don’t input a price, it will show up blank. For that reason, you should probably go “all or nothing” with listing prices on your affiliate product pages.

Step 4: (Optional) Include Sidebar Filter Widgets

A neat thing that you can do with WooCommerce Product Table (and can’t do with other product comparison table solutions) is display sidebar filter widgets for your visitors to interact with your table of affiliate products.

These aren’t required – but I think they make your table a lot more usable.

To add them, go to Appearance β†’ Widgets and drag over the various Product Table… widgets:

table widgets

Once you do that, your visitors will actually be able to filter out the specific affiliate products that they’re most interested in using your sidebar.

Bonus! Get Creative with Interactive Images

Tables are simple to follow but some people are attracted more to images. In fact, we’ve come to realize that certain people prefer clicking on images to text links.

You can do that with interactive images using a plugin like WP Draw Attention.

Interactive image with clickable affiliate links.

For example, take a photo of your favorite devices and have each one highlighted on hover. If a visitor clicks on that item, they can be taken directly to the product page with your affiliate link. The use of image maps in WordPress, just like this one, can be incredibly useful to boost sales.

Enjoy A More Usable Table Of Affiliate Products

This tutorial won’t work for every single affiliate website because it hinges on using WooCommerce to manage your affiliate products.

But if you are using WooCommerce, or are open to the possibility, it’s a great way to display a more usable and flexible table of affiliate products.

And because it’s dynamically generated, any new affiliate products that you add to WooCommerce will automatically show up in the relevant tables, which is a lot easier than having to manually edit static tables each time you want to add or update a product.

Have any other questions about how to create a table of affiliate products using WooCommerce and WooCommerce Product Table? Leave a comment and we’ll try to help out!

Colin has been using WordPress for over a decade and is on a quest to test all 60,000+ plugins at WordPress.org. He has been a Writer and Product Review Expert for WP Mayor since 2017, testing well over 150 products and services throughout that time.

Sponsored Ad

If you purchase through a link on our site, we may earn a commission.

All suggestions are anonymous.

More from our blog...

3 Responses

  1. Hello,

    Can you add HTML to Woocommerce for affiliates versus only adding an affiliate URL? In the affiliate program CJ.com you can create widgets of products and it only gives you an HTML option. Thank you!

Post a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

Stay updated with WP Mayor's newsletter showcase every week

Stay on top of every new WordPress innovation and latest launches. Receive all our fresh product reviews and expert guides directly in your inbox.

Hosting Survey 2024

Are you happy with your hosting provider or are you over-paying for too little? Have your say below!

"*" indicates required fields

What's the main reason you picked this host?*
How happy are you with your host?*

OPTIONAL: If you'd like to receive the results of this survey, please enter your details below.