WooCommerce: Add Text Under Each Product @ Shop Page

A client asked me to add a “Free Shipping” notice under each WooCommerce product on the Shop Page. This can increase your click-through rate and hence your sales conversion rate. Here are a couple of PHP and CSS snippets so that you can implement this helpful edit.

WooCommerce: Display a Custom Product Text Badge @ Shop Page

PHP snippet: show “Free Shipping” under each product @ WooCommerce Shop


/**
 * @snippet       Display "Free Shipping" under each product @ WooCommerce Shop
 * @how-to        Watch tutorial @ https://businessbloomer.com/?p=19055
 * @source        https://businessbloomer.com/?p=330
 * @author        Rodolfo Melogli
 * @compatible    Woo 3.5.1
 * @donate $9     https://businessbloomer.com/bloomer-armada/
 */

add_action( 'woocommerce_after_shop_loop_item', 'bbloomer_show_free_shipping_loop', 5 );

function bbloomer_show_free_shipping_loop() {
	echo '<p class="shop-badge">Free Shipping</p>';
}

“I don’t code – is there a reliable plugin for that?”

As many readers would love to code but don’t feel 100% confident with it, I decided to look for a reliable plugin that achieves the same (or even better) result.

In this case, I recommend the YITH WooCommerce Badge ManagementΒ plugin. On top of displaying custom text badges (free version), you can also create CSS, image and advanced badges, assign product badges to specific products and/or categories, pick the badge position and much more.

But in case you wish to code, keep reading πŸ™‚

Where to add this snippet?

You can place PHP snippets at the bottom of your child theme functions.php file (before "?>" if you have it). CSS, on the other hand, goes in your child theme style.css file. Make sure you know what you are doing when editing such files - if you need more guidance, please take a look at my free video tutorial "Where to Place WooCommerce Customization?"

Does this snippet (still) work?

Please let me know in the comments if everything worked as expected. I would be happy to revise the snippet if you report otherwise (please provide screenshots). I have tested this code with Storefront theme, the WooCommerce version listed above and a WordPress-friendly hosting on PHP 7+.

If you think this code saved you time & money, please join other Business Bloomer supporters and avail of 365 days of WooCommerce benefits. Thank you in advance :)

Need Help with WooCommerce Customization?

Check out these free video tutorials!

  • how-to-edit-woocommerce-with-php-snippets
  • woocommerce-hooks-add_action-list-visual
  • woocommerce-customize-single-product-page-PHP

Rodolfo Melogli

Author, WooCommerce expert and WordCamp speaker, Rodolfo has worked as a WooCommerce freelancer since 2011. His goal is to help entrepreneurs and developers overcome their WooCommerce nightmares. Rodolfo loves travelling, chasing tennis & soccer balls and, of course, wood fired oven pizza.

