The cart

The cart is a drawer, not a page. It sits over whatever page the shopper is on, and it is shared by the whole site — the panel says exactly that: "Site-wide — shown on every page."

That is the most important difference from everything else you build: you design the cart once, not once per page.

Editing it

Open the Store panel on the rail, find Cart, and press Edit cart.

The drawer opens on the canvas and you edit it like any piece of page: drag elements in, style them, set the spacing. While you do, the editor shows Editing the cart drawer so you do not lose track of where you are.

If you see "Could not open the cart drawer.", that is a loading failure rather than a damaged cart — close it and try again.

It is not in the page document

This is a technical detail, but it explains several things you will notice:

The cart is composed onto a page when it is read and stripped back out when it is written. A page's stored document holds no trace of it — not even a reference node, unlike a global section.

What you can observe from that:

• The cart does not appear in a page's Layer tree as an ordinary section, and it does not count towards the top/bottom band rules that govern headers and footers.
• Editing the cart on one page edits it on every page. There is no per-page version.
• Deleting a page does nothing to the cart.

The cart item

Inside the drawer is a Cart item — the template for one line. You design one line, and the storefront repeats it for each thing the shopper added.

So everything you put in it — image, name, price, remove button — appears on every line. Do not try to build three lines to hold three items.

Cart actions

Any button or element can carry an On click action. The cart-related ones:

Action	vi	What it does
Add to cart	Thêm vào giỏ	Adds the product being viewed
Open cart	Mở giỏ hàng	Slides the drawer out
Close cart	Đóng giỏ hàng	Closes it
Go to checkout	Đến thanh toán	Moves to the checkout page
Remove cart line	Xoá dòng giỏ hàng	Drops the line this button sits in
Increase quantity	Tăng số lượng	+1 on the line this button sits in
Decrease quantity	Giảm số lượng	−1 on the line this button sits in

The last three only make sense on a button inside the Cart item — they act on the line surrounding them.

Checkout

Go to checkout leads to your site's page of type Checkout. After an order is placed, the shopper reaches the page of type Order complete.

Both are template pages: you build them once and the storefront uses them for every order. If the site has no Checkout page, those addresses have nothing to render — which is exactly what the page-delete dialog warns about.

Trying it

The cart only behaves for real on a published page or in Preview — on the canvas you see its shape, while adding items and totalling them runs on the storefront. Use Preview to walk the whole flow without publishing.