Cart

Lapels ships two cart surfaces, and one setting chooses between them. Both are built from the same parts: the same line, the same free shipping bar, the same gift-wrap offer, the same words. So a shopper who priced their cart in the drawer and then opened the page meets the same answer in the same shape.

Everything up to the Checkout button belongs to the theme. Everything after it belongs to Shopify: the checkout pages, the payment step and the order confirmation are not styled by Lapels and cannot be edited in the theme editor.

Drawer or page

Go to Online Store → Themes → Customize → Theme settings → Cart.

Setting	What it does	Default
Cart type	Drawer opens a slide-in panel when a shopper adds something. Page sends them to the full cart at /cart instead.	Drawer
Image ratio	The shape product images take in the cart drawer, on the cart page, and in cart recommendations. Tall (2:3), Portrait (3:4), Square (1:1), Landscape (4:3).	Portrait (3:4)

The image ratio is one field for all three surfaces on purpose. A shopper crosses the drawer, the cart page and the recommendations inside a single session, and three separate fields eventually drift.

The cart page exists at /cart whichever way Cart type is set. With Drawer chosen, the drawer’s own View cart button links to it, and so does any bookmark or direct link. Choosing Drawer adds a surface rather than removing one.

The drawer has settings of its own, and they are edited on the drawer, not here: in the theme editor’s sidebar, open Overlay. See Cart drawer for the whole group. The rest of this page is the cart page.

The cart page

Open the Cart template in the theme editor and select the Cart section.

Free shipping

Setting	What it does	Default
Show free shipping bar	Shows a progress bar toward free shipping at the head of the summary card. It is one of four switches, as explained below.	Off

The amount is not here. You set it once for the whole theme, under Theme settings → Cart → Free shipping starting from. Give it in the store’s currency, before tax and shipping. That way the cart page and the cart drawer can never quote a shopper two different figures. Each surface only decides whether the bar appears on it.

Caution

A fresh install shows no bar, and this switch alone will not bring it out. The cart template ships with this one turned on, but the theme-wide Enable free shipping is off and the threshold is 0. All four conditions have to hold: this switch, that switch, a threshold above zero, and something in the cart.

Set the amount and turn the master switch on under Cart and gift wrapping. Then set a matching free rate under Settings → Shipping and delivery, or the bar promises something checkout will charge for.

Shoppers buying in another currency see the amount converted at the current rate.

Controls

Setting	What it does	Default
Show shipping estimator	Adds an Estimate shipping panel to the summary card: country, region, postal code and an Estimate button. Rates come from the store’s own shipping zones.	On
Show order note	Adds an Add a note panel to the summary card. The note is saved on the cart and carried to the order.	On

Both unfold in place inside the summary card, directly above the subtotal they move, and only one is ever open at a time. Whatever a shopper is halfway through survives a quantity change, so they never lose their place. That covers a typed postal code, a fetched rate, or a half-written note.

The note saves itself a moment after the shopper stops typing, so there is no separate button to press. The panel’s own label reads Add a note until there is one, then Edit your note.

Announcement

A short rotating message across the head of the summary card. Use it for a returns window, a cut-off time, or anything worth saying to a shopper who is partway through. It carries no links by design, because a link out of the cart abandons the order.

Setting	What it does	Default
Show announcement	Draws the strip. It renders nothing at all when you have not written a message, so there is no empty band to tidy up.	On
Inherit color scheme	Stands the strip on the summary card’s own colors. Turn it off to give the strip a ground of its own, which makes it a band across the head of the card.	Off
Color scheme	The strip’s own scheme, when it is not inheriting.	scheme-night
Rotation speed	How long each message holds before the next rises. 3 to 12 seconds.	3s
Message 01	The sentence shown first. Keep it short, because the strip is one line.	Free returns within 30 days
Message 02	The second in the rotation. Clear it and the strip stops rotating.	Same-day shipping before 2pm
Message 03	The third. A blank field is skipped rather than shown empty.	Gift wrapping at checkout

Messages rotate from two upwards. With one message it simply sits there. For a visitor whose system asks for reduced motion, every message sits on the strip together rather than cycling.

Section spacing

