Showing content under the add to cart button on the single product page can help you convey important messages to the customer. You may wish to display a promotion, offer, or shipping options earlier on in the buying process. Placing positive statements near call-to-actions can sometimes influence a conversion, particularly if your messaging is something like “secure checkout”, “30 day money back guarantee”, or ” most popular product”. This quick guide shows you how you can add custom content under the add to cart page. This example in particular displays a shipping notice with a Font Awesome icon.
/**
* Snippet Name: Show custom content under the WooCommerce single product add to cart button.
* Snippet Author: ecommercehints.com
*/
function ecommercehints_content_after_add_to_cart_form() {
echo '<span id="undercartcontent">FREE UK POSTAGE <i class="fas fa-truck"></i></span>';
};
add_action( 'woocommerce_after_add_to_cart_form', 'ecommercehints_content_after_add_to_cart_form', 10, 0 );
2 Responses
Hey guys! Thanks for the code 🙂 is there a way to code it so that the text is bigger underneath the cart button on a mobile?
Many thanks
Hey Emma!
We’ve updated the code snippet – specifically we’ve assigned the custom content a span ID.
This means the custom content can be targetted using custom CSS.
Use this new code snippet then simply add to your single product template the following CSS:
#undercartcontent {
font-size:25px;
}
Let us know how you get on and anything else you need help with!