Pawan Kumawat

Remove Add Cart, Add View Product on Shop Page WooCommerce

To remove the “Add to Cart” button and link the product image/title to the single product page on the WooCommerce shop page, you can use a combination of filters and hooks. Here’s how you can achieve this:

Step 1: Remove the “Add to Cart” Button Add the following code to your theme’s functions.php file or a custom plugin:

function custom_remove_add_to_cart_button($html, $product)
{
    // Check if you are on the shop page
    if (is_shop()) {
        // Remove the "Add to Cart" button
        return '';
    }
    return $html;
}
add_filter('woocommerce_loop_add_to_cart_link', 'custom_remove_add_to_cart_button', 10, 2);

Step 2: Link the Product Image and Title to the Single Product Page Add the following code to your theme’s functions.php file or a custom plugin:

function custom_shop_product_link($html, $product)
{
    // Check if you are on the shop page
    if (is_shop()) {
        // Get the product ID
        $product_id = $product->get_id();

        // Get the product URL and wrap the product image and title with the link
        $product_url = get_permalink($product_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 Changes and Test Save the changes to your functions.php file or custom plugin. Now, when you visit the WooCommerce shop page, the “Add to Cart” button will be removed, and the product image and title will be linked to the single product page.

Please note that removing the “Add to Cart” button on the shop page might affect the overall user experience, and customers won’t be able to add products directly to the cart from the shop page. Make sure this is the desired behavior for your store.

Additionally, if your theme has custom shop page templates or if you’re using a page builder, you might need to adjust the code accordingly to target the correct elements on the shop page. Always test the changes in a staging environment to ensure they work as expected before implementing them on a live site.

Categories

Related Blogs

Add same product to cart twice instead of changing quantity in Cart

By default, WooCommerce allows customers to change the quantity of a product in the cart by updating the quantity input field on the cart page. If the quantity is increased, the product will be added to the cart only once with the updated quantity. However, if you want to allow customers to add the same product multiple times as separate items in the cart, you’ll need to customize the cart behavior.

Create WooCommerce Orders Programmatically

To create WooCommerce orders programmatically in WordPress, you can use the `wc_create_order()` function provided by WooCommerce. This function allows you to create orders and add products to them. Make sure you have WooCommerce installed and activated in your WordPress environment. Here’s a step-by-step guide: