Everybody wants to increase the average order value for their store, right? A good way to do this is to offer free shipping above a certain order amount. If you have this on your site you should of course promote this as a selling point on a prominent and default position.
Alongside with that, it would be good to help the customer remind in the cart if they’re close to the free shipping amount with a notification saying something like “Add $10 more to your basket to receive free shipping!”.
In this post I’ll provide a code snippet that you can use to display such message on the cart/checkout page when using the WooCommerce Core ‘Free shipping’ option. I’ll also provide a solution when using the Advanced Shipping or Advanced Free Shipping plugins.
Showing a free shipping notice for WooCommerce Core free shipping rates
Using the following snippet you can show the notice on the cart / checkout page. It will only appear when the minimum order amount setting is set.
You can remove some of the lines if you only want to display it at the cart / checkout page as described inline.
Showing a free shipping notice for Advanced Shipping
If you setup a free shipping option with the Advanced Shipping / Advanced Free Shipping plugin then the above code snippet won’t work as that only recognises the ‘Free shipping’ rate of WC Core and the respective settings. Because of the conditions it is very difficult to setup a code snippet that would fit the exact requirements.
Therefore the easiest solution would be to use the Advanced Messages plugin. Just like the other ones, this plugin has similar conditions and will allow you to setup conditional messages throughout your store.
Here’s how an example setup would look like;
1. The free shipping rate
2. The message
The message would have a similar setup. I’ve added a additional condition to ensure it doesn’t show when there’s too big of a gap between the free shipping amount and the cart subtotal.
3. The message at the cart
Jeroen Sormani
I'm a professional WordPress plugin developer on a mission to create the best plugins for my clients. I'm specialised in developing general WordPress, WooCommerce and Easy Digital Downloads plugins.
Interested in talking about a WordPress project? Get in touch!
Leave a Reply
Who’s this guy?
My name is Jeroen, go ahead and try to pronounce that! I bet you get it wrong if you’re not Dutch 
I am a professional WordPress Plugin Developer, working from Alphen aan den Rijn in the Netherlands. Besides being a seasoned developer, I have a solid background in SEO and have been responsible for hundreds of websites and webshops in my previous work experience.
I build custom plugins for WordPress, WooCommerce and Easy Digital Downloads. My focus is to build the best, secure, reliable, optimized plugins with a good User Experience.
When not working, I like to watch tv series and eat some healthy home-made pizza.
51 thoughts on “Showing a ‘Add $10 more for free shipping’ notice”
Hi Jeroen
Looks like a useful post, but it isn’t clear where we need to paste the code snippet to make it work.
Thanks!
Hi Andy,
You can copy&paste the contents of the script to your (child) themes functions.php. I usually recommend doing it over FTP.
If wanted you can read more about code snippets here: https://aceplugins.com/doc/advanced-shipping-for-woocommerce/developer-adding-a-custom-condition/
Cheers,
Jeroen
The snippit is cool, but it takes into account shipping costs.
For example
$50 item
$20 shipping
Free shipping => 100
Spend another $30 to get free shipping. Notice should say spend another $50. Needs to be item total not cart total.
Thanks for noticing Nick!
I’ve just modified the script to get that sorted out.
Cheers,
Jeroen
Hello Jeroen,
thank you very much for this very handy piece of code!
I don’t want to steal your time, because it’s always uncomfortable to ask somebody already nice to further being helpful!
Yet, I have a question about a situation where I have two different free shipping options, regular free shipping, and priority one.
As I turn on your code, I get a duplicate message, one per free shipping method.
These are the messages:
Add 10$ more to get free shipping!
Add 70$ more to get free shipping!
It would be great to be able to customize the output like this:
Add 10$ more to get free tracking shipping!
Add 70$ more to get free priority shipping!
Do you think this is going to be crazy? =/
Kind regards,
Matteo
Hi Matteo,
Shouldn’t be too difficult, you can either create a second code snippet based on the initial one. Or possibly a easier solution would be to display the shipping title in the notice like so:
Line #26:
wc_add_notice( sprintf( 'Add %s more to get %s!', wc_price( $remaining ), $method->get_title() ) );(untested)
This should show the shipping title in the notice, making it more dynamic and in-line with what you’re looking for.
Regards,
Jeroen
Thanks Jeroen, I’ll take a look and try and see how far I can go =)
And thank you again for sharing!
Matteo
I think I grasped how it works! Thanks! =)
Now I’m out to find a way to separate the variable from the text, so not to directly copy-paste the title of the shipping method! Sure thing, coding is fun!
Matteo
Fantastic the plugin.
I need to show a tag on the product showing free shipping and the state where it will be free. Can you do it?
Example:
Tag on product written freight for free to São Paulo.
And this tag is displayed in the product listing and in the single display of the product.
Hi Samuel,
For tags like that you may want to look at the Advanced Product Labels plugin to see if that fits your needs.
Cheers,
Jeroen
Hi,
I wonder whether you can help?
I just had a customer point out an issue.
The notice showed OK on the Cart page.
She bought the amount needed to get free shipping, and the purchase went through OK, but then the notice also appeared on the Checkout page after the successful order.
And on the Checkout page after the order was completed (we use Stripe) the amount shown in the notice is the total amount that is needed to get free shipping. In other words it is as though no quantity had been ordered as in, say the amount needed to get free shipping is £10.00 – the notices (two of them one below the other) said ‘Add £10.00 more to get free shipping’
I am running the latest stable WooCommerce on the latest WP version and using a theme from Array Themes.
Thanks
Here is a screen grab to show what I mean about the free-shipping notice showing after the purchase, and showing for the full amount that gets free shipping.
https://cloudup.com/cp57YWQUG-f/f
I tried your snippet. When using a coupon for free shipping on $25, this is what happens.
Item 19.99
Coupon -3.00
The message displays spend $5.01 more for free shipping. It should be spend $8.01 for free shipping after deducting the coupon amount.
Thanks,
Steve
Thanks for pointing that out Steve!
I’ve just modified the code snippet to take that into account.
Cheers,
Jeroen
Thanks! It works perfect now.
Just what I was looking for.
Steve
Thank you very much.
Your code is really helpful and working great on my Woocommerce Project 🙂
Hi Jeroen,
This is a great code snippet! We’ve implemented it on our site and works great. I have one question – I noticed this message only shows if the user is logged in. Is there a way to have it show on the cart page if a user is not logged in? Or is this something dictated by the Woo settings?
Thanks!
Claudia
Hi Claudia,
There shouldn’t be a logged in requirement, but note that this is based on the customer location.
Depending on your store settings and the customer progression it may not know the location of the customer yet, thus not showing a notice.
Cheers,
Jeroen
Hi 🙂
Thank you for your snippet!
Is there a way to show appropriate message based on the country which I choose in shipping calculator or on checkout page? I guess the plugin checks matched country by IP when getting to cart or checkout page, but whean I manually change shipping country on any of these pages, the message doesn’t refresh although free shipping treshold do.
Thanks!
Hello Jeroen,
I’m using Advanced Free Shipping plugin and Advanced Messages plugin.
Free shipping => $50
Item = $50
Discount = $10
Item – Discount = $40
So it is supposed to display a notice
‘Add $10 more to get free shipping!’
But it will not display, because the basis of the “Advanced Messages plugin” only the sub-total. It is supposed to have an option of ‘Subtotal minus discount’
Can you please help me how I can do that.
Thanks
Hi Jeroen,
Thanks heaps for your snippet. I was getting repeated notices if I changed addresses, which would change which shipping methods were available. I would end up with things like:
Add $14.15 more to get free shipping!
Add $14.15 more to get free shipping!
I have added
wc_clear_notices();
To the top of the snippet to stop this behaviour. I’m not sure if this is a really bad solution, but it has corrected the behaviour, I would love to know your (or anybody else’s ) thoughts on this?
hi thank’s a lot .. for the snipett.. it’s work well.
I have question about internationalisation ‘ How do I make the text translateable?
Hi, great snippet!
Question, is it possible to hook this message in above the cart in the checkout instead? Also, I need it to work in Ajax, right now it dosen’t update when changing countries (that have free shipping) or updating the cart in the checkout (which use Ajax).
Thanks!
Hi Jeroen,
I pasted your code into my functions.php file and no matter what I do, I can’t get it to display the banner. Wondering if it is compatible with WP 5.0.3 and WooCommerce 3.5.3?
Thanks!
This snipped is great!
It also works with WooCommerce Currency Switcher.
Unfortunately, it checks the subtotal.
We use discounts.
Thus the calculation is not consistent with the freeshipping calculated by woocommerce.
The calculation should subtract the discounts to the subtotal.
For discounts we use the Woo Discount Rules plug-in (by Flycart).
Is it possible to do this calculation?
Thank you!
Paolo
Hi there, this is a great code snippet, thanks! Is there a way, however, to exclude certain products which come with free shipping already attached to them? At the moment, the ‘Add $ more to get free shipping’ message still shows up for these products as it is based on the cart total.
Hi Sophie,
It is possible, but requires some additional customization to allow for that.
What needs to be changed would depend on what you’re looking for (exclude those products from the cart total / those products give free shipping to the entire order / just exclude the message when only those products are in the cart)
Cheers,
Jeroen
Great snippet, works just fine.
I am trying to change the top position by changing “add_action( ‘wp’, ‘my_custom_wc_free_shipping_notice’ );” into another position like for example “add_action( ‘woocommerce_before_cart_contents’, ‘my_custom_wc_free_shipping_notice’ );”
But whatever I do, it always ends up in the alert being displayed below the content. Any ideas are highly aprreciated 🙂
Hi Rainer,
The snippet adds a ‘notice’, which is always positioned at the same position in a theme. If you’d want to display a custom HTML part you can do so instead (you’d want to restyle it a bit likely).
Cheers,
Jeroen
Nice snippet. Thank you.
What if I have a virtual product and don’t want to have that message when someone is ordering that product?
Can you exclude products?
Hi Greg,
It is possible to further customize the snippet to not show for that product.
If you need help, feel free to reach out through the form here; https://jeroensormani.com/contact/
Cheers,
Jeroen
Perfectly worked. thanks a ton.