How to create a free shipping bar that boosts sales

Nina De la Cruz Nina De la Cruz 6 min read

The truth is, free shipping on its own isn't as exciting for customers as it used to be – because every other store offers free shipping.

Yet many stores fail to make the most of free shipping bars.

Consider this. You can tell your visitors that shipping is free. But telling them you ship for free to their city is better.


Here is another example. You can announce that shipping is free on orders over $50. But it’s way better to tell them how much they have left to spend to get free shipping.

In this article, we’ll show you how to quickly add a free shipping bar to your Shopify store and turn it into a sales machine using tactics like urgency, gentle nudging, and personalization.

How to create a free shipping bar in Getsitecontrol

The templates we’ll be using as examples are designed in Getsitecontrol. Before getting started, we recommend adding it to your store. Find Getsitecontrol in the Shopify App store and hit Install. The app will do all the heavy lifting, so you won’t have to deal with the code – just follow the instructions in your dashboard.

Step 1. Select a free shipping bar template

Open the quick-start template gallery to select a free shipping bar to your taste.

Free shipping bar gallery for Shopify powered by Getsitecontrol

Click on the templates to see them in action; once you find the one that fits your needs, follow the prompts on the right-hand side to add it to your Getsitecontrol dashboard.

Step 2. Customize the copy

You can change both the text and appearance of the free shipping bar before adding it to your Shopify store. Use the three text fields to edit the minimum order amount, add more details, or place a link.

How to customize the copy on free shipping bar

Notice how we’ve created a sense of urgency by adding TODAY ONLY! to the title. Similarly, you can write 48 HOURS ONLY or WEEKEND OFFER to emphasize that the deal is time-sensitive.

Step 3. Adjust the appearance

From the same Design tab, you can also change the position of the bar on the page, its color, sizing, text font, and image. For instance, instead of the default photo, you can upload a picture of your product, or choose a new creative from the built-in Unsplash gallery.

How to change the appearance of free shipping bar

Step 4. Add personalization

Personalization is a powerful tactic that drives more sales. There are several ways to use personalization when offering free shipping.

Here are some ideas for you to try:

  • Mentioning the visitor’s location in the copy
  • Displaying how much is left to spend to get free shipping
  • Offering free shipping for first-time or returning customers only
  • Offering free shipping on the items or brands they’ve selected

Below, we’ll review 4 shipping bar examples using personalization and explain how to replicate them.

Free shipping bar examples you can steal for your store

1. Free shipping to visitor’s location

Displaying visitors’ locations doesn’t just attract more attention, it also instantly alleviates one of the most common customer concerns regarding shipping: “Do they ship for free to my location, too?”

Here is how to implement this tactic

When editing the copy, click {{var}} to insert a city, country, or region variable – whatever makes sense in your case. Each visitor will see their own location on the free shipping bar.

How to add a location variable to the copy on a free shipping bar

💡 Instead of {{$city}}, you can insert the expression {{$city | your door}}. In that case, whenever Getsitecontrol can’t detect a visitor’s location, the message will say: “Free shipping to your door”.

Keep in mind, that if you want to prevent visitors from certain locations from seeing this message, you can set the following rule in the Targeting settings: Display widget ifGeoRegionis not – and specify the locations you’d like to exclude.

How to display free shipping bar to a selected audience segment

Using the same filter, you can do the opposite: select only those locations where you’d like to display the free shipping bar.

2. Free shipping bar with order amount countdown

Another practice that works well is a free shipping countdown that appears when customers start adding items to the cart.

Here is how to implement this tactic

You can implement this tactic by using the following expression in the copy: {{= CURRENCY(100 - $cartTotalPrice)}}. In this case, $100 is the minimum order amount required to get free shipping and “cartTotalPrice” is the current total price of the items in the cart.

❗ When using this expression, you don't need to enter your currency in the text of your popup, as it will be automatically detected from your store.

However, you also want to make sure the message is only displayed until the customer reaches the required minimum. To achieve that, you need to select the following filter in the Targeting tab: Display widget ifShopify → Cart total price is less than 100.

How to display free shipping bar to those whose total cart price is lower than the required minimum

Using the same logic, you can create another message saying “Congratulations, you get free shipping!” and display it once when the cart total price reaches the minimum order amount.

3. Free shipping for first-time customers

Offering unconditional free shipping can be tricky because many businesses struggle to afford it. One way to go about it is to offer free shipping for a limited time or to a limited audience. For example, you can offer free shipping to first-time store visitors to increase the chances they will convert into customers.

Here is how to implement this tactic

To display this message to first-time visitors only, choose the corresponding filter in the Targeting tab. Scroll to Display widget if, select VisitNew visitors.

How do display a free shipping bar on Shopify to first-time visitors only

💡Notice that we’ve also created a sense of urgency by adding the current date to the copy. This is an easy trick implemented with the Dynamic Text Replacement feature: each visitor will see the date of their current visit. To replicate this, simply insert {{$date}} in the copy.

4. Free shipping on selected brands

Another easy tactic to encourage visitors to follow through with the purchase is to offer free shipping on the brand (or item) they’re looking at.

Here is how to implement this tactic

Add one of the following expressions to the copy: {{$productVendor}} or {{$productType}}. This way, the brand name on the bar will change based on the product page a visitor is viewing.

Depending on your margin, you may want to offer free shipping on a selected number of products or brands. In this case, create the following rule in the Targeting tab: Display widget ifShopifyProduct vendor is – and specify the desired vendor(s).

How to place a free shipping bar on select product pages only

Instead of (or in addition to) free shipping, you may also offer a discount coupon on selected products. This tactic is especially helpful for capitalizing on PPC traffic when you’re trying to convert first-time visitors.

💡 If you want to display a Getsitecontrol popup to those who arrive at your website through ads, you can use the following filter in the Targeting settings: Display widget ifUTMUTM Medium.

Say goodbye to boring free shipping bars

Offering free shipping is crucial for online stores because over 60% of customers are likely to abandon their shopping carts if you don’t. However, if you struggle to offer free shipping at all times, Getsitecontrol provides you with the tools to do it in a way that is sustainable for your business and maximizes conversions at the same time.

Nina De la Cruz is a content strategist at Getsitecontrol. She is passionate about helping small and medium ecommerce brands achieve sustainable growth through email marketing.

You’re reading Getsitecontrol usecase collection where we talk about the best practices for using website popups. This usecase is a part of Grow on Shopify section.

Get the print version

Download a PDF version of our use case for easier offline reading and sharing with coworkers.

Download PDF