How to Hide Add to Cart and Add Product View on WooCommerce Shop Page
If you’d like to remove the “Add to Cart” button and instead make product images and titles link to the single product page, this guide walks you through the process using WooCommerce filters and actions.
Step 1: Disable the Add to Cart Button
Insert the code below into your theme’s functions.php file or in a custom plugin:
function custom_remove_add_to_cart_button($html, $product) {
if (is_shop()) {
return '';
}
return $html;
}
add_filter('woocommerce_loop_add_to_cart_link', 'custom_remove_add_to_cart_button', 10, 2);
Step 2: Link Image and Title to the Product Page
Use this code to wrap product images and titles with links to their single product pages:
function custom_shop_product_link($html, $product) {
if (is_shop()) {
$product_url = get_permalink($product->get_id());
$html = '<a href="' . esc_url($product_url) . '">' . $html . '</a>';
}
return $html;
}
add_filter('woocommerce_product_get_image', 'custom_shop_product_link', 10, 2);
add_filter('woocommerce_template_loop_product_title', 'custom_shop_product_link', 10, 2);
Step 3: Save and Test the Output
Save your changes and refresh your WooCommerce shop page. You should now see that the “Add to Cart” button is gone, and images and titles link to the product pages instead.
Note: Removing the “Add to Cart” button may reduce direct conversions. Make sure this behavior aligns with your shop’s sales strategy.