Setting	What it does	Default
Device	Which set of values the two sliders below are editing: Desktop or Mobile. Both sets are saved.	Desktop
Top / Bottom	Space above and below the section, 0 to 200px in steps of 4.	96 / 96 desktop, 56 / 56 mobile

The Cart section also takes a Color scheme (default scheme-paper) and no blocks. To add anything else to the cart page, add another section above or below it on the cart template.

Line items and quantity

Each line carries the product image, the product name as a link, its variant options, and a subscription plan name when the line has one. Any line item property an app or a form has attached is listed under it, and a property holding an uploaded file is drawn as a link to that file.

Prices are said twice, because they answer two different questions. The price of one sits with the product details. The line total takes the far end of the row, in the same column as every other figure on the page. On a reduced line the two disagree, which is the point.

A per-unit measured price, in the $4.50/100 g shape, appears when the variant carries one. Any discount allocated to the line is listed under it by name.

Quantity is a stepper with a typed field between the two buttons. Setting a quantity to zero removes the line, and there is a remove control on every line as well. When a variant tracks inventory and is set to stop selling at zero, the field is capped at what is in stock. A shopper who asks for more is told why in a message under that line, rather than having the number quietly changed on them.

A quantity change commits the moment it happens. There is no Update cart button to remember.

Gift wrapping

Gift wrapping is one checkbox under the cart lines, reading “For $8.00, please wrap the products in this order”. Tick it and the wrapping joins the cart as a line of its own, at which point the offer disappears. Everything it could still say, the line now says better, including how to take it back out.

Set it up under Theme settings → Gift wrapping:

Setting	What it does	Default
Gift wrap product	The product added when a shopper accepts the offer. Leave it empty to hide the offer entirely.	None

Create that product priced as you want to charge, published to the Online Store, with inventory tracking off. Zero is a fine price, and the wording then changes to “Please wrap the products in this order”.

This setting lives in theme settings rather than on either cart, because it reaches further than the cart. Lapels keeps the wrapping product out of collection grids, search results, recommendations and every product shelf, so nobody browses it as an ordinary piece.

The offer is withheld wherever it could not be taken up. That means no product chosen, an empty cart, the wrapping already in the cart, or the product sold out or unpublished.

Note

The cart page shows the offer whenever a gift wrap product is set. The cart drawer has its own Offer gift wrapping switch, so you can run the offer on one surface and not the other.

The summary and checkout

The summary card, in reading order: the announcement, the word Summary, the free shipping bar, the estimator and note panels, any cart-level discount as a named line, the Estimated total, and a footnote about tax. On a tax-inclusive store that footnote says so, and names only shipping as outstanding.

Under it sits Checkout, and under that every accelerated wallet the store has switched on, such as Shop Pay and PayPal, stacked to the card’s width. They appear only when the wallet is set up and available for the store, the cart and the shopper’s region. If you cannot see them, check Settings → Payments in your admin.

From there, checkout is Shopify’s. Its appearance is configured in your admin under Settings → Checkout, not in the theme editor, and nothing Lapels does reaches it.

Note

Prices can carry their currency code, which is worth turning on for a multi-currency store. Theme settings → Currency format has two switches: Show currency codes for prices everywhere, and Show the currency code on the cart total for the estimated total alone. See Currency.

Recommendations

Cart recommendations are a drawer feature. The shelf of suggestions at the end of the cart drawer is fetched separately and controlled entirely on the drawer, under Overlay. That covers whether it shows at all, its heading, its source, and how many products to show. The source is Related products, which Shopify builds from what shoppers buy together, or Complementary products, which you pick yourself in the Search & Discovery app. There is nothing to place and nothing to configure on the cart template for it. See Cart drawer.

The cart page instead ships a Recently viewed section below the cart, which can draw on what the shopper has looked at, on Shopify’s recommendations, or on both in turn. Remove it, move it, or swap it for another section like any other.

The empty cart

An empty cart says so, with a Shop the collection button to all products. When customer accounts are on and the visitor is not signed in, a text link invites them to sign in and pick up anything they left behind.

Related: Cart drawer · Cart settings · Product pages · Currency · Lapels support replies within 12 hours.