12

When click on add to cart button, the Woocommerce shows the message, view cart, I want to edit this message, actually edit all the span, put some icon etc...

Anthon
  • 69,918
  • 32
  • 186
  • 246
Dante
  • 121
  • 1
  • 1
  • 3
  • You want to change the message on AJAX add to cart or on product pages? – Abstract Sep 17 '14 at 01:40
  • Yes, this message that say only "view cart" I want to edit that, I did try edit the class using css "before", but the result is not so cool... – Dante Sep 18 '14 at 01:59

6 Answers6

22

Add a filter to your theme/functions.php. The code below just overrides the existing $message. This overwrites $message with an nearly identical one that prepends a "checkout" link to the message.

Make sure you return the $message.

You can of course just modify the existing message, as the entire thing is passed as a string via the first param or $message var.

add_filter ( 'wc_add_to_cart_message', 'wc_add_to_cart_message_filter', 10, 2 );
function wc_add_to_cart_message_filter($message, $product_id = null) {
    $titles[] = get_the_title( $product_id );

    $titles = array_filter( $titles );
    $added_text = sprintf( _n( '%s has been added to your cart.', '%s have been added to your cart.', sizeof( $titles ), 'woocommerce' ), wc_format_list_of_items( $titles ) );

    $message = sprintf( '%s <a href="%s" class="button">%s</a>&nbsp;<a href="%s" class="button">%s</a>',
                    esc_html( $added_text ),
                    esc_url( wc_get_page_permalink( 'checkout' ) ),
                    esc_html__( 'Checkout', 'woocommerce' ),
                    esc_url( wc_get_page_permalink( 'cart' ) ),
                    esc_html__( 'View Cart', 'woocommerce' ));

    return $message;
}
zmonteca
  • 2,304
  • 1
  • 26
  • 26
  • 4
    This solution is no longer working. WC 3.0 requires to use "wc_add_to_cart_message_html" instead of 'wc_add_to_cart_message' and 'wc_add_to_cart_message_filter' – Yala Yala Herzlin Oct 03 '17 at 23:30
7

Have you tried a filter like the following

function your_add_to_cart_message() {
if ( get_option( 'woocommerce_cart_redirect_after_add' ) == 'yes' ) :
    $message = sprintf( '%s<a href="%s" class="your-style">%s</a>', __( 'Successfully added to cart.', 'woocommerce' ), esc_url( get_permalink( woocommerce_get_page_id( 'shop' ) ) ), __( 'Continue Shopping', 'woocommerce' ) );
else :
    $message = sprintf( '%s<a href="%s" class="your-class">%s</a>', __( 'Successfully added to cart.' , 'woocommerce' ), esc_url( get_permalink( woocommerce_get_page_id( 'cart' ) ) ), __( 'View Cart', 'woocommerce' ) );
endif;
return $message;
}
add_filter( 'wc_add_to_cart_message', 'your_add_to_cart_message' );

In reply to the ajax message update, try a translation function like:

function your_woo_ajax_solution( $translation, $text, $domain ) {
  if ( $domain == 'woocommerce' ) { // your domain name
    if ( $text == 'View Cart' ) { // current text that shows
        $translation = 'Basket updated.'; // The text that you would like to show
    }
  }

  return $translation;
}
add_filter( 'gettext', 'your_woo_ajax_solution', 10, 3 );
BradleyD
  • 71
  • 4
  • 1
    This function is good, but I want to change the message on product list, when click the ajax add to cart, this function changed only the message on single product page. – Dante Sep 20 '14 at 01:09
6

2017 - 2019 - For Woocommerce 3+ (handling multiple products added to cart)

Replaced by wc_add_to_cart_message_html filter hook, the 2nd function argument has changed to $products (instead of $product_id)…

You can make changes on the code inside this hooked function, like in this thread: 

add_filter( 'wc_add_to_cart_message_html', 'custom_add_to_cart_message_html', 10, 2 );
function custom_add_to_cart_message_html( $message, $products ) {
    $titles = array();
    $count  = 0;

    foreach ( $products as $product_id => $qty ) {
        $titles[] = ( $qty > 1 ? absint( $qty ) . ' &times; ' : '' ) . sprintf( _x( '&ldquo;%s&rdquo;', 'Item name in quotes', 'woocommerce' ), strip_tags( get_the_title( $product_id ) ) );
        $count += $qty;
    }

    $titles     = array_filter( $titles );
    $added_text = sprintf( _n( '%s has been added to your cart.', '%s have been added to your cart.', $count, 'woocommerce' ), wc_format_list_of_items( $titles ) );

    // The custom message is just below
    $added_text = sprintf( _n("%s item has %s", "%s items have %s", $count, "woocommerce" ),
        $count, __("been added to your basket.", "woocommerce") );

    // Output success messages
    if ( 'yes' === get_option( 'woocommerce_cart_redirect_after_add' ) ) {
        $return_to = apply_filters( 'woocommerce_continue_shopping_redirect', wc_get_raw_referer() ? wp_validate_redirect( wc_get_raw_referer(), false ) : wc_get_page_permalink( 'shop' ) );
        $message   = sprintf( '<a href="%s" class="button wc-forward">%s</a> %s', esc_url( $return_to ), esc_html__( 'Continue shopping', 'woocommerce' ), esc_html( $added_text ) );
    } else {
        $message   = sprintf( '<a href="%s" class="button wc-forward">%s</a> %s', esc_url( wc_get_page_permalink( 'cart' ) ), esc_html__( 'View cart', 'woocommerce' ), esc_html( $added_text ) );
    }
    return $message;
}

Related threads (for Woocommerce 3+):

LoicTheAztec
  • 229,944
  • 23
  • 356
  • 399
2

If you look at add-to-cart.js it fires a trigger added_to_cart on adding a product to cart. I hooked into that and did this

jQuery(document.body).on("added_to_cart", function( data ) {
    jQuery('button.added').nextAll().remove();
    jQuery('button.added').after(' <span style="text-align:center;display:block;" class="cart_updated_ajax"><a href="' + wc_add_to_cart_params.cart_url + '" title="' +
                            wc_add_to_cart_params.i18n_view_cart + '">Cart Updated</a></span>');
});

Here you can add anything after product is added to cart.

Hope that helps!

Abstract
  • 561
  • 1
  • 8
  • 29
1

In Woocommerce 3.0 "wc_add_to_cart_message" is obsolete and no longer works. So while the answer by @zmonteca was ok, is no longer working on the Woocommerce 3.0

Just replace "wc_add_to_cart_message" with "wc_add_to_cart_message_html" and voile... works.

add_filter ( 'wc_add_to_cart_message', 'wc_add_to_cart_message_filter', 10, 2 );
function wc_add_to_cart_message_filter($message, $product_id = null) {
$titles[] = get_the_title( $product_id );

$titles = array_filter( $titles );
$added_text = sprintf( _n( '%s has been added to your cart.', '%s have been added to your cart.', sizeof( $titles ), 'woocommerce' ), wc_format_list_of_items( $titles ) );

$message = sprintf( '%s <a href="%s" class="button">%s</a>&nbsp;<a href="%s" class="button">%s</a>',
                esc_html( $added_text ),
                esc_url( wc_get_page_permalink( 'checkout' ) ),
                esc_html__( 'Checkout', 'woocommerce' ),
                esc_url( wc_get_page_permalink( 'cart' ) ),
                esc_html__( 'View Cart', 'woocommerce' ));

return $message;}
Yala Yala Herzlin
  • 552
  • 2
  • 8
  • 25
1

@Dante is correct, the solutions provided by @BradleyD won't work for ajax_add_to_cart on shop page.

The solution provided by @Abstract is working as expected. I am also using his solution.

Another jQuery approach is to to listen for the the ajaxSuccess event on the document object and do the desired modifications for the clicked button.

Something like that should work:

$(document).ajaxSuccess(function(event, xhr, settings) {
    if (settings.url.indexOf('?wc-ajax=add_to_cart') !== -1) {
        // You can find the clicked button element under the event.target.activeElement
        // Than you can do whatever you want here. Add new html element and text, etc.
    }

});
kostadinovstoil
  • 21
  • 8