How to Add WhatsApp button in Woocommerce Product Page

Put this in your child theme’s functions.php

// Add WhatsApp button next to Add to Cart on single product page
add_action( ‘woocommerce_after_add_to_cart_button’, ‘bbl_add_whatsapp_button_near_add_to_cart’ );

function bbl_add_whatsapp_button_near_add_to_cart() {
if ( ! is_product() ) {
return;
}

global $product;

// Your WhatsApp number
$whatsapp_number = '8801XXXXXXXXX'; // change this!

// Create default message with product title & URL
$product_title = $product->get_name();
$product_url   = get_permalink( $product->get_id() );

$message = sprintf(
    'Hi, I would like to know more about this product: %s %s',
    $product_title,
    $product_url
);

// Encode message for URL
$wa_link = 'https://wa.me/' . $whatsapp_number . '?text=' . rawurlencode( $message );
?>

<a href="<?php echo esc_url( $wa_link ); ?>"
   target="_blank"
   rel="noopener noreferrer"
   class="button whatsapp-button">
    💬 WhatsApp
</a>

<?php

}

Add some basic CSS so it looks nice

Add this CSS in:

• Appearance → Customize → Additional CSS, or
• Your child theme’s style.css.

/* WhatsApp button styling near Add to Cart / .single-product .cart .whatsapp-button { margin-left: 10px; / space from Add to Cart */
padding: 0 18px;
line-height: 40px;
display: inline-block;
border-radius: 4px;
text-decoration: none;
font-weight: 500;
}

/* Green WhatsApp style */
.single-product .cart .whatsapp-button {
background: #25D366;
color: #ffffff;
border: none;
}

.single-product .cart .whatsapp-button:hover {
opacity: 0.9;
}