Free Shipping Banners: Where to Show Them and How to Word the Threshold

Why shipping cost belongs on the page, not at checkout

In Baymard Institute’s survey of US online shoppers, the most common reason for abandoning during checkout — once “just browsing” is set aside — was “extra costs too high (shipping, tax, fees),” at 40%. A separate 12% said they couldn’t see or calculate the total order cost up front (Baymard Institute, cart abandonment rate statistics, last updated September 22, 2025).

A free shipping banner addresses both at once: it tells shoppers the shipping rule early, and it gives them a way to avoid the fee. But it can also make things worse. A banner that says “Free shipping!” when the checkout then charges $7.95 on a $40 order is the same surprise cost, plus a broken promise. Most of this guide is about avoiding that gap.

Step 1: Decide what the offer actually is

Before writing any copy, write the rule down in one sentence, the way your checkout calculates it.

For a threshold, answer these questions before you design anything, because each one changes the wording:

1. Before or after discounts? If a $55 cart drops to $45 with a coupon, does it still qualify?
2. Before or after tax? Most stores use the subtotal before tax and shipping. Say so if it could be unclear.
3. Which shipping method? Free standard shipping is different from free shipping. Express usually isn’t included.
4. Which destinations? Contiguous US only? Excludes P.O. boxes? Different thresholds for other countries?
5. Any excluded items? Oversized items, gift cards, pre-orders.

Setting the threshold amount

This guide is mostly about presentation, but the amount itself decides whether the banner can do anything. A threshold far above what people normally spend is ignored; one below what most people already spend gives away shipping on orders that would have happened anyway. There is no universal right number, so work it out from your own order data.

1. Look at the spread of order values, not just the average. Export the last few months of order subtotals from your store platform and see where most orders fall.
2. Know your real shipping cost per order. Carrier rates, packaging and handling — the amount you would be paying instead of the customer.
3. Check the margin on the extra item. If the threshold pushes someone to add one more product, the margin on that product should cover the shipping you absorb.
4. Make the gap reachable. A shopper with a typical cart should be able to cross the threshold by adding one reasonably priced item. If your cheapest add-on is $25 and the gap is usually $5, many will overshoot and feel the offer was a trick.

A worked example with made-up numbers, just to show the arithmetic: if shipping costs you $8 per order and a typical add-on item earns $12 in margin, an order that crosses the threshold because of that item still leaves $4 after you pay shipping. If the add-on earns only $5, every such order costs you $3. Run the same check with your own figures before you publish anything.

If you sell in more than one currency or country, decide whether each market gets its own threshold. A single “$50” shown to every visitor reads oddly to someone paying in euros, and a converted figure like “€46.37” looks like a mistake. Round amounts per market read better, and they need the same consistency check as everything else below.

Step 2: Word the threshold

A good threshold message is specific, short, and matches the checkout exactly. The amount, the currency and the main condition should be in the banner itself — not hidden behind an asterisk.

Watch the words “over” and “or more.” “Orders over $50” arguably excludes an order of exactly $50. If your checkout grants free shipping at $50.00, write “$50 or more” or “$50+.” It is a small thing, but it is exactly the kind of mismatch that produces support emails.

Step 3: Keep the threshold consistent everywhere

Shoppers meet your shipping rule in many places. If any of them disagree, people will trust the least generous one — or the one that turns out wrong at checkout. Check each of these against the actual checkout calculation:

1. Site-wide bar — the amount and conditions.
2. Product pages — any “free shipping” text near the price or add-to-cart button.
3. Cart page — a progress message such as “$12 away from free shipping,” if your platform can show one.
4. Checkout — the shipping method name and price that appear when the threshold is met and when it isn’t.
5. Shipping policy page — the full rules, including exclusions.
6. Emails and ads — newsletters, campaign landing pages and ad copy.
7. Product feeds — if you list products on Google, Merchant Center has a free_shipping_threshold attribute, defined as “the minimum order cost above which shipping is free,” and Google notes the threshold currency must match the offer’s price currency.

When you change the threshold, change all of them on the same day. Old banners are the easiest thing to forget, which is one reason to give every banner a display period with a real end date.

Step 4: Choose where to show it

Different placements do different jobs. A site-wide bar informs everyone; a banner on a product page reaches people while they are deciding; a reminder on a return visit reaches people who already showed interest.

Bar or modal?

For a free shipping message, a bar is usually the right default. The message is short, it applies to the whole visit, and it doesn’t need the shopper to do anything — so it shouldn’t interrupt them. A bar stays visible without blocking the page. Google’s Search Central guidance on avoiding intrusive interstitials and dialogs recommends banners that take up only a small fraction of the screen instead of overlays that obstruct the content.

A modal fits when the message needs attention or an action: a limited-time free shipping weekend with a countdown, free shipping in exchange for an email sign-up, or a last reminder when someone is about to leave. Keep modals for those cases, make them easy to close, and don’t show one the moment a visitor lands.

A floating banner — a small box in a corner — sits between the two. It can work on product pages for a short message like “Free shipping on orders of $50+,” as long as it doesn’t cover buttons on small screens.

Step 5: Time it to the decision

On a product page, the question “how much is shipping?” comes up when someone is reading details and considering the price — not in the first second. Showing the message after the visitor has scrolled part of the way down catches them at that point and avoids competing with the product photos when the page loads.

1. Site-wide bar: show immediately; it’s information, not an interruption.
2. Product page floating banner: show at around 50% scroll, or after the visitor has been on the page for some seconds.
3. Exit intent modal: only when the visitor is about to leave, and only if it adds something they haven’t seen.
4. Returning visitors: on the first pages of the new visit, when they are deciding whether to pick up where they left off.

