Home / WooCommerce / Add custom message to WooCommerce checkout

Add custom message to WooCommerce checkout

Published On: February 16th, 2020|Categories: WooCommerce|Tags: |4 min read|

Adding a custom message to WooCommerce checkout is a great way to personalize the checkout experience of your customers. You can add security/trust badges or copy to enhance the trust in your site right on that crucial payment page. With custom message on the checkout of your WooCommerce store you can display to your customers a promotional code or even display custom upsell of products by custom condition. (See how to check if the WooCommerce cart contains a product or product category)

Sure you can use a plugin to do that, but more efficient way is to do it with functions.php. Let’s see how it’s done.

In order to add custom content the checkout we will use the special WooCommerce hooks for the WooCommerce Checkout Page, because you want to place that content on a specific place, not anywhere on the checkout. Each WooCommerce checkout hook will display the content on that specific place. Here is a list of those hooks.

List of WooCommerce Checkout Page Hooks

  1. woocommerce_before_checkout_form – before the checkout form. It is placed above the coupon field on the checkout page.
  2. woocommerce_checkout_before_customer_details – placed in the checkout form just before the customer details.
  3. woocommerce_before_checkout_billing_form – before the start of the billing form.
  4. woocommerce_after_checkout_billing_form – after the completion of the billing form.
  5. woocommerce_before_checkout_shipping_form – just before the start of the shipping form.
  6. woocommerce_after_checkout_shipping_form – after the completion of the shipping form.
  7. woocommerce_before_order_notes – before the order notes field on the checkout page.
  8. woocommerce_after_order_notes – after the order notes field on the checkout page.
  9. woocommerce_checkout_after_customer_details – placed after the completion of the customer details i.e after the billing & shipping fields.
  10. woocommerce_checkout_before_order_review – before the order details on the checkout page.
  11. woocommerce_review_order_before_cart_contents – inside the order table body before the content.
  12. woocommerce_review_order_after_cart_contents – inside the order table body after all the content.
  13. woocommerce_review_order_before_shipping – before the shipping section in the order table.
  14. woocommerce_review_order_after_shipping – after the shipping section in the order details table.
  15. woocommerce_review_order_before_order_total – before the total section & after the shipping section in the order details table.
  16. woocommerce_review_order_after_order_total – after the total section & in the order details table.
  17. woocommerce_review_order_before_payment – before the payment methods section on the checkout page.
  18. woocommerce_review_order_before_submit – before the “Place Order” button on the checkout page.
  19. woocommerce_review_order_after_submit – after the “Place Order” button on the checkout page.
  20. woocommerce_review_order_after_payment – after the whole payment section including the “Place Order” button.
  21. woocommerce_checkout_after_order_review – after the order review section on the checkout page which includes the order details table & payment section.
  22. woocommerce_after_checkout_form – at the end after the checkout form.

A comprehensive visual guide can be found here.

PHP Snippet: Add custom content to WooCommerce checkout

Now that we know where we want to be our content, lets actually add it through a function and action. For the demo purpose we’ll add trust badge below the Place order button. Paste the code below in your child theme’s functions.php file.

add_action('woocommerce_review_order_after_payment', 'webroom_add_content_to_woocommerce_checkout', 5);
function webroom_add_content_to_woocommerce_checkout(){
	echo '<div class="trust-badges"><img src="https://example.com/TrustBadges.png"></div>';
}

And here is the result:

WooCommerce add content to checkout page

You can add any conditional or static content/message you want on the desired place on the WooCommerce checkout page.




Related Articles

If you enjoyed reading this, then please explore our other articles below:

More Articles

If you enjoyed reading this, then please explore our other articles below: