Customize WooCommerce Add to Cart Button

Customize WooCommerce Add to Cart Button

This snippet allows you to customize the "Add to Cart" button text for different scenarios - shop page, single product page, and different product types.

// Change "Add to Cart" text on single product page
function custom_single_add_to_cart_text() {
    return __('Buy Now', 'woocommerce');
}
add_filter('woocommerce_product_single_add_to_cart_text', 'custom_single_add_to_cart_text');

// Change "Add to Cart" text on product archives (shop/category pages)
function custom_archive_add_to_cart_text() {
    return __('Add to Bag', 'woocommerce');
}
add_filter('woocommerce_product_add_to_cart_text', 'custom_archive_add_to_cart_text');

// Change button text based on product type
function custom_add_to_cart_text_by_product_type() {
    global $product;

    $product_type = $product->get_type();

    switch ($product_type) {
        case 'external':
            return __('Buy on Amazon', 'woocommerce');
        case 'grouped':
            return __('View Products', 'woocommerce');
        case 'simple':
            return __('Purchase', 'woocommerce');
        case 'variable':
            return __('Select Options', 'woocommerce');
        default:
            return __('Add to Cart', 'woocommerce');
    }
}
add_filter('woocommerce_product_add_to_cart_text', 'custom_add_to_cart_text_by_product_type');
add_filter('woocommerce_product_single_add_to_cart_text', 'custom_add_to_cart_text_by_product_type');

// Change button text based on stock status
function custom_add_to_cart_text_by_stock() {
    global $product;

    if (!$product->is_in_stock()) {
        return __('Out of Stock', 'woocommerce');
    }

    if ($product->get_stock_quantity() <= 5 && $product->get_stock_quantity() > 0) {
        return __('Only Few Left - Add to Cart', 'woocommerce');
    }

    return __('Add to Cart', 'woocommerce');
}
add_filter('woocommerce_product_single_add_to_cart_text', 'custom_add_to_cart_text_by_stock');

// Change button text for specific product categories
function custom_add_to_cart_text_by_category() {
    global $product;

    if (has_term('digital-downloads', 'product_cat', $product->get_id())) {
        return __('Download Now', 'woocommerce');
    }

    if (has_term('pre-order', 'product_cat', $product->get_id())) {
        return __('Pre-Order Now', 'woocommerce');
    }

    return __('Add to Cart', 'woocommerce');
}
add_filter('woocommerce_product_add_to_cart_text', 'custom_add_to_cart_text_by_category');
add_filter('woocommerce_product_single_add_to_cart_text', 'custom_add_to_cart_text_by_category');

// Add icon to Add to Cart button
function add_icon_to_cart_button($button_text, $product) {
    $icon = '<svg width="16" height="16" viewBox="0 0 16 16" fill="currentColor"><path d="M0 1.5A.5.5 0 0 1 .5 1H2a.5.5 0 0 1 .485.379L2.89 3H14.5a.5.5 0 0 1 .491.592l-1.5 8A.5.5 0 0 1 13 12H4a.5.5 0 0 1-.491-.408L2.01 3.607 1.61 2H.5a.5.5 0 0 1-.5-.5zM5 12a2 2 0 1 0 0 4 2 2 0 0 0 0-4zm7 0a2 2 0 1 0 0 4 2 2 0 0 0 0-4z"/></svg> ';
    return $icon . $button_text;
}
add_filter('woocommerce_product_add_to_cart_text', 'add_icon_to_cart_button', 10, 2);

Use Cases

E-commerce Best Practices:

• "Buy Now" for single products
• "Add to Bag" for fashion stores
• "Pre-Order" for upcoming products
• "Download" for digital products

Urgency Indicators:

• "Only 3 Left - Add to Cart"
• "Last Chance - Buy Now"
• "Limited Stock - Order Now"

Product-Specific:

// For a specific product ID
if ($product->get_id() === 123) {
    return __('Reserve Your Spot', 'woocommerce');
}

Styling the Button

You can also customize the button appearance with CSS:

.single_add_to_cart_button {
    background: #2ea44f !important;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}