Giỏ hàng

Giỏ hàng là một ngăn trượt (drawer) chứ không phải một trang. Nó nằm chồng lên trang hiện tại, và nó dùng chung cho cả site — panel nói đúng câu đó: "Dùng chung — hiện trên mọi trang."

Đây là điểm khác biệt quan trọng nhất so với mọi thứ khác bạn dựng: bạn thiết kế giỏ hàng một lần, không phải một lần trên mỗi trang.

Sửa giỏ hàng

Mở panel Cửa hàng (en: Store) trên thanh công cụ, tìm mục Giỏ hàng, bấm Sửa giỏ hàng (en: Edit cart).

Ngăn giỏ hàng mở ra trên canvas và bạn sửa nó như một phần trang bình thường: kéo phần tử vào, chỉnh kiểu dáng, đặt khoảng cách. Trong lúc đó, trình chỉnh sửa hiện Đang sửa ngăn giỏ hàng để bạn không quên mình đang đứng ở đâu.

Nếu bạn thấy "Không mở được ngăn giỏ hàng.", đó là lỗi tải chứ không phải giỏ hàng bị hỏng — đóng và thử lại.

Nó không nằm trong tài liệu của trang

Đây là chi tiết kỹ thuật, nhưng nó giải thích vài điều bạn sẽ gặp:

Giỏ hàng được ghép vào trang lúc đọc và tách ra lúc ghi. Tài liệu của một trang không lưu dấu vết nào của nó — thậm chí không có cả một node tham chiếu, khác với phần dùng chung.

Hệ quả bạn nhìn thấy được:

• Giỏ hàng không xuất hiện trong cây Lớp của một trang như một phần bình thường, và nó không tính vào các quy tắc "trên cùng / dưới cùng" của header và footer.
• Sửa giỏ hàng ở một trang là sửa nó ở mọi trang. Không có bản riêng cho từng trang.
• Xoá một trang không đụng gì tới giỏ hàng.

Dòng giỏ hàng

Bên trong ngăn có Dòng giỏ hàng (en: Cart item) — mẫu cho một dòng hàng. Bạn thiết kế một dòng, và cửa hàng lặp lại nó cho từng món khách đã thêm.

Nghĩa là mọi thứ bạn đặt vào đó — ảnh, tên, giá, nút xoá — sẽ xuất hiện ở mỗi dòng. Đừng cố dựng ba dòng để có ba món.

Các hành động liên quan tới giỏ hàng

Bất kỳ nút hay phần tử nào cũng gắn được một hành động Khi nhấp (en: On click). Những hành động liên quan tới giỏ hàng:

Hành động	en	Làm gì
Thêm vào giỏ	Add to cart	Thêm sản phẩm đang xem vào giỏ
Mở giỏ hàng	Open cart	Trượt ngăn giỏ hàng ra
Đóng giỏ hàng	Close cart	Đóng lại
Đến thanh toán	Go to checkout	Chuyển sang trang thanh toán
Xoá dòng giỏ hàng	Remove cart line	Bỏ dòng hàng chứa nút này
Tăng số lượng	Increase quantity	+1 cho dòng chứa nút này
Giảm số lượng	Decrease quantity	−1 cho dòng chứa nút này

Ba hành động cuối chỉ có nghĩa khi nút nằm bên trong Dòng giỏ hàng — chúng tác động lên dòng bao quanh chúng.

Trang thanh toán

Đến thanh toán dẫn sang trang có loại Thanh toán (en: Checkout) của site bạn. Sau khi đặt hàng xong, khách tới trang loại Hoàn tất đơn hàng (en: Order complete).

Cả hai đều là trang mẫu: bạn dựng một lần, cửa hàng dùng cho mọi đơn. Nếu site không có trang Thanh toán, các địa chỉ tương ứng không hiển thị được gì — đó chính là cảnh báo trong hộp thoại xoá trang.

Xem thử

Giỏ hàng chỉ có hành vi thật trên trang đã xuất bản hoặc trong Xem trước — trên canvas bạn thấy hình dáng của nó, còn việc thêm hàng và cộng tiền chạy trên storefront. Dùng Xem trước (en: Preview) để thử cả luồng mà không cần xuất bản.