How to Show the Add to Cart Button on the WooCommerce Shop Page – 2024 Guide

If you have a WooCommerce store, then to increase your customers' shopping experience, you might want to show an add to cart button on the shop and category pages. 

This will allow your customers to add to cart multiple products from the store’s shop and category pages. 

So, today, I’ll explain how to show the add to cart button on WooCommerce shop and category pages with the help of WooCommerce Variation Swatches and WooCommerce Product Table plugins. 

Preview

So without further ado, let’s jump into the tutorial. 

Add to Cart Button on the Category page (Method 1)

Here, I’ll explain how you can show the add to cart button on WooCommerce shop and category pages with the help of WooCommerce Variation Swatches plugin.

I’ll explain this in a few simple and easy to follow steps:

1.1. Install and Activate the WooCommerce Variation Swatch Plugin

Note: You can skip this step if you have already installed and activated the WooCommerce Variation Swatches plugin. 

To install the WooCommerce Variation Swatches plugin, you will need to install the Woosuite Core plugin and activate it with the help of a license key. We have created a Quick Start Guide for you to figure out how to install and activate the WooCommerce Variation Swatches plugin.

1.2. Navigate to Variation Swatches Settings

Note: For this tutorial, I am assuming that you have already set up the product attributes and variations. If you haven’t set up the attributes, then you can do it by navigating to the Products » Attributes.

From the WordPress Admin Dashboard, navigate to Woosuite » Variation Swatches.

1.3. Show Swatches on Shop/Archive Pages

Now scroll down a bit and expand the Archive/Shop by clicking on the (▾) 

And enable the Show Swatches Label to display the variation swatches on the shop/archive page. 

1.4. Save Changes

Now, click on the Save Changes button at the top right corner to save the changes. 

1.5. Final Results

Now if you visit the shop or the category page of your WooCommerce store, you’ll see that Add to cart button under each product. 

Show WooCommerce Add to Cart Button on Shop and Category pages(Method 2)

Here, I’ll explain how to show the add to cart button on WooCommerce shop and category pages with the help of WooCommerce Product Table plugin.

I’ll explain this in a few simple and easy to follow steps:

2.1. Install and Activate the WooCommerce Product Table Plugin

Note: You can skip this step if you have already installed and activated the WooCommerce Product Table plugin. 

2.2. Create a New Table

Once you have installed and activated the plugin, Now to show the add to cart button on the WooCommerce shop and category pages, follow the given steps:

1. Add New Table

Navigate to Woosuite » Product Table from your WordPress dashboard and click on the Add New Table button. 

Once you click it, you’ll see a screen where you can create and control the different table settings. 

2. Order Form Display

Give an internal name to the table.

3.  Order Form Information

Now expand the Order Form Information by clicking on the (▾) 

Now, specify the columns you want to add to the table. Make sure that you have added the Add to Cart column in the table to display it on the shop and category pages. 

To add a column just drag the column from the Available columns section and drop it in the selected columns sections. 

2.3. Set Woosuite Product Table As Default Shop/Category Page Layout

To set the Woosuite product table as the default shop page layout, go back to the General Settings of the plugin by clicking on the back arrow at the top. 

Now select the table you just created, from the Shop Pages and Product Category dropdown and click on the Save Changes button to save the changes.

2.4. Final Results

Now if you visit the Shop Page or the categories pages, you’ll see all the products are being displayed on a table.

And there’ll be an Add to Cart button next to each product. 

Wrapping Up

So this is how you can show the add to cart button on WooCommerce shop and category pages. 

By following any of the 2 methods, you can let the users add to cart multiple products from a single page. They won’t need to go to the product page to add to cart. They can directly do it through the shop and category pages. 

If you have any queries, you can ask them in the comments or contact our customer support. Our dedicated customer support team typically replies within 48 hours.
To get started, download the WooCommerce Variation Swatches and WoCommerce Product Table plugins today!