Cart settings
Theme settings > Cart decides what happens when a shopper adds a product: the cart drawer slides in, or the shopper goes to the cart page. It also sets the cart icon and the free shipping progress bar.
How to set it up
Step 1: Choose the cart type
- Go to Theme settings > Cart.
- Choose a Cart type: Slide-Out drawer or Cart page.
- Pick the Cart icon (Cart, Bag, Basket or Tote) and the Cart badge: a dot or the item count.
Step 2: Set up the free shipping bar
- Under Free shipping bar, turn it on for the cart page and the cart drawer (1).
- Enter the Free shipping minimum amount in your store's main currency, without the currency code, for example
150. - Write the Progress message with
{amount}for the amount left, for exampleSpend {amount} more for free shipping, and the Success message. - Set the bar color, or a gradient.
Match your shipping rate
The bar only shows progress. Create the free shipping rate itself in Settings > Shipping and delivery with the same minimum amount.
Settings reference
Cart
| Cart type | Options: Slide-Out drawer, Cart page. |
|---|---|
| Cart icon | Options: Cart, Bag, Basket, Tote. |
| Cart badge | Options: Dot, Counter. |
| Free shipping bar | |
| Enable on cart page | Turns this on or off. |
| Enable on cart drawer | Turns this on or off. |
| Text style | Options: Body, Caption, Subheading. |
| Free shipping minimum amount | Enter the amount in your store's main currency, without the currency code. To set different prices for each market, use the [Translate & Adapt app](https://apps.shopify.com/translate-and-adapt). |
| Progress message | Use {amount} to show the amount remaining. |
| Success message | |
| Progress bar color | |
| Progress bar gradient | Optional. Overrides the progress bar color when set. |
How it works
- The amount converts to the shopper's currency when you sell in several currencies.
- The Free shipping bar block on the product page and in Quick view uses the same settings.