WooCommerce: Link Products, Remove Add to Cart Button

Advanced Guides Code Snippets PHP Snippets Theme Customization Woocommerce WooCommerce Custom Code Woocommerce Hooks WooCommerce Tips Wordpress WordPress Code Snippets WordPress Development WordPress Functions WordPress Snippets

WooCommerce: Link Products, Remove Add to Cart Button Tutorial/Guide

WooCommerce: Replace Add to Cart with View Product Link

  Want more control over how your WooCommerce shop page functions? This tutorial shows you how to remove the "Add to Cart" button and instead link product images and titles to the individual product pages.

Step 1: Remove Add to Cart from Shop Page

Paste the following code into your child theme’s functions.php file or custom plugin:

function disable_add_to_cart_on_shop($html, $product) {
    if (is_shop()) {
        return '';
    }
    return $html;
}
add_filter('woocommerce_loop_add_to_cart_link', 'disable_add_to_cart_on_shop', 10, 2);

Step 2: Link Product Image and Title to Single Page

Now, link the product image and title to the single product page with this:

function link_products_on_shop($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', 'link_products_on_shop', 10, 2);
add_filter('woocommerce_template_loop_product_title', 'link_products_on_shop', 10, 2);

Step 3: Save & Preview the Result

After saving the changes, view your WooCommerce shop page. You'll now see linked product images and titles—no Add to Cart buttons. Heads Up: If your site uses a custom shop template or page builder, double-check compatibility. Always test in a staging setup first.  

💡 Have a Coding Problem?

Search our archives or reach out to our team for solutions and expert advice.