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.

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;
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.
It just contains button attributes like quantity, class names etc

More WooCommerce

Misha Rudrastyh

Misha Rudrastyh

I love WordPress, WooCommerce and Gutenberg so much. 10 yrs of experience.

Need some custom developer help? Let me know

Follow Misha

Need some help with WooCommerce?

If you need some professional developer help, I will be happy to assist you.

Contact me Who I am?

Leave a comment

php js HTML CSS Code