All 17 Free Shipping Bar sections

See every section

Placing the bar

Updated Free Shipping Bar 1.12.0Tested with WordPress 7.1

Under Placement the bar sits at the top or the bottom, and either pushes the page down or floats over it.

There are three arrangements:

  • Push the page down, and scroll away with it — the bar sits in the page, so it never covers your header, and moves up out of the way as the shopper reads.
  • Push the page down, then follow the screen — the same, except it sticks to the top once it would have scrolled away.
  • Float over the page, always in view — pinned to the viewport from the start.

Four of the templates — Edge line, Floating pill, Card and Dial — always float, because that is what they are. Only the visible line, pill, card or block takes clicks, so whatever sits beside it stays usable.

A floating bar keeps its own height free at the edge it is pinned to. At the top, the page starts below it, so your logo, menu and cart button are never underneath it until the shopper scrolls; at the bottom, the page can always be scrolled far enough for its last lines and footer links to clear it. When a shopper moves through the page with the keyboard, each link is scrolled clear of the bar as it takes the focus, and clear of a share bar or cookie banner standing with it too.

A bar along the bottom also tells other floating buttons in the corners how tall it is. The range's own — the Dark Mode switch, the prize wheel's launcher, the table of contents button, the share bar — sit above it rather than behind it.

A bar at the top does the same for the top of the screen, whether it floats or follows the screen. The prize wheel's launcher and the Dark Mode switch in a top corner, a cookie banner at the top and the table of contents reading bar sit below it rather than behind it.

When you are signed in to WordPress, the bar allows for the admin bar so the two never overlap. Your shoppers do not see the admin bar at all.

On the Display screen you can also add in-page reminders at the moments a shopper is deciding whether to add one more thing: on the cart page, on the checkout, under the add-to-cart form on product pages, and inside the mini cart.

The cart and checkout reminders work with the classic cart and checkout and with the Cart and Checkout blocks; on the blocks they sit just above the block. In the mini cart works with both kinds of mini cart. In the dropdown of the classic Cart widget the reminder sits at the foot. In the drawer of the Mini-Cart block, which block themes put in the header, it sits under the drawer's title, above the products, and keeps up as the shopper changes a quantity, removes something or adds more. With nothing in the cart, the drawer shows WooCommerce's own empty-cart message rather than the reminder.

The product page's line about the product#

With On product pages switched on under Display (it is off until you turn it on), the reminder on a product page also speaks for the product in front of the shopper, in one line under the bar:

  • This product unlocks free shipping, when adding it, at the quantity chosen, would reach the threshold. Change the quantity, in the box, with the theme's plus and minus buttons or in a sticky add-to-cart bar that repeats the form, or pick another variation, and the line follows, with nothing asked of the server, so a cached product page is right for every shopper.
  • This product does not count, when the product is in a shipping class left out of the total under Setup → Cart Total. For a variable product it follows the variation chosen, and before a choice it shows only if no variation counts.

The price used is the one the cart will count, with tax or without as your cart shows its subtotal, and the sum for the quantity is rounded once, as the cart rounds a line. When the cart changes without a page load, such as an Add to cart from the related products, the line follows the new figures: every token in it, {remaining}, {total}, {goal}, {items} and {percent}, is brought up to date as the bar is.

The line does not promise free shipping where the sum could be wrong: not when a coupon is in the cart and discounts come off the total, because a percentage takes its share of whatever is added; not when your Free shipping method asks for A minimum order amount AND a coupon and no such coupon is in the cart, because the amount alone does not make shipping free there; not once free shipping is already unlocked; and not for a virtual product, which has nothing to ship. It says nothing at all about a product or variation that cannot be bought right now, out of stock or refused by another rule, where WooCommerce greys out its button; and it shows only beside a bar the shopper can see, so a bar kept to some screen sizes under Display takes its line with it. Grouped and external products, and variable products with more than 100 variations, show the bar alone, as before. Prices changed in the cart by another plugin, such as a bulk discount, are not known to the line.