39 thoughts on “WooCommerce: Add Text Under Each Product @ Shop Page

  1. I really appreciate your good article! But how about changing ‘Free shipping’ to ‘read more’, and connect it to product page when clicking it?

    1. Hey there, thanks so much for your comment! Yes, this is possible – but unfortunately this is custom work and I cannot provide a complementary solution here via the blog comments. If you’d like to get a quote, feel free to contact me here. Thanks a lot for your understanding! ~R

  2. Hi,

    Can you help me with right snippet for showing “free shipping” text on category pages but for specific products only? Thanks

    1. Hi Krecko – thanks so much for your comment! I suggest you take a look at “conditional logic”: https://businessbloomer.com/conditional-logic-woocommerce-tutorial/ and https://businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/. Let me know πŸ™‚

  3. Hi, how do I go about changing the alignment? Right now it sits on the left hand bottom corner but I need it to be centered. Thanks!

    1. Hey Farah, thanks for your comment! You’ll need a bit of CSS for that πŸ™‚

  4. Hi, Rodolfo!

    Thanks for your snippets, it’s very usefull.

    I want to add text only for variable products. How can I change this snippet for my issue?

    1. I try to do this:

      function show_free_shipping () {
      if( $product-&gt;is_type( 'simple' ) ){
      echo 'Free Shipping';
      }
      add_action('woocommerce_after_shop_loop_item','single_product_type', 20);
      

      But its wrong πŸ™

      1. Function name does not match πŸ™‚

  5. Hi Rodolfo,
    I’m one of your fans in terms of how you neatly work on woocommerce. You’ve mastered the art of how to make things sound and look easy. Recently, I’ve also learned about creating widgets. I think setting up widgets for these customizations will be of great value. I just thought, I might be able to help in return with this. Because if a widget is setup, choosing specific products and editing will be a lot comvenient and safe. It will also save woocommerce users a lot of time, like 20x more. πŸ™‚

    1. Thanks for that Henry πŸ™‚

  6. Hi there,

    Excellent resource!

    I have used you snippet but I want to integrate it with the a Custom field plugin

    I have a custom field “forfatter_key” that is retrieved with: wccf_print_product_prop_value()

    How is that integrated into your snippet?

    1. Hey Laurits, thanks so much for your comment! Yes, this is possible – but unfortunately this is custom work and I cannot provide a complementary solution here via the blog comments. Thanks a lot for your understanding! ~R

  7. Possible to show the free shipping only if the product price is above the shipping threshold?

    like free delivery for product above $20?

    Thanks

  8. Is it possible to have the text after the price but keep it in the loop item? I need the text to also link to the item page, thanks

    1. Hey Pete, thanks for your comment! Yes, of course, you just need to change “hook”. I recommend studying this guide: https://businessbloomer.com/woocommerce-visual-hook-guide-archiveshopcat-page/

  9. I want to print message free shipping in my shop page in condition wise like if mobile category so print free shipping other category then i don’t want to print free shipping and print this is not free shipping like…

    1. Hey Meet, thanks for your comment! This resource should help: https://businessbloomer.com/woocommerce-conditional-logic-ultimate-php-guide/. Let me know

  10. I just found your website on a random search.. Thanks for sharing your knowledge… I am using the php snippet to show per carton text underneath each product on the home page of a site… It works like a charm!!

    Now my client has added a new product..
    And for that individual product they need to have the “per carton” text removed..the product category is “soy-wax-candles”.. I tried excluding the new product by product id without any luck..

    I am new to php, but willing to learn.. Just need a nudge on the right direction..

    Any help that you can offer would be great!

    Signed-up for you news letter!

    1. Mike thank you so much for the feedback – much appreciated! Can you let me know what you did when you “tried excluding the new product by product id without any luck”? That would possibly help me help you πŸ™‚

  11. Thanks for illustrating use of the hook but don’t use id=”loopfree” in the loop as it will create multiple instances of the same id.

    1. Hey Bobster thanks a million for your very helpful comment! I just updated the snippet and changed that from id to class. Much appreciated πŸ™‚

  12. Hello πŸ™‚

    You can have the message call for price on the store page in products where the price is empty ?

    1. Hey Hugo thanks for your comment! Yes, this is custom but you can check if price is empty and return a custom message πŸ™‚

  13. Hello,
    is it possible to add an additional line just after(below) the product title on the category pages? So not underneath the price but between product title and price? I know how to add the product_excerpt there, but I don’t want the product excerpt, just one small additional line. Thanks!

    1. Hello Andrea, thanks for your message! Of course it is possible. I used “woocommerce_after_shop_loop_item” hook, but there are more hooks you cna use to target the exact position you wish to place your text. Try using “woocommerce_after_shop_loop_item_title” πŸ™‚

  14. Hi,

    Many thanks for these high quality yet simple code snippets for woocommerce. i want to put KG/peace after the “quantity box”. is that possible, if yes then how?

    Thanks in advance

    1. Thanks for the feedback! To add the weight, try this:

      if ( $product->has_weight() ) {
          echo $product->get_weight();
      } 
      
  15. is possible this? only show the message (free shipping) if the amount is more than certain price ? (sorry my english)

    1. Hello Martin, thanks for your reply – check this article: https://businessbloomer.com/woocommerce-add-need-spend-x-get-free-shipping-cart-page – it works in a similar way than the one you’re asking. Hope this helps!

  16. Thank you for this code. Is it possible to add a custom message under a specific product. Some of my products will have freight cost sice they are heavy.

    1. Johannes, thank you for your enquiry! Yes, of course, it is possible to do absolutely everything πŸ™‚

      You will need some more advanced PHP that controls if the product weight is above “XYZ”, and only then prints the extra message.

      It’s a bit advanced. You can check the product weight with this: $weight = woocommerce_get_product_terms($product->id, ‘pa_weight’, ‘names’)

      Hope this helps!

  17. Hi,

    FYI, I never received you follow-up comments notification email (3 posts).

    I had made it worked in parent category. Need you light here.
    1. I had 41 subcategory (incl. 1 parent category – Books) how is the conditional tags like? have to key-in all “slug”? Any conditional tag 1parent category apply to all subcategory?
    2. I google-ing the conditional tag for apply all “product” to “shop page” and category (& subcategory) for specific category (with the answer point 1.0). Any guide?

    Thousand Thanks

    1. The conditional tag is_product_category(‘slug’) works with main and sub categories no problem. In case you have multiple categories to target, you can use is_product_category( array( ‘slug1’, ‘slug2’ ))

      Hope this helps!

  18. Useful resources. Same question I asked before, Can I use WC conditional tag to wrap your snippets for specific product category, especially root-category (included all subcategory).

    Almost complete read all your WooCommerce Tips. Genius!

    Subscribed your newsletters.

    Thanks in advance

    1. Of course! When you trigger the function, you can use something like this:

      if ( is_product_category( ‘shirts’ ) )

Questions? Feedback? Support? Leave your Comment Now!
_____

If you are writing code, please wrap it between: [php]code_here[/php]. Failure to complying with this (as well as going off topic) will result in comment deletion. You should expect a reply in about a week - this is a popular blog but I need to get paid work done first. Please consider joining #BloomerArmada to ask me 1-to-1 WooCommerce questions. Thank you :)

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.