2 Easy ways to change add to cart text if a product is in cart on WooCommerce

This Article will guide you to change add to cart text if a product is in cart on WooCommerce. We designed and developed lots of WooCommerce stores for our customers, so everyday we face lots of customization demand and challenges from clients.

Recently one of client asked if we can change the text of button “ADD TO CART” dynamically after the product is added in cart? At first sight, it seems bit tricky but when we had a look on WooCommerce codex, things became clear.

Code to change add to cart text

Use code below which you can use to change “ADD TO CART” text of button dynamically once product added to cart.

Here our text changes to “ADDED TO CART”. You can define your own text on last section of the code.

// Conditional function that checks if a product is in cart and return the correct button text
function change_button_text( $product_id, $button_text ) {
    foreach( WC()->cart->get_cart() as $item ) {
        if( $product_id === $item['product_id'] ) {
            return __('Already in Cart. Add again?', 'woocommerce');
        }
    }
    return $button_text;
}

// Archive pages: For simple products (ajax add to cart button)
add_filter( 'woocommerce_product_add_to_cart_text', 'change_ajax_add_to_cart_button_text', 10, 2 );
function change_ajax_add_to_cart_button_text( $button_text, $product ) {
    if ( $product->is_type('simple') ) {
        $button_text = change_button_text( $product->get_id(), $button_text );
    }
    return $button_text;
}

// Single product pages: Simple and external products
add_filter( 'woocommerce_product_single_add_to_cart_text', 'change_single_add_to_cart_button_text', 10, 2 );
function change_single_add_to_cart_button_text( $button_text, $product ) {
    if (  ! $product->is_type('variable') ) {
        $button_text = change_button_text( $product->get_id(), $button_text );
    }
    return $button_text;
}

// Single product pages: Variable product and its variations
add_action( 'woocommerce_after_variations_form', 'action_after_variations_form_callback' );
function action_after_variations_form_callback() {
    global $product;

    // Get the product variation Ids for the variable product
    $children_ids = $product->get_visible_children();

    $ids_in_cart  = [];

    // Loop through cart items
    foreach( WC()->cart->get_cart() as $item ) {
        if( in_array( $item['variation_id'], $children_ids ) ) {
            $ids_in_cart[] = $item['variation_id'];
        }
    }
    ?>
    <script type="text/javascript">
    jQuery(function($){
        var b = 'button.single_add_to_cart_button',
            t = '<?php echo $product->single_add_to_cart_text(); ?>';

        $('form.variations_form').on('show_variation hide_variation found_variation', function(){
            $.each(<?php echo json_encode($ids_in_cart); ?>, function(j, v){
                var i = $('input[name="variation_id"]').val();
                if(v == i && i != 0 ) {
                    $(b).html('<?php _e('Added to cart', 'woocommerce'); ?>');
                    return false;
                } else {
                    $(b).html(t);
                }
            });
        });
    });
    </script>
    

Where to paste the code to to change add to cart text?

Well the code will go in functions.php file of your child theme. If you don’t have child theme, then create one child theme and add code in functions.php file. If you have any question, just comment below or connect with our Developer here

HAPPY CODING 🙂