WooCommerce – Add to Cart button on product archive pages

By default, our themes hide the "Add to Cart" button on the product archive pages. Product archive pages include your main shop page and any product categories.

How to enable add to cart button on product archive pages

1. Go to WordPress > Appearance > Editor > Theme Functions (Functions.php).

2. Find this section of code:

//* Remove Add to Cart on Archives
add_action( 'woocommerce_after_shop_loop_item', 'THEMENAME_remove_add_to_cart_buttons', 1 );
function THEMENAME_remove_add_to_cart_buttons() {

    remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart' );
}

Note: THEMENAME will actually say the name of your theme, i.e. "Vivienne" or "Amelia."

3. Remove that section of code. Be careful to remove ONLY what's shown above – nothing more and nothing less.

4. Click Update File. The Add to Cart button will now display on product archive pages:

Change the text of the Add to Cart Button

If you'd like to replace the "Add to Cart" text with something else (i.e. "Buy Now"), the easiest way is to use this plugin.

Don't want to use a plugin? Here's a tutorial for changing the text via a code snippet added to your Functions.php file.

Center the Add to Cart Button on product archive pages

If the Add to Cart button is not centered beneath your products and you would like it to be, add the following code snippet to your theme:

.woocommerce ul.products li.product .button {
text-align: center;
margin: 15px auto 10px;
display: block;
width: 50%; }
How to add code snippets to your theme >