'Replace add to cart button with a read more linked to product page on shop pages in WooCommerce 3

I am using woocommerce and I have the following issue:

  • The products are displayed in the homepage with their price and add to cart button.
  • Add to cart button redirects to cart page.
  • The image of each product redirects to product page.

An important thing is to allow customers to be able to read the description of the product before adding it to cart.

Is there a way to replace add to cart button with read more in order to redirect from homepage to each product's page where the add to cart button will appear?

phpwordpressbuttonwoocommerceproduct


Solution 1:[1]

Add these to your functions.php file in the theme folder

remove_action( 'woocommerce_after_shop_loop_item', 'woocommerce_template_loop_add_to_cart');
remove_action( 'woocommerce_single_product_summary', 'woocommerce_template_single_add_to_cart');

Solution 2:[2]

In case it helps, this worked for me to apply this solution only to simple products, since variable products don't "add to cart" on archive pages anyway. This way it can be clearer that a product has more options (if it is variable). I also changed the text of "select options" to "more options" in the example below (since not all products in my case would be purchasable even after viewing the single product page's url, which is another non-topical idea for this thread):

// changes the "select options" text. Forget who to give credit to for this.
add_filter( 'woocommerce_product_add_to_cart_text', function( $text ) {
global $product;
if ( $product->is_type( 'variable' ) ) {
    $text = $product->is_purchasable() ? __( 'More Options', 'woocommerce' ) : __( 'Read more', 'woocommerce' );
}
return $text;
}, 10 );

/**
 * remove add to cart buttons on shop archive page
 */

add_filter( 'woocommerce_loop_add_to_cart_link', 'replacing_add_to_cart_button', 10, 2 );
function replacing_add_to_cart_button( $button, $product  ) {
if ( $product->is_type( 'simple' ) ) {
$button_text = __("View product", "woocommerce");
$button = '<a class="button" href="' . $product->get_permalink() . '">' . 
$button_text . '</a>';
}
return $button;
}

Solution 3:[3]

I got the same problem i had a donation product, so it had a custom price i.e. you could make any amount of donation so in the shop page i replaced the add to cart button for that product to "Details" which would redirect it to product single page from where user could make any donation. I used this code. The code goes in your theme's or child theme's functions.php file

function filter_woocommerce_loop_add_to_cart_link( $quantity,$product ) {  
$product_id = $product->get_id();
$title = $product->get_title();
$sku = $product->get_sku();
if($product_id == get_option( 'woocommerce_donations_product_id' )){
    //var_dump($title);
    //var_dump($sku);
    //var_dump($quantity);
    $simpleURL = get_permalink();
    //var_dump($simpleURL);
    $quantity='<a href="'.$simpleURL.'" data-quantity="1" class="product_type_simple ajax_add_to_cart" data-product_id="'.$product_id.'" data-product_sku="'.$sku.'" aria-label="Read more about “'.$title.'”" rel="nofollow"><span class="filter-popup">Détails</span></a>';
    //var_dump($quantity);
}
return $quantity;
//exit();
};
// add the filter 
add_filter( 'woocommerce_loop_add_to_cart_link','filter_woocommerce_loop_add_to_cart_link', 10, 2 );

Solution 4:[4]

This code is working. But at this place for my theme woocommerce/include/class-wc-product-simple.php

// changes the "select options" text. Forget who to give credit to for this.
add_filter( 'woocommerce_product_add_to_cart_text', function( $text ) {
    global $product;
    if ( $product->is_type( 'variable' ) ) {
        $text = $product->is_purchasable() ? __( 'More Options', 'woocommerce' ) : __( 'Read more', 'woocommerce' );
    }
    return $text;
}, 10 );

/**
 * remove add to cart buttons on shop archive page
 */

add_filter( 'woocommerce_loop_add_to_cart_link', 'replacing_add_to_cart_button', 10, 2 );
function replacing_add_to_cart_button( $button, $product  ) {
    if ( $product->is_type( 'simple' ) ) {
        $button_text = __("View product", "woocommerce");
        $button = '<a class="button" href="' . $product->get_permalink() . '">' .
        $button_text . '</a>';
    }
    return $button;
}

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 stephan2307
Solution 2 Joyce Grace
Solution 3 obito7621
Solution 4 Pylyp Dukhov

Related Questions