Step 6: Target by audience

One message for everyone is fine as a start. Once it’s running, a few segments are worth separate treatment:

A note on the cart segment: a page-based tool can tell that someone viewed the cart URL, but not what was in the cart or how much it was worth. So you can’t write “You’re $12 away” in a banner based on page views alone. That message belongs on the cart page itself, calculated by your store platform.

Design: readable, short, closable

1. One line on a bar. The rule, and nothing else. Move exclusions to the shipping policy and link to it, but keep the main condition (amount, region) in the bar.
2. Contrast. Bars often use brand colors with small text. WCAG 2.2 success criterion 1.4.3 (Contrast (Minimum)) asks for a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text.
3. Mobile first. Check that the bar doesn’t push the product image and price below the fold on a small phone, and that a floating banner doesn’t cover the add-to-cart button.
4. Easy to close. Modals and floating banners need a visible close button. If a bar can’t be closed, keep it slim.
5. Real deadlines only. If you add a countdown, it should count down to the actual end of the offer.

Setting it up in marketingLABO

marketingLABO shows banners on your site from a single tracking tag added to the <head> of every page — no changes to your site’s HTML. It includes 55 English e-commerce templates, with “Free shipping” and “Announcement bars” among the template categories. Here is one way to set up the placements above:

1. Site-wide bar. Start from an “Announcement bars” or “Free shipping” template, set the display to Bar, enter your one-line rule, and show it immediately on the page URL of your site with prefix match so it covers every page under it.
2. Product-page notice. Create a floating banner with the same wording. Set the page URL to your product pages (prefix match, e.g. https://example.com/products/) and the trigger to show at 50% scroll.
3. Returning cart viewers. Create a banner with the conditions Pages viewed = your cart URL, Pages not viewed = your order-complete URL, and visit frequency = a later visit.
4. Devices. Choose all devices, mobile only or desktop only, or upload separate desktop and mobile images.
5. Display period. For a limited-time offer, set the period so the banner stops on the day the offer ends.

Banner formats are image only; image, headline and button; with countdown; and with an email sign-up form. The Free plan includes one pop-up banner, Light includes three, and Standard has no limit — see pricing.

Measuring whether it helps

A free shipping banner changes behavior in ways that are easy to misread, so decide in advance what you’ll look at.

1. Banner numbers. marketingLABO reports impressions and clicks per campaign. Clicks matter for banners with a button (for example, to a “free shipping” collection); a pure information bar may do its job without any clicks.
2. Store numbers. From your store platform: orders, average order value, and the share of orders just above the threshold. A threshold that works tends to pull some orders from just below it to just above it.
3. Behavior. Heatmaps on product and cart pages show whether people still click through to the shipping policy — a sign the message isn’t answering their question.

marketingLABO doesn’t A/B test banners (A/B testing is available for forms). To compare, run one version for a fixed period, then the other, and compare like-for-like periods, keeping in mind that seasons and promotions also move the numbers.

Common mistakes

FAQ

Where should the free shipping message go first?

A site-wide bar is the simplest first step, because it reaches everyone before they get to the cart. Then add the message to product pages and the cart page.

Should I say “over $50” or “$50+”?

Use whatever matches the checkout exactly. If an order of exactly $50.00 qualifies, “$50+” or “$50 or more” is the accurate wording.

Can a banner show how much more someone needs to spend?

Only if the tool knows the cart value. marketingLABO doesn’t read cart data, so this message should come from your store platform on the cart page.

How often should a free shipping modal appear?

Rarely. For most stores a bar carries the message well. If you use a modal, tie it to exit intent or a time-limited offer rather than showing it on every page view.

Should the banner also run on checkout pages?

Usually not. By the time someone is entering their address, the checkout itself should show whether shipping is free. Extra banners there compete with the form. If you show your site-wide bar with a prefix match, check which URLs it covers and leave the checkout out if you can.

Is free shipping better than a discount code?

It depends on your margins and on what stops your shoppers. If your timelines show people visiting the shipping policy and then leaving, shipping is the objection, and a clear free shipping rule addresses it directly. A discount lowers the price of everything in the cart, which costs more on large orders. Compare both against your own order data rather than general rules of thumb.

Ready to try it? Create a free account, add the tag, and set up a free shipping bar from a template. For the bigger picture on why shoppers leave, read Cart Abandonment: Why Shoppers Leave and What You Can Do On-Site.

Sources

1. Baymard Institute, “Cart Abandonment Rate Statistics” (last updated September 22, 2025; accessed October 12, 2026): https://baymard.com/lists/cart-abandonment-rate
2. 16 CFR 251.1, Guide Concerning Use of the Word “Free” (Legal Information Institute, Cornell Law School; accessed October 12, 2026): https://www.law.cornell.edu/cfr/text/16/251.1
3. Google Merchant Center Help, “Free shipping threshold [free_shipping_threshold]” (accessed October 12, 2026): https://support.google.com/merchants/answer/14768922?hl=en
4. Google Search Central, “Avoid intrusive interstitials and dialogs” (last updated December 10, 2025; accessed October 12, 2026): https://developers.google.com/search/docs/appearance/avoid-intrusive-interstitials
5. W3C, Understanding WCAG 2.2 Success Criterion 1.4.3: Contrast (Minimum) (accessed October 12, 2026): https://www.w3.org/WAI/WCAG22/Understanding/contrast-minimum.html