GemNews

Tất cả bài · Bài viết

Trang sản phẩm hay giỏ hàng: đưa sản phẩm thứ hai vào đâu?

Glossier, Bloom và Transparent Labs mỗi bên lại đặt món thứ hai ở một vị trí khác nhau trước khi checkout. Khoảng cách từ nút thêm vào giỏ hàng đến đó sẽ quyết định bạn đang đề nghị khách làm gì.

Tác giả Janie Nguyen · · 8 phút đọc

Chia sẻ: WhatsApp · Telegram · X · Facebook · LinkedIn · Email

Khách đã chốt xong. Họ chọn xong tông màu, chọn hộp 30 viên, và ngón tay đang chực sẵn gần nút thêm vào giỏ. Món đồ thứ hai — món đi kèm với món đầu tiên — phải xuất hiện đúng lúc. Trước bước checkout, nó chỉ có hai chỗ để xuất hiện: ngay trên trang họ đang đọc, hoặc trong giỏ hàng hiện ra sau một cú chạm. Đặt nó ở đâu sẽ quyết định câu hỏi bạn đặt ra cho khách lúc đó. Ba cửa hàng dưới đây giải bài toán này theo ba cách hoàn toàn khác nhau.

Trang sản phẩm: nơi ưu đãi luôn nằm dưới nút mua

Không ai trong số ba bên này đặt món thứ hai lên trên nút thêm vào giỏ. Chỉ có khoảng cách là khác nhau: chưa tới nửa màn hình ở Bloom, khoảng hai phần ba màn hình ở Glossier, và tận năm màn hình rưỡi ở Transparent Labs.

Trang Futuredew của Glossier dài tới 12 màn hình, với nút chính Add to bag $30 nằm ở màn hình thứ 2. Tiếp theo là bốn khối gợi ý sản phẩm thứ hai: ADD ON và SAVE WITH SETS ở màn hình thứ 3, BUILD YOUR LOOK trải dài qua màn hình 5 và 6, rồi YOU MIGHT ALSO LIKE ở màn hình 8. Hai khối đầu tiên là các dòng thu gọn, bấm vào dấu cộng mới mở ra: Invisible Shield SPF50 và Balm Dotcom đều hiển thị hình ảnh, tên và dấu +, không có giá, không có nút thêm. Bấm vào dấu cộng ở Invisible Shield SPF50, dòng đó sẽ mở rộng ra thành Add to bag $32 và See full page.

Trang bột rau xanh của Bloom đặt phần ưu đãi trong một cặp tab, nằm chưa tới nửa màn hình ngay dưới nút bấm. Nút bấm này sẽ trượt theo mép dưới màn hình khi bạn cuộn, cho đến khi nằm cố định trên trang ngay phía trên các tab. Tab Pair It With mở mặc định; tab Bundle & Save 25% thì bấm vào mới hiện nội dung. Tab đang mở chứa một sản phẩm đi kèm có sẵn nút Add to Cart riêng.

Transparent Labs là bên duy nhất giải thích rõ sản phẩm thứ two dùng để làm gì. Khối của họ có tiêu đề Complete Your Stack kèm lời dẫn: Pair Bulk Pre-Workout with these products for a complete foundational stack. Bên dưới là bốn thẻ sản phẩm, thẻ nào cũng có một dòng mô tả công dụng. Tuy nhiên, không thẻ nào có giá hay mức giảm, không có nút thêm vào giỏ, và cả bốn nút đều ghi Shop Now trỏ thẳng sang trang riêng của sản phẩm đó. Tiêu đề này nằm ở màn hình 8/18, cách nút Add To Cart chính tận năm màn hình rưỡi. Xuống sâu đến thế thì thanh mua hàng cố định (sticky buy bar) đã trượt theo người dùng và che mất một nửa tiêu đề bên dưới.

Vậy là chỉ có một bên chịu giải thích công dụng của sản phẩm thứ hai, nhưng lại là bên bạn không thể bấm mua trực tiếp. Các bên còn lại chỉ đưa một cụm từ lên tiêu đề: chỉ ra kết quả (BUILD YOUR LOOK), chỉ ra đồ đi kèm (Pair It With) hoặc chỉ ra mức tiết kiệm (Bundle & Save 25%). Không bên nào viết nổi một câu tử tế giải thích tại sao món này lại đi hợp với món kia. Đó là những gì tôi thấy trực quan trên màn hình; còn các dòng đang đóng hay các slide chưa vuốt tới thì có thể có thêm thông tin, nhưng tôi chưa mở ra xem.

Lý do để dùng kiểu gợi ý trên trang sản phẩm thực ra hẹp hơn bạn nghĩ. Nó chỉ hợp với đúng một kiểu ưu đãi: món đồ mà khách bắt buộc phải dùng kèm với món họ vừa chọn, đúng theo cách bạn tư vấn bán. Trong bài viết tháng 7/2026 của chúng tôi về 7 khối cần có trên trang sản phẩm, điểm này đã được chỉ rõ ở khối thứ 7: sản phẩm thứ hai nên là mảnh ghép hoàn thiện quy trình mà chính phần hướng dẫn của bạn đã mô tả.

Giỏ hàng: nơi khách nhìn thấy tổng đơn lần đầu tiên

Chạm một cái trên mỗi cửa hàng, một ngăn kéo giỏ hàng (cart drawer) sẽ trượt ra đè lên trang. Nhưng ba cái giỏ này chẳng cái nào giống cái nào.

Glossier tính toán tiền nom rất trực quan trước mắt khách: You’re $10 away from free shipping, nằm ngay trên một thanh tiến trình có hai mốc: Free shipping và + Free gift. Trên trang sản phẩm trước đó có ghi Free standard shipping on orders $40+; món đồ trong giỏ giá $30; giỏ hàng tự trừ và in ra khoảng còn thiếu, con số $10 này sẽ thay đổi tùy theo giỏ hàng. Bên dưới sản phẩm là mục BUNDLE + SAVE: Save on Cloud Paint, $13 so với giá gốc $16, kèm dòng You save 20% by bundling with items in your bag.

Giỏ hàng của Bloom hiện sản phẩm bạn vừa thêm cùng một hộc trượt bốn thẻ với tiêu đề Psst…We Think You'd Love These Too!. Mỗi thẻ có nút Add To Cart riêng, nhưng chỉ có thẻ đầu tiên nằm gọn trên màn hình — và nó lại chính là hũ bột rau xanh đã có sẵn trong giỏ. Giỏ hàng của Transparent Labs thì hiện sản phẩm kèm một thanh Free Shipping màu xanh báo rằng gói đăng ký định kỳ (subscription) đã được miễn phí vận chuyển. Hôm tôi mở ra, cả hai giỏ này đều không có thanh đếm ngược mốc freeship, không có dòng quà tặng hay ô nhập mã giảm giá, và mã FREESHIP từ trang sản phẩm của Bloom cũng biến mất. Nhưng đừng vội coi đó là điểm trừ: giỏ của Glossier chứa đơn mua một lần, trong khi giỏ của Transparent Labs và Bloom đều chứa đơn đăng ký định kỳ vốn đã freeship sẵn, nên chẳng còn mốc nào để mà đếm ngược. Tôi chỉ xem mỗi giỏ đúng một lần với một sản phẩm, nên không thể khẳng định đây là thiết kế cố định của họ hay chỉ là trường hợp ngẫu nhiên do giỏ hàng lúc đó.

Một phần lý do giỏ hàng trông trống trải là do thiết lập mặc định của giao diện (theme). Trang trợ giúp của Shopify có ghi: mặc định trên trình chỉnh sửa giao diện, trang sản phẩm sẽ có mục Thông tin sản phẩm và mục Sản phẩm liên quan, còn trang giỏ hàng mặc định chỉ có mục Danh sách sản phẩm và mục Tổng tiền. Đó chỉ là cài đặt mặc định chứ không phải giới hạn: bài viết đó cũng nói rõ các thiết lập tùy thuộc vào lập trình viên và phiên bản theme bạn dùng, và nó còn chẳng nhắc gì đến cart drawer — thứ mà cả ba cửa hàng này đều đang xài.

Vẫn còn một vị trí thứ ba nữa: trang xác nhận sau khi đặt hàng (thank-you page), nhưng bài này sẽ không bàn tới.

Quyết định nằm ở đâu

Quy tắc: hoàn thiện sản phẩm trên trang, hoàn thiện đơn hàng trong giỏ

Lời đề nghị phải nằm ở nơi mà khách có đủ thông tin để đưa ra quyết định. Trên trang sản phẩm, tâm trí họ vẫn đang xoay quanh sản phẩm, nên món thứ hai phù hợp phải là món giúp hoàn thiện nó: đúng một món, gọi đúng tên công dụng đi kèm, có sẵn giá và nút thêm ngay trước mắt. Vào đến giỏ hàng, họ mới bắt đầu nhìn vào tổng thể đơn hàng, nên cái phù hợp lúc này phải là cái giúp hoàn thiện giá trị đơn: khoảng cách để được freeship, quà tặng theo mốc tiền, mức giảm khi mua thêm đơn vị thứ hai. Bài viết về checkout tháng 7/2026 của chúng tôi đã đề xuất thanh mốc freeship; giỏ hàng chính là nơi phát huy tác dụng nhất của nó, vì mốc freeship là thông tin gắn liền với tổng đơn, và giỏ hàng là màn hình đầu tiên hiển thị điều đó. Ba cửa hàng chưa thể chứng minh cho tất cả, nhưng đây là đánh giá của tôi từ thực tế quan sát, và tôi tin góc nhìn này chuẩn.

Nhìn vào đây, bạn sẽ có cái để kiểm tra lại các khối hiện có trên trang của mình. Một lời đề nghị không có giá, không có nút mua, hoặc tiêu đề chỉ chăm chăm nói đến số tiền tiết kiệm sẽ bắt khách phải tự đi tìm hiểu thêm trước khi gật đầu mua.

Việc cần làm ngay hôm nay

Mở website của bạn trên điện thoại, đừng dùng laptop. Thêm sản phẩm bán chạy nhất vào giỏ và đọc kỹ những gì được gợi ý theo đúng thứ tự xuất hiện. Ghi lại ba điều: khối sản phẩm mua kèm đầu tiên nằm cách nút mua chính bao xa; tiêu đề của nó nói về công dụng hoàn thiện sản phẩm hay chỉ chăm chăm nói đến giảm giá; mức giá và nút thêm có hiện sẵn mà không cần chạm thêm thao tác nào không.

Sau đó hãy kiểm tra giỏ hàng. Nếu trên trang sản phẩm có ghi mốc freeship, xem giỏ hàng có quy đổi con số đó thành khoảng cách giá trị đơn hàng thực tế hay không (kiểu như dòng $18 away from free shipping trong bài viết về checkout của chúng tôi). Nếu giỏ hàng chỉ hiện mỗi sản phẩm, tạm tính và nút checkout, thì đó mới chỉ là giao diện mặc định. Việc theme của bạn có tự thêm được dòng đếm ngược đó mà không cần cài app hay đụng vào code hay không — hãy mang câu hỏi này đi hỏi người làm web cho bạn.

Sources:

Storefronts, all opened at phone size on 17 August 2026

Bàn luận trên GemCommunity