# Cart, gift wrap and gift note

Chapter 12 of the Littles user guide.

The cart is the **bag** everywhere in Littles. Adding to the bag opens the **cart drawer**, "Your bag (3)", which floats in from the side of the screen, and the bag count in the header updates. A size chip on a card adds that size straight away ("3–6 m added to your bag."). The drawer and the cart page show the same things:

* The **free-shipping bar** ("$18.00 away from free shipping", then "Free shipping unlocked", with a little star riding the track) when **Theme settings › Commerce › Free shipping over** is above 0 and the shopper is shopping in your store's currency.
* Each line with its photo on a small pastel tile, its options ("Oat · 6–12 m"), any subscription plan and line properties (such as "Pre-order"), a quantity stepper, **Remove** and the line price.
* The **gift wrap** switch and the **gift note** in a box of their own (below).
* Order discounts, the subtotal, "Tax and shipping calculated at checkout." (or "Tax included. Shipping calculated at checkout."), the **Check out** button, accelerated checkout buttons, and **View bag** in the drawer.
* Empty: a cloud, "Your bag is empty" and "Little things fit nicely in here." with a button back to the shop.

| Section | Settings |
| --- | --- |
| Cart drawer | **Show order note in the cart drawer** (on), **Empty bag button label** ("Shop new arrivals") and **Empty bag button link** (blank opens all products) |
| Cart (the cart page) | **Show order note on the cart page** (on) |

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

## Gift wrap

Shoppers can switch gift wrap on for the whole order with one switch: a small picture of your wrap, your label and line ("Gift wrap my order", "Tissue, ribbon and a card."), the price ("+$5.00", or "Free" when the wrap costs nothing) and the switch. On adds one of your gift wrap product to the bag; off takes it out. The wrap line isn't listed with the other lines (the switch row stands for it), and it always stays at quantity 1. The switch works without JavaScript too.

To set it up:

1. In admin, create a product such as "Gift wrap", with **one variant**, priced for wrapping, and available on your **Online Store** sales channel. For complimentary wrapping, as the Playroom preset's words promise ("Always free"), price it at 0: the switch then reads "Free". Give it an image for the switch row. If you don't track its inventory, it never sells out. Keep it out of the collections you show, so nobody adds it from a product grid.
2. In the theme editor, open **Theme settings › Gifting** and choose it as **Gift wrap product**. Set **Gift wrap label** ("Gift wrap my order") and **Gift wrap text** ("Tissue, ribbon and a card."): say what you actually do.

The presets don't include a gift wrap product (products aren't part of a theme), so the switch stays hidden until you choose one. It shows only while the wrap product can be bought, or is already in the bag. In the order, the wrap is an ordinary line, so you see at a glance which orders to wrap.

## The gift note

The bag's note field is Shopify's **order note**, relabelled for gifting in **Theme settings › Gifting**: **Note label** ("Add a gift note"), **Note placeholder** ("Write a message for the card. We'll handwrite it.") and **Note length limit** (200, 100 to 500 characters), with a live count ("38 / 200"). It shows in the drawer and on the cart page while **Show order note…** is on in those sections, and arrives as the order's **Notes** in admin. There is one note per order. If you also need delivery instructions, change the label to something broader, such as "Gift note or delivery instructions".
