Free shipping progress bar

What you’ll build: a progress bar that reads “You’re $12.00 away from free shipping”, fills up as the cart grows, and a shipping discount that makes standard shipping free at $75.

Requirements: Shopify Plus for the progress bar. The shipping discount needs More Functions or Business. The Progress bar (cart totals) block is available on the Free plan, but the Free plan allows only one customization in total. On More Functions you can only create a block while you have no other customizations, so create the progress bar first, or use Business.

1. Create the progress bar. Click Create customization and choose Progress bar (cart totals).

   • Target: 75.

   • Target type: Use cart subtotal for target calculations.

   • Text (when in progress):

     You're {{ toMoney(75 - orderSubtotal, currencyCode) }} away from free shipping

   • Text (when complete): You've unlocked free shipping!

   • Save, and note the block’s ID.

2. Place it. In the Checkout Editor, add a Checkout Buddy app block where you want the bar (above the order summary or the shipping methods work well) and enter the ID in Fixed block ID. See add a block to checkout.

3. Create the discount. Click Create customization and choose Shipping discount.

   • Apply discount to specific shipping option (inclusive match) with Shipping option title Standard, or Apply discount to all shipping options.
   • Discount type: Percentage. Discount value: 100. Discount message: Free shipping.
   • Display rules: Apply only when rules pass, Rule Set 1, Cart subtotal is more than 74.99.
   • Save.

4. Test it with carts just under and over $75.

Selling in more than one currency?

The progress bar compares the target with the cart in the customer’s currency, without converting. A €60 cart shows as 80% of a “75” target, even though 75 is in your store currency. The shipping discount’s rule, on the other hand, is converted. For multi-currency stores, create one progress bar per market with a target in that market’s currency, using each block’s Markets card, and list the IDs in the same app block’s Fixed block ID.

Variations

• Different text for different amounts: the text is dynamic, so you can write {{ orderSubtotal < 40 ? 'Keep going!' : 'So close!' }}.
• Weight-based: use Progress bar (cart weight) with a Total cart weight (kg) rule on the shipping discount.
• Hide the bar once complete: add the display rule Cart subtotal is less than 75 to the progress bar, and it disappears once the customer qualifies.

Troubleshooting

• The bar doesn’t show at all: check the variable names are spelled exactly orderSubtotal and currencyCode. A misspelled name stops the block from showing.
• Shipping isn’t free at $75: subtotal is after product discounts. Also check that a shipping rate called “Standard” exists for the customer’s address.
• See progress bars for all settings.