# Cart

Chapter 12 of the Tress user guide.

Tress calls the cart the **bag**. Adding to it opens the **bag drawer**, which glides in from the side of the screen, and the bag's count bubble in the header updates. The drawer and the cart page show the same things:

* **Each line** with its photo in a small capsule, name, options ("18 in · Body wave"), line item properties (such as **Nail sizes** or **Pre-order**) and subscription plan, a quantity stepper, **Remove** and the line price, with any discount on the line under it.
* **Install groups**: the pieces of an install added with Build your install (chapter 9) sit together in one card, wherever they are in the bag. Its head is the gloss **Install** badge and the install's label ("Body wave · 18/20/22 + 4×4 closure"); then each piece, whose stepper and Remove keep working on their own; then a foot with the **Install total**, **Remove install** (removes every piece at once) and **Edit install**, which goes to **Theme settings › Hair, lashes and nails › Build your install page** and is hidden while that's empty. If the shopper changes a quantity or removes a piece, the rest stay grouped and the head adds "Changed since you built it".
* **The install deal line**: when one install in the bag has enough bundles (and a closure or frontal, if the deal needs one), the section's **Install deal line** shows above the subtotal in an accent pill with a check.
* **The free-shipping progress** line and bar ("Add $12.00 for free shipping.", then "You've got free shipping.") only when **Theme settings › Commerce › Free dispatch over** is above 0 and the shopper is shopping in your store's currency.
* **Order discounts**, the subtotal, the tax note ("Tax included. Shipping calculated at checkout."), the **Check out** button and accelerated checkout buttons.
* **The bag note** under them, with a bonnet icon ("Free silk bonnet with every install", from **Theme settings › Commerce › Bag note**).
* **The order note** (collapsible in the drawer), which arrives as the order's **Notes** in admin: "Delivery instructions, PO number, anything we should know."
* **Empty**: "Your bag is empty", "Start with your texture." and a **Shop by texture** button.

| Section | Settings |
| --- | --- |
| Cart drawer | **Show order note in the cart drawer** (on), **Install deal line** ("3 bundles and a closure: 15% off at checkout"), **Bundles for the deal** (3, 0 to 6; 0 hides the deal line), **Deal needs a closure or frontal** (on) and **Empty bag link** (the button under "Your bag is empty"; it defaults to the collections list) |
| Cart (the cart page) | **Show order note on the cart page** (on), and the same **Install deal line**, **Bundles for the deal**, **Deal needs a closure or frontal** and **Empty bag link** |

Match the deal settings to the Build your install section, and remember they are words only: the discount comes from the automatic discount you create in Shopify admin (chapter 7). An install counts its bundles as the pieces of the product it holds most of, and its closure as any second product.

Quantity changes and removals update the bag in place, and B2B quantity rules are checked as shoppers change quantities. Apps that change the cart are picked up too, and screen readers hear "Added to your bag." and "Bag updated."