Add Text Before and After Add to Cart

Recently I worked on some clients projects and decided to write a complete tutorial about before and after Add to Cart hooks.

#WooCommerce, #cart  / 

On Single Product Pages

Text after Add to Cart button on single product pages WooCommerce
On the screenshot I also added some CSS to the message.

Before Add to Cart Button

Can be done easily with woocommerce_before_add_to_cart_button hook, example:

add_action( 'woocommerce_before_add_to_cart_button', 'misha_before_add_to_cart_btn' );
 
function misha_before_add_to_cart_btn(){
	echo 'Some custom text here';
}

If you are going to use some conditions there, you can obtain current product ID with get_the_ID() function.

After Add to Cart Button

If you are going to add some custom text after “Add to Cart” button, woocommerce_after_add_to_cart_button hook should help you. Example of usage this hook

add_action( 'woocommerce_after_add_to_cart_button', 'misha_after_add_to_cart_btn' );
 
function misha_after_add_to_cart_btn(){
	echo 'Some custom text here';
}

2 More Hooks

But there also 2 more hooks which are very similar – woocommerce_before_add_to_cart_form and woocommerce_after_add_to_cart_form.

I think you can even guess what is their difference. So, the hook woocommerce_before_add_to_cart_form will be fired a little bit earlier that woocommerce_before_add_to_cart_button, before <form> tag.

And the hook woocommerce_after_add_to_cart_form will be fired a little bit later than woocommerce_after_add_to_cart_button, after the closing </form> tag.

On Shop / Product Category Pages

Do you think the above hook will work the same in case you want to add some text on the archive pages? Nope 😁 It is completely different here. But also simple.

Text after Add to Cart button on shop and archive pages.
Works perfectly for Variable products too

Either you would like to display the text before the Add to Cart button or after – in both cases woocommerce_loop_add_to_cart_link should be OK for you.

Just look at this example and everything will become clear for you:

add_filter( 'woocommerce_loop_add_to_cart_link', 'misha_before_after_btn', 10, 3 );
 
function misha_before_after_btn( $add_to_cart_html, $product, $args ){
	$before = ''; // Some text or HTML here
	$after = '' // Add some text or HTML here as well
 
	return $before . $add_to_cart_html . $after;
}
$product
It is a product object – it could be WC_Product_Simple or WC_Product_Variable or even WC_Product_Subscription if you are using WooCommerce Subscriptions plugin. You can obtain $product->id from these objects for example.
$args
It just contains button attributes like quantity, class names etc

More WooCommerce

Misha Rudrastyh
About the author Misha Rudrastyh

Passionate about WordPress and snowboarding, creating websites for over 10 years! Let's work together — just contact me.

If you are a developer too, subscribe to my facebook page.

Leave your question or feedback

phpjsHTMLCSSSQLCode
Please, enter a comment
Please, enter a name
Incorrect email