Both sentences are under Bar → Wording, where the preview shows each one under an example bar. Empty either box and that line is not shown. Empty both and the product page shows the bar alone, as it did before the line existed, and the page no longer works out the product's price or reads its variations at all, so it costs nothing extra to draw.

Products that close the gap#

A shopper told they are 12.00 short has one question next: what can I add for 12.00? With Display → Cart Suggestions → Suggest products that unlock free shipping on, the cart page answers it. Under the bar, a few products are shown, each with its picture, name, price and an Add to cart button, and each costs at least what the cart still needs, so any one of them gets the cart to free shipping.

  • Suggest from — The categories of the products in the cart (the default), Categories I choose, where the categories under the ones you choose count too, or Products I choose, where a variable product offers its variations.
  • How many to show — up to 8, best sellers first. A variation counts its parent product's sales. Every product gets one place before any gets a second. From categories, that is all a product gets: a variable product is shown once, in the newest of its variations that fits. From products you choose, a variable product's other variations fill the places the rest leave.
  • Highest price (percent of amount left) — how dear a suggestion may be. At the default 200, a cart 15.00 short is offered products from 15.00 to 30.00. From 100 to 500.
  • Heading — leave it empty for Add one of these for free shipping, in your shoppers' language; what you write is shown as you wrote it, and on a WPML or Polylang shop it can be translated with the messages.

What is offered has to be true. A suggestion is priced as the cart counts it, with tax or without as your cart shows its subtotal, and in the shopper's currency with the switchers named above. It is a simple product, or a variation with every option set; never a variable product or a variation with an Any option, which would leave a choice to make. It is in stock, visible in the catalogue, not virtual, not already in the cart, and not in a shipping class left out of the total under Setup. From categories, a variable product with one of its variations in the cart is not offered in another size or colour; from products you choose, only the variation in the cart is left out. A variable product is tried in up to 24 of its variations in the price range, newest first, and in fewer when several best sellers each have dozens there.

No suggestions are shown once free shipping is unlocked, nor where the sum could be wrong: a coupon in the cart whose discount comes off the total (a percentage takes its share of whatever is added), or a Free shipping method that needs a coupon as well as the amount. These are the same rules as the product page's line.

On the classic cart, Add to cart is WooCommerce's own AJAX add to cart. The bar moves, and WooCommerce then reloads the cart form, suggestions and all, without a page load; the keyboard lands on the next suggestion or on the bar. With WooCommerce's Enable AJAX add to cart buttons on archives turned off (WooCommerce → Settings → Products), the button is a plain link instead: the cart page loads again with the product added, as WooCommerce's own buttons do then.

On the Cart block the button adds through the Store API, so the block shows the new item at once, without a page load. After any change to the cart a suggestion the cart has outgrown goes, and the whole section goes once shipping is free. The Cart block's suggestions are drawn once, with the page: a cart that drops back below the threshold there shows suggestions again only when the page is reloaded.

The suggestions appear on the cart page only: never on the checkout, in the mini cart or on product pages. They need On the cart page on, since they sit under it.

A new install has them on. A shop that had the plugin before them keeps its cart page as it was, and the Dashboard suggests them once, when On the cart page is on: Show suggestions turns them on, No thanks puts the suggestion away.

Suggestions are read from WooCommerce's product lookup table. A shop whose table was never filled, as some importers leave it, is offered nothing until it is: WooCommerce → Status → Tools → Product lookup tables → Regenerate.

Prices changed in the cart by another plugin, such as a bulk discount, are not known to the suggestions, as they are not to the product page's line.

The reminders follow the rest of your Display rules — the exclusions, the audience, the schedule and the screen sizes. Only Display on does not apply to them, because their own switches say where they go. The one exception is the classic Cart widget's dropdown once the cart has changed: WooCommerce redraws it as one piece for every page, so from then on it follows the audience, the schedule and the screen sizes, but not the page exclusions.

Ships free in the product lists#

A shopper choosing between two products on the shop page cannot see which of them brings free shipping on its own. With Display → Shop Pages → In product lists on, a product whose own price already reaches free shipping gets a small label under its price: Ships free, or your own words from Bar → Wording → Label in product lists.

Where it shows:

  • The classic shop page, product categories and tags, and search, and the other lists drawn with WooCommerce's product card: the related products under a product, the cross-sells on the cart page, a [products] shortcode. The label comes straight after the card's price, wherever your theme puts the price in the card: it follows WooCommerce's price template for the card (loop/price.php), which WooCommerce's own card uses, and which Astra uses in its summary under the product's title. A theme that prints the price in a card some other way shows no label there.
  • The same lists when your theme or a filter plugin loads more of them without reloading the page (a Load more button, infinite scroll, filtering by colour or size), through WordPress's admin-ajax.php or WooCommerce's own requests.
  • A block theme's Product Collection blocks, which the shop, category and search templates of Twenty Twenty-Five and other block themes are built from, the related products included. The label sits under the price block and lines up with it.
  • WooCommerce's older product grid blocks: Hand-picked Products, Products by Category, Products by Tag, Products by Attribute, On Sale Products, Best Selling Products, Top Rated Products and Newest Products. The label follows each product's price line.
  • Not the older All Products block, which draws its products in the browser, and not the price of the product a product page is about.

Which products get it:

  • The threshold is the bar's own: WooCommerce's amount, or the one you typed under Setup. A visitor whose country is only a guess is given the zone of your store's address, as the bar is on a cached page, and a shopper with a cart or an account is given their own zone.
  • The price is the one the cart counts, with tax or without as your cart shows its subtotal. So a 42.00 product on a shop that shows the cart with 20% tax (50.40) is labelled at a threshold of 50.00, and adding it alone makes the bar say free shipping is unlocked.
  • A variable product is labelled when its cheapest option that can be bought reaches the threshold. An option that is out of stock is passed over.
  • Never a virtual product, one in a shipping class left out of the total under Setup → Cart Total, one that cannot be bought or is out of stock, a grouped or an external product, or a product type added by another plugin. Nor a variable product with more than 100 options.
  • No product is labelled when your Free shipping method needs a coupon, alone or with a minimum amount, when shipping is free on every order (the bar says so already), when the shop cannot ship, or when a currency switcher other than WooCommerce Multilingual, FOX, CURCY or Aelia shows the shop in another currency, since the typed threshold and the prices could then be in two.

It follows your Display rules: the excluded pages and addresses, the audience, the schedule and the screen sizes. A list loaded without reloading the page is not a page of its own, so there only the audience, the schedule and the screen sizes apply, as they do when the bar refreshes with the cart. Display on and the reminders' switches do not apply to it. It needs the bar switched on under Setup.

The label is painted in the bar's "after the goal" colours (Bar → Colours and Typography → After the goal), so it reads as well as the bar's unlocked message does, and follows the alignment of the price above it. It is drawn by the server with a few lines of the bar's stylesheet and no script.

It never looks at the cart, only at the price and the threshold. A cached page shows the labels worked out for the visitor it was cached for, just as it shows the prices beside them. For guests that is usually the same answer for everyone, but not always: where your prices change with the visitor's country (prices shown with tax, and visitors geolocated), or where a shopper with a cart or an account was the one cached, the labels are theirs. A cached page also keeps its labels after a Display schedule ends, until the cache is emptied.

The threshold is worked out once per page, as the bar works out its own (on a page that shows the bar, that is the bar's own lookup). After that a simple product costs no extra database query, as the list has already loaded it, and neither does a variable product whose options all cost less than the threshold. Otherwise a variable product's cheapest option is loaded to check that it can be bought, once per page. Empty the wording, or switch the label off, and the lists are drawn exactly as they were before.

A new install has it on. A shop that had the plugin before keeps its product lists as they were, and the Dashboard suggests the label once while the bar is live: Show it turns it on, No thanks puts the suggestion away.

Still stuck? Ask the developers who wrote it. We aim to reply within one business day.