change the add basket icon on the product page, with just text “add to cart

Hi,

Instead of modifying this file, what if you removed this template (the overrride) file from your theme? so that the standard template file is loaded from the woocommerce plugin.

So you actually get the default button with text? Note: it will not only require code changes in the template file but also the necessary CSS.

Regards

hi @crslz
oo, how to delete template files in the theme, and replace them with the default woocommerce
what code do i need to add in the function theme.php or in ccs
I do not understand how to handle it
thank you

I mean next file

yourtheme/woocommerce/loop/add-to-cart.php.

In the plugin of woocommerce there are default theme files, if you use these files in your theme (a copy with adjustments) they will override the default files of the woocommerce plugin.

So if you deleted the file from your theme, the default file (from woocommerce plugin) will be loaded anyway

NOTE: before deleting, make a copy of this file on your PC as a backup file !!

hi @crslz
thank you for the prompt reply
I just deleted all the code files, and the display is blank,
do i have to delete the fordel “loop / add-to-cart.php”
Thank you very much

Hello @arwah12, There is another way to change the button text add the below code in your themes’s functions.php file.

add_filter( 'woocommerce_product_add_to_cart_text', 'mwb_change_the_button_text', 10, 2 );
/**
* This function is used for change the button text.
*
* @name mwb_change_the_button_text
* @since 1.0.0
* @param string $button_text  this is button text by default.
* @param array $product  This is the array of the product.
* @author Mohit Mishra
* @link https://makewebbetter.com
*/
function mwb_change_the_button_text( $button_text , $product ) {
    if ( 'simple' === $product->get_type() ) { // here we are apply these change to the simple products only.
        $button_text = esc_html__( 'Your button text',
            'text_domain' );
    }
    return $button_text;
}

hi @mohitmishra
I have tried adding your code in the functions.php themes
but it doesn’t work either
is there anything left?

add_filter( 'woocommerce_product_add_to_cart_text', 'mwb_change_the_button_text', 10, 2 );
/**
* This function is used for change the button text.
*
* @name mwb_change_the_button_text
* @since 1.0.0
* @param string $button_text  this is button text by default.
* @param array $product  This is the array of the product.
* @author Mohit Mishra
* @link https://makewebbetter.com
*/
function mwb_change_the_button_text( $button_text , $product ) {
    if ( 'simple' === $product->get_type() ) { // here we are apply these change to the simple products only.
        $button_text = esc_html__( 'Add to Cart',
            'text_domain' );
    }
    return $button_text;
}

thanks

Hello, @arwah12 Put the below the code in your functions.php I am sure this will slove your problem.

// Change the woocommerce add to cart button icon.
add_filter( 'woocommerce_loop_add_to_cart_link', 'mwb_change_add_to_cart_button', 10, 2 );
/**
* This function will chnagr the Add to cart button icon.
*
* @name mwb_change_add_to_cart_button
* @since 1.0.0
* @param string $add_to_cart  Button for the Add to cart.
* @param array $product Array of the products.
* @author Mohit Mishra
* @link https://makewebbetter.com
*/
function mwb_change_add_to_cart_button( $add_to_cart, $product ) {
    return sprintf( '<a href="%s" rel="nofollow" data-quantity="%s" data-product_id="%s" data-product_sku="%s" class="cat btn add_to_cart_button %s" title="%s">%s</a>',
        esc_url( $product->add_to_cart_url() ),
        esc_attr( isset( $quantity ) ? $quantity : 1 ),
        esc_attr( $product->get_id() ),
        esc_attr( $product->get_sku() ),
        esc_attr( isset( $class ) ? $class : 'button' ),
        esc_html( $product->add_to_cart_text() ),
        esc_html__( $product->add_to_cart_text(),'text_domain' )// put your textdomain here.
    );
}

Hi Guys,

Sorry for the newb post
But I have the same task
Trying to change icon to the text
Search for the code you’re post above
But no luck. There’s no such code
Code is the different for each theme? Or I search in the wrong place

@arwah12: you say: “I just deleted all the code files.” You only had to delete 1 file? the ‘add-to-cart.php’ file from your theme folder.

@puckett20: it is indeed true that this can be slightly different for each theme. In the theme folder, the original file from the woocommerce folder is overwritten with adjustments. That is why I recommend deleting this file so that the default file is loaded from the woocommerce plugin. Then you should see the button with ‘add to cart’ text. But as I mentioned earlier, there are still css adjustments needed to layout to get this fully on track, and that will be different for each theme.

@puckett20 You can try the above code given by me. It will help you.

@mohitmishra your hook will only works to change text that is already present, not to change an icon that has been added from a template file with other html formatting.

@crslz I have used the filter that will always present in the add-to-cart-template.php by default. So it will be always present over there.Here is the name of the filter”woocommerce_loop_add_to_cart_link”.By using this you can change the icon of the button.

• This reply was modified 5 years, 1 month ago by Mohit Mishra.

@mohitmishra I was talking about this one. the last code you added will indeed overwrite this.

Only then do you have the code from the original file (woocommerce folder). Then the file from the template folder (the overridden) and this hook that will adjust this again.

@crslz Yes if the template file will contain the filter then My code will work fine.But Incase anyone will remove the filter then your option of overrriding the template will be best.

hi @crslz
I have removed all the code and folders in the “loop / add-to-cart.php” theme
and works well, now it has a standard add to cart woocommerce function
and I modified the add to cart button with the code @mohitmishra in functions.php besarta I added some code in css
it also works well
thank you @crslz and @mohitmishra Thank you to all of you