1. Theme preview là gì?

Trước khi chọn một theme, bạn có thể mở Preview theme. SenPrints đã dựng sẵn một storefront mẫu với đầy đủ các khối nội dung để bạn nhìn được màu sắc, cách chia phần, kiểu ảnh và cảm giác chung của theme, theme preview được xây dựng với mục địch cho Seller có thể xem trước theme để nắm được phong cách thiết kế và đưa ra lựa chọn đúng nhất và phù hợp với loại sản phẩm mà store đang bán.

Bản xem thử dùng để hình dung  SenPrints sắp xếp các block widget theo một cách cân đối và đẹp để cho thấy theme có thể trông như thế nào khi được dùng đầy đủ. Bạn có thể lấy đó làm cảm hứng, giữ lại một phần hoặc làm theo ý tưởng hoàn toàn khác.

1.1 Bản xem thử giúp bạn nhìn thấy

• Phong cách chung: sáng hay tối, nhẹ nhàng hay nổi bật, nhiều ảnh hay nhiều sản phẩm.
• Các kiểu khối nội dung mà theme có thể hiển thị, ví dụ banner, collection, campaign, thư viện ảnh hoặc câu chuyện thương hiệu.
• Cách các phần nối tiếp nhau khi xem trên một trang hoàn chỉnh.
• Cách theme xử lý chữ, nút bấm, ảnh và khoảng trống giữa các phần.
• Cách sắp xếp các thành phần layout để thể hiện câu chuyện thương hiệu muốn thể hiện và cách điều flow tiếp nhận thông tin của người mua hàng.

1.2 Bản xem thử không bắt bạn phải

• Dùng đủ tất cả widget đang xuất hiện trong preview.
• Đặt widget đúng vị trí hoặc đúng thứ tự giống storefront mẫu.
• Dùng cùng tên, cùng hình ảnh, cùng collection hoặc cùng campaign.
• Thêm đúng một con số ảnh, collection, campaign hay media nào đó.

Ví dụ một khối collection trong theme preview. Seller có thể dùng ít hơn, nhiều hơn hoặc không dùng khối này.

2. Đi từ ý tưởng đến storefront

Cách để đúng nhất là đi qua từng bước để xây dựng được một store phù hợp và thu hút thêm khách hàng.

1	Xem thử nhiều theme Senprints hỗ trợ nhiều theme cho storefront, mỗi theme sẽ đi theo một chủ đề và phong cách thiết kế khác nhau, phù hợp với nhiều loại sản phẩm. Seller nên preview theme để chọn được giao diện ưng ý nhất

2	Chọn theme Chọn dựa trên cảm giác và cách trình bày bạn muốn, không dựa trên việc preview có đúng sản phẩm của mình hay không.

3	Xác định điều muốn khách thấy trước Có thể là bộ sưu tập mới, quà tặng theo dịp, ưu đãi, ảnh khách hàng hoặc câu chuyện thương hiệu.

4	Chọn widget phù hợp Widget là một khối nội dung, chọn các khối phù hợp với ý tưởng mà bạn muốn thể hiện.

5	Chọn vị trí (Position) Đặt mỗi widget ở bất cứ Position nào theme đang cho phép và phù hợp với thứ tự bạn muốn khách xem.

6	Thêm nội dung theo nhu cầu Tải ảnh, chọn collection/campaign và thêm bao nhiêu mục tùy ý tưởng của bạn. Không cần khớp số lượng trong preview.Tuỳ chỉnh khoảng cách giữa widget.

7	Xem lại và áp dụng Mở preview storefront trên máy tính và điện thoại. Áp dụng thiết kế sau khi hoàn thành config.

3. Widget là gì?

Widget có thể hiểu đơn giản là một khối nội dung trên storefront. Mỗi khối làm một việc riêng: giới thiệu, dẫn khách đến sản phẩm, kể câu chuyện hoặc tạo điểm nhấn bằng hình ảnh.

Theme: Bộ giao diện quyết định phong cách chung và những cách sắp xếp mà store có thể sử dụng.

Preview: Bản xem thử giúp bạn hình dung theme trước khi chọn.

Widget: Một khối nội dung, ví dụ banner, danh sách collection, gallery ảnh hoặc phần ưu đãi.

Position: Vị trí đặt khối trên trang. Bạn có thể chọn bất cứ vị trí nào đang có trong theme.

Active / Inactive: Active là đang hiển thị; Inactive là tạm ẩn nhưng vẫn giữ nội dung để dùng lại.

Tên có thể khác  Mỗi theme có thể dùng tên widget khác nhau nhưng vẫn sẽ có chung một công dụng. Hãy nhìn công dụng của khối thay vì cố tìm một cái tên giống hệt store mẫu.

4. Bốn điều seller được tự quyết định

1. Chọn khối mình cần Không cần dùng hết widget có trong bản xem thử. Khối nào giúp truyền tải ý tưởng thì dùng; khối nào chưa cần thì bỏ qua.	2. Chọn vị trí mình thích Có thể đặt widget ở bất cứ Position nào mà theme đang cho chọn. Hãy đặt ở nơi hợp với câu chuyện bạn muốn kể.
3. Chọn thứ tự mình muốn Có thể đưa phần quan trọng lên trước, đổi thứ tự sau khi xem thử, hoặc tạm ẩn một phần để dùng vào dịp khác.	4. Chọn số lượng phù hợp Ảnh, collection, campaign và các mục lặp lại đều có thể thêm hoặc bớt theo nội dung của store. Không có con số chung bắt buộc.

Bạn có thể bắt đầu ít rồi thêm dần. Một storefront gọn với vài khối rõ ràng vẫn có thể phù hợp hơn một trang dài có quá nhiều nội dung.

Ví dụ khối hình ảnh cộng đồng trong một theme preview. Số ảnh và cách sắp xếp có thể thay đổi theo ý tưởng của seller.

5. Cách chọn theme phù hợp

Không cần tìm một theme có sẵn đúng tên collection hoặc đúng ảnh sản phẩm của bạn. Nội dung trong preview chỉ là nội dung mẫu; điều cần nhìn là cách theme trình bày.

5.1 Khi xem preview, hãy tự hỏi

• Mình có thích cảm giác chung của theme này không?
• Khách hàng của mình có dễ tìm thấy sản phẩm và các nút cần bấm không?
• Mình muốn dùng nhiều ảnh hay muốn tập trung vào collection và campaign?
• Phần đầu trang có đủ rõ để khách biết store đang bán gì không?
• Khi xem trên điện thoại, chữ và ảnh có còn dễ nhìn không?

5.2 Có thể chọn theo sở thích

Theme là phần nền để bạn bắt đầu. Nếu một theme hợp gu và hợp sản phẩm, bạn có thể chọn nó rồi thay toàn bộ ảnh, chữ, collection, campaign và thứ tự widget sau đó.

Không cần chọn theme vì số block  Preview có thể dùng nhiều block để trình bày đầy đủ vẻ đẹp của theme. Store của bạn không cần dùng đủ số block đó.

6. Chọn nội dung trước, sắp xếp sau

Trước khi thêm widget, hãy nghĩ đơn giản: khách vào store thì mình muốn họ thấy gì và làm gì? Câu trả lời có thể thay đổi theo mùa, chương trình bán hàng hoặc ý tưởng mới.

Bạn muốn khách…	Có thể chọn khối…	Bạn vẫn được tự quyết định…
Hiểu store bán gì	Banner mở đầu hoặc phần giới thiệu	Ảnh, câu chữ, vị trí và có dùng nút hay không
Khám phá theo chủ đề	Collection hoặc campaign	Chọn nhóm nào và thêm bao nhiêu nhóm
Tin tưởng thương hiệu	Câu chuyện, gallery hoặc ảnh cộng đồng	Dùng loại ảnh nào, bao nhiêu ảnh và đặt ở đâu
Xem ưu đãi	Hot deals hoặc sản phẩm nổi bật	Chọn chương trình nào, thứ tự nào và hiển thị trong bao lâu

Đây chỉ là gợi ý  Bạn có thể dùng một widget theo cách khác nếu kết quả hiển thị phù hợp với store. Không có công thức cố định cho mọi seller.

7. Cách thêm hoặc sửa một widget

Tên các widget có thể hơi khác giữa các theme, nhưng cách làm thường giống nhau. Hãy làm từng widget một để dễ xem và dễ sửa.

1	Mở UI Widgets Trong phần chỉnh sửa storefront, mở khu vực UI Widgets, tức là nơi quản lý các khối nội dung.

2	Chọn Add Widget hoặc Edit Add Widget là thêm khối mới; Edit là sửa khối đang có.

Ví dụ danh sách Add Widget. Theme của bạn có thể hiện tên hoặc số loại widget khác.

3	Chọn loại widget Chọn khối phù hợp với điều bạn muốn khách thấy. Không cần chọn đủ các loại có trong preview.

4	Chọn phiên bản nếu có Nếu widget có nhiều version, xem thử từng kiểu hoặc chọn kiểu hợp với hình ảnh và nội dung của bạn.

5	Chọn trang và vị trí Chọn trang cần hiển thị và bất cứ Position nào theme đang cho phép.

6

Điền nội dung Điền các ô cần thiết, tuỳ vào khối bạn chọn sẽ cần upload ảnh và chọn collection/campaign/link nếu widget sử dụng các nội dung này. Thêm khoảng cách (margin) giữa các khối, Senprints đề xuất các khối nên cài đặt trường Margin bottom nằm trong khoảng giá trị từ 40 – 100. Ví dụ ở preview theme Flow, mỗi khối đang có giá trị Margin bottom = 80.

7	Thêm hoặc bớt mục Dùng nút Add, dấu cộng hoặc nút xóa để tạo đúng số lượng bạn muốn. Không cần chạy theo con số trong ảnh hướng dẫn.

8	Lưu và xem lại Chờ ảnh hiện hình xem trước, bấm Save, rồi mở storefront để kiểm tra.

Ví dụ cửa sổ chỉnh sửa widget. Chỉ dùng để nhận biết các nhóm ô; nội dung và lựa chọn thực tế tùy theme.

8. Chọn vị trí theo cách bạn muốn kể câu chuyện

Position là nơi widget xuất hiện trên trang. Nếu theme đưa ra nhiều lựa chọn, bạn có thể chọn bất cứ vị trí nào phù hợp với ý tưởng của mình.

• Muốn khách thấy ngay: chọn một vị trí gần đầu trang.
• Muốn bổ sung sau khi khách đã xem sản phẩm: chọn vị trí ở giữa hoặc phía sau một phần sản phẩm.
• Muốn kết thúc bằng lời mời khám phá thêm: chọn vị trí gần cuối trang.
• Muốn thử cách khác: đổi Position, lưu và xem lại. Bạn không bị buộc phải giữ vị trí ban đầu.

Ví dụ các nhóm Position trong UI Widgets. Tên nhóm và thứ tự trong theme của bạn có thể khác.

Cách chọn dễ nhất  Đừng cố nhớ tên Position. Hãy đổi thử, lưu, mở storefront và nhìn xem widget đang nằm ở đâu. Sau vài lần, bạn sẽ hiểu bản đồ của theme.

Ví dụ: khi setup theme Flow theo ý tưởng như hình phia dưới (hiển thị section Hot Deals & Top Picks nối sau Thành phần New Arrivals)

Cách config:

– Bước 1: Thêm Widget Hot Deals & Top Picks

– Bước 2: Tại modal edit, điền nội dung muốn hiển thị tại widget, chọn Position: After New Arrivals

– Bước 3: Sau khi đã nhập toàn bộ thông tin mong muốn, chọn Save để lưu thay đổi.

Tương tự, để thêm khối Follow social tiếp sau khối Hot deals & top picks. Chọn thêm khối và chọn Position là After New Arrivals, khối Follow Social được thêm sẽ hiển thị phía sau khối Hot deals và kết quả nhận được là giao diện

9. Số lượng ảnh, collection và campaign

Không có con số bắt buộc chung  Bạn quyết định thêm bao nhiêu ảnh, collection, campaign hoặc media dựa trên nội dung đang có và cảm giác muốn tạo ra. Con số trong preview hoặc ảnh minh họa chỉ là ví dụ.

Loại nội dung	Khi có ít nội dung	Khi có nhiều nội dung
Hình ảnh	Chọn vài ảnh rõ và đúng ý; không cần thêm ảnh chỉ để lấp chỗ.	Giữ các ảnh cùng câu chuyện; bỏ bớt ảnh lặp hoặc khó nhìn.
Collection	Chọn những nhóm quan trọng nhất với khách ở thời điểm đó.	Sắp xếp nhóm ưu tiên trước; có thể chia ra nhiều khối nếu thấy dễ xem hơn.
Campaign	Dùng chương trình đang cần được chú ý.	Chọn và sắp xếp theo mục tiêu bán hàng; tạm ẩn phần đã hết thời gian.
Media / gallery	Một vài ảnh tốt vẫn đủ để tạo cảm xúc.	Thêm theo mạch hình ảnh; xem trên điện thoại để tránh trang quá dài.

Ví dụ một widget đang chọn nhiều collection. Số đang thấy trong ảnh không phải tiêu chuẩn; seller có thể thêm hoặc bớt theo ý tưởng.

9.1 Khi nào nên dừng thêm?

• Khi mọi mục đều có lý do để xuất hiện và không bị lặp.
• Khi khách có thể hiểu nhanh mà không phải cuộn qua quá nhiều phần giống nhau.
• Khi ảnh, tên collection và campaign đều còn rõ trên điện thoại.
• Khi trang đã đúng mục đích của bạn, dù số lượng khác hoàn toàn preview.

10. Nói qua về các nhóm widget thường gặp

Không phải theme nào cũng có cùng tên hoặc cùng danh sách widget. Phần dưới đây giúp bạn nhận ra công dụng của từng nhóm, không phải danh sách bắt buộc phải dùng.

10.1 Banner / khối mở đầu

Hiểu đơn giản: một vùng hình ảnh và thông điệp nổi bật.

Phù hợp khi: bạn muốn giới thiệu nhanh store, một dịp đặc biệt hoặc một lời mời khám phá.

Bạn được tự chọn:

• Đặt ở đầu, giữa hoặc cuối trang nếu theme cho phép.
• Dùng ảnh và câu chữ của riêng bạn; có thể có hoặc không có nút bấm.
• Không cần giống banner trong preview.

10.2 Collection / Campaign

Hiểu đơn giản: một khối dẫn khách đến các nhóm sản phẩm hoặc chương trình bán hàng.

Phù hợp khi: bạn muốn khách đi nhanh đến một chủ đề, dịp tặng quà, dòng sản phẩm hoặc chương trình đang chạy.

Bạn được tự chọn:

• Collection hoặc campaign nào sẽ xuất hiện.
• Thứ tự của các mục.
• Số lượng phù hợp với nội dung hiện có; không phải đủ một con số cố định.

Ví dụ khối campaign/sản phẩm nổi bật trong theme preview. Seller có thể chọn nội dung và số mục khác.

10.3 Gallery / Media / Social feed

Hiểu đơn giản: một khu vực để kể chuyện bằng nhiều hình ảnh hoặc video.

Phù hợp khi: bạn có ảnh lifestyle, ảnh khách hàng, nội dung mạng xã hội hoặc hình ảnh tạo cảm xúc.

Bạn được tự chọn:

• Dùng ít hay nhiều hình tùy nội dung.
• Sắp xếp ảnh theo câu chuyện hoặc màu sắc mình thích.
• Thêm liên kết cho từng ảnh nếu widget có ô đó và bạn cần dùng.

10.4 Brand Story / phần giới thiệu

Hiểu đơn giản: một khối giúp khách hiểu con người, ý tưởng hoặc giá trị phía sau store.

Phù hợp khi: bạn muốn tạo sự tin tưởng hoặc giải thích vì sao sản phẩm của mình đặc biệt.

Bạn được tự chọn:

• Dùng một ảnh hoặc nhiều phần nhỏ tùy widget đang có.
• Viết ngắn hoặc dài tùy câu chuyện, miễn dễ đọc.
• Đặt ở bất cứ vị trí nào hợp với mạch trang.

10.5 Hot Deals / sản phẩm nổi bật

Hiểu đơn giản: một khối đưa những sản phẩm hoặc chương trình cần chú ý lên storefront.

Phù hợp khi: bạn đang có ưu đãi, sản phẩm mới, sản phẩm bán tốt hoặc một chiến dịch theo mùa.

Bạn được tự chọn:

• Chọn campaign hoặc sản phẩm phù hợp với thời điểm.
• Dùng bao nhiêu mục tùy mục tiêu và cách hiển thị bạn thích.
• Bật, tắt hoặc thay đổi nội dung khi chương trình kết thúc.

11. Hình ảnh, chữ và nút bấm

11.1 Hình ảnh

• Chọn ảnh rõ, đúng sản phẩm và có cùng cảm giác với theme bạn đã chọn.
• Không cần dùng ảnh giống preview. Ảnh của store mới là phần tạo ra dấu ấn riêng.
• Nếu widget có nhiều ảnh, ưu tiên sự liên quan hơn là cố thêm cho đủ.
• Sau khi tải, chờ hình xem trước xuất hiện rồi mới lưu.
• Xem lại trên điện thoại vì ảnh có thể được cắt khác so với máy tính.

11.2 Chữ

• Viết tiêu đề ngắn để khách hiểu ngay phần này nói về gì.
• Dùng cách nói quen thuộc với khách hàng của bạn.
• Không cần điền mọi ô nếu ô đó không bắt buộc và không giúp ích cho nội dung.
• Đọc lại như một khách mới vào store; bỏ bớt phần lặp hoặc khó hiểu.

11.3 Nút bấm và đường dẫn

• Tên nút nên nói rõ việc sẽ xảy ra, ví dụ Xem bộ sưu tập hoặc Khám phá ưu đãi.
• Mở thử đường dẫn sau khi lưu để chắc chắn khách đến đúng nơi.
• Nếu không cần dẫn khách đi nơi khác và widget cho phép, có thể không dùng nút.

12. Khoảng cách giữa các khối

Khoảng cách phía trên và dưới widget chỉ là khoảng thở giữa các phần. Không có một con số đẹp cho mọi theme.

• Hai phần dính sát nhau: tăng khoảng cách một chút rồi xem lại.
• Trang có khoảng trắng quá lớn: giảm khoảng cách.
• Máy tính đẹp nhưng điện thoại quá thưa hoặc quá chật: chỉnh phần dành cho điện thoại nếu widget có lựa chọn này.
• Thay đổi từng lần nhỏ; lưu và xem lại thay vì sửa nhiều con số cùng lúc.

Cứ nhìn bằng mắt  Bạn không cần nhớ một mức khoảng cách chuẩn. Kết quả dễ nhìn trên theme đang dùng là điều quan trọng.

13. Lưu, bật/tắt và đổi thứ tự

Thao tác trên màn hình	Hiểu đơn giản	Khi nên dùng
Save	Lưu thay đổi	Sau khi điền nội dung, tải ảnh hoặc đổi vị trí
Active	Đang hiển thị cho khách	Khi nội dung đã sẵn sàng
Inactive	Tạm ẩn nhưng vẫn giữ nội dung	Khi chưa muốn khách thấy hoặc muốn dùng lại sau
Drag to reorder	Kéo để đổi thứ tự	Khi muốn phần quan trọng lên trước trong cùng nhóm
Edit	Mở lại để sửa	Khi đổi chữ, ảnh, nội dung, vị trí hoặc số lượng
Delete	Xóa hẳn	Chỉ khi chắc chắn không cần dùng lại

14. Xem lại và điều chỉnh

Preview không chỉ dùng trước khi chọn theme. Sau mỗi thay đổi, hãy xem storefront như một khách hàng để biết bố cục có đúng ý hay không.

14.1 Trên máy tính

• Phần quan trọng có xuất hiện ở nơi bạn muốn không?
• Ảnh có rõ và không bị cắt mất nội dung chính không?
• Các khối có nối tiếp tự nhiên hay có phần nào lặp quá nhiều?
• Nút bấm có mở đúng trang không?

14.2 Trên điện thoại

• Chữ có dễ đọc và nút có dễ bấm không?
• Ảnh có bị cắt hoặc quá nhỏ không?
• Số lượng ảnh/collection/campaign có làm trang quá dài không?
• Khoảng cách giữa các phần có đều và dễ nhìn không?

14.3 Nếu chưa đúng ý

• Đổi Position hoặc thứ tự widget.
• Bớt một vài mục không cần thiết hoặc thêm nội dung còn thiếu.
• Thay ảnh, rút ngắn chữ hoặc đổi tên nút.
• Tạm ẩn widget rồi nhìn lại toàn trang.

15. Hướng dẫn setup Theme Flow

Phần này minh họa một cách làm hoàn chỉnh cho store quà tặng cá nhân hóa. Bạn có thể làm theo để quen thao tác, sau đó đổi widget, vị trí, nội dung và số lượng theo store của mình.

Ví dụ: Trong ví dụ có 3 widget, 3 collection, 3 ảnh và 2 campaign để dễ hình dung. Đây không phải số lượng tiêu chuẩn. Bạn có thể dùng ít hơn, nhiều hơn hoặc chọn các widget khác.

15.1 Tình huống của store trong ví dụ

Store muốn khách vừa vào trang có thể tìm quà theo người nhận, sau đó xem ảnh sản phẩm trong đời sống và cuối cùng nhìn thấy chương trình đang được ưu tiên.

Thứ tự muốn khách xem	Điều muốn khách làm	Widget dùng trong ví dụ
Đầu tiên	Chọn nhanh nhóm quà phù hợp	Collection Highlight
Tiếp theo	Xem ảnh để cảm nhận sản phẩm	Media Gallery
Sau đó	Khám phá chương trình nổi bật	Hot Deals Section

15.2 Bước 1 — xem preview và chốt mạch trang

1	Mở Preview của theme Xem toàn trang trên máy tính và điện thoại. Chú ý cách theme chia phần, kiểu ảnh và những vị trí có thể đặt nội dung.

2	Ghi lại phần mình thích Ví dụ: thích cách collection xuất hiện gần đầu trang và gallery tạo cảm giác sinh động ở giữa trang.

3	Ghi lại điều muốn thay đổi Ví dụ: không cần dùng mọi block trong preview; muốn phần ưu đãi xuất hiện sau ảnh thay vì ở quá sớm.

4	Chốt ba việc quan trọng Trong ví dụ là: giúp khách chọn quà, tạo cảm xúc bằng ảnh và giới thiệu chương trình nổi bật.

Mạch dự kiến của ví dụ: Collection Highlight → Media Gallery → Hot Deals Section. Nếu theme không có đúng tên này, hãy chọn widget có công dụng gần giống.

15.3 Bước 2 — setup Collection Highlight

Widget đầu tiên giúp khách chọn nhanh nhóm quà. Trong ví dụ, seller muốn phần này nằm ở khu vực gần đầu trang.

1	Mở UI Widgets và chọn Add Widget Trong danh sách, chọn Collection Highlight hoặc một widget collection có cách hiển thị bạn thích.

2	Chọn phiên bản Nếu có nhiều Version, chọn một kiểu rồi xem thử. Bạn có thể đổi lại nếu ảnh hoặc chữ chưa hợp.

3	Chọn trang Ví dụ chọn Home vì muốn khối xuất hiện ở trang chính. Store của bạn có thể chọn trang khác nếu theme cho phép.

4	Chọn Position Chọn một vị trí gần đầu trang trong các lựa chọn theme đang có. Không cần tìm tên Position giống hệt tài liệu.

5	Điền nội dung Ví dụ: tiêu đề “Quà tặng dành cho người thân”; mô tả ngắn về việc chọn quà theo người nhận.

6	Thêm ảnh và nút Tải hình ảnh, nhập tên nút như “Xem các bộ sưu tập” và chọn đường dẫn phù hợp nếu widget có ô này.

7	Chọn collection Ví dụ chọn Mom Gifts, Dad Gifts và Couple Gifts. Tìm bằng tên, thêm mục cần dùng và xóa mục không còn phù hợp.

8	Lưu và bật hiển thị Chờ ảnh hiện xem trước, bấm Save và để widget ở trạng thái Active khi nội dung đã sẵn sàng.

Ô cần chuẩn bị	Nội dung minh họa	Bạn có thể thay đổi
Title	Quà tặng dành cho người thân	Viết theo giọng của store
Description	Chọn món quà phù hợp cho người bạn yêu thương	Có thể viết ngắn hơn hoặc bỏ nếu không cần
Image	Một ảnh lifestyle rõ sản phẩm	Dùng bất cứ ảnh nào hợp với theme
Button	Xem các bộ sưu tập	Đổi tên nút và đường dẫn theo mục đích
Collections	3 collection trong ví dụ	Thêm hoặc bớt tùy nội dung thật

Ví dụ cửa sổ Collection Highlight. Ảnh đang hiển thị 4 collection, còn tình huống thực hành dùng 3; cả hai đều chỉ là minh họa và không tạo ra số lượng bắt buộc.

15.4 Bước 3 — setup Media Gallery

Widget thứ hai tạo cảm xúc bằng hình ảnh. Trong ví dụ, seller dùng ba ảnh nhưng có thể thêm hoặc bớt theo nội dung đang có.

1	Chọn Add Widget → Media Gallery Tuỳ từng theme sẽ có những tên gọi khác nhau như Gallery, Image Story, Instagram Gallery… nhưng đều có một tác dụng giống nhau là cho phép hiển thị nhiều hình ảnh.

2	Chọn trang và Position Ví dụ chọn Home và một vị trí ở giữa trang, sau phần sản phẩm hoặc collection mà seller muốn khách xem trước.

3	Tải ảnh đầu tiên Chọn ảnh rõ, cùng phong cách với store và có nội dung chính không nằm sát mép.

4	Thêm liên kết nếu cần Nếu từng ảnh cần dẫn đến collection hoặc campaign, điền liên kết tương ứng. Nếu không cần, có thể để trống các ô không bắt buộc.

5	Lưu và xem trên điện thoại Kiểm tra ảnh có bị cắt, trang có quá dài và mạch hình có dễ hiểu hay không.

Phần đầu cửa sổ Media Gallery: chọn trang, Position và tải từng ảnh. Position trong ảnh chỉ là một lựa chọn minh họa.

Phần dưới cửa sổ Media Gallery: bấm Add Media để thêm hoặc dùng nút xóa để bớt. Số ảnh do seller quyết định.

Nếu gallery làm trang quá dài  Bớt một vài ảnh, đổi thứ tự hoặc tạm ẩn widget rồi xem lại toàn trang. Giữ những ảnh giúp khách hiểu sản phẩm nhanh nhất.

15.5 Bước 4 — setup Hot Deals Section

Widget thứ ba sẽ đưa các colleciton/campaign cần chú ý lên storefront. Trong ví dụ, seller chọn hai campaign đang còn hiệu lực.

1	Chọn Add Widget → Hot Deals Section Có thể chọn Campaign Highlight hoặc một widget chương trình/sản phẩm nổi bật khác nếu theme không có đúng tên này.

2	Chọn trang và Position Ví dụ chọn Home và một vị trí sau phần hình ảnh. Nếu ưu đãi là việc quan trọng nhất, bạn có thể đặt nó sớm hơn.

3	Điền tiêu đề và mô tả Ví dụ: “Ưu đãi tuần này” và một câu ngắn nói rõ khách sẽ tìm thấy gì.

4	Tìm và chọn campaign Chọn campaign đang muốn đẩy mạnh. Ví dụ dùng hai campaign; số lượng thật tùy kế hoạch của store.

5	Lưu và bật hiển thị Bấm Save, để Active và mở storefront để kiểm tra tên, hình sản phẩm và nút bấm.

Ví dụ cửa sổ Hot Deals Section. Ảnh có 3 campaign; tình huống thực hành dùng 2. Seller được tự chọn số lượng theo chương trình đang chạy.

15.6 Bước 5 — kiểm tra vị trí và thứ tự

Quay lại danh sách UI Widgets và nhìn theo từng nhóm Position. Mục tiêu là kiểm tra storefront có đi theo mạch bạn đã chọn hay chưa.

Widget trong ví dụ	Nơi muốn xuất hiện	Trạng thái khi kiểm tra
Collection Highlight	Khu vực gần đầu trang	Active
Media Gallery	Khu vực giữa trang	Active
Hot Deals Section	Sau gallery hoặc phần sản phẩm	Active

• Nếu hai widget ở cùng một Position, kéo để đổi thứ tự trong nhóm đó.
• Nếu muốn chuyển widget sang khu vực khác, mở Edit và chọn lại Position.
• Nếu chưa muốn khách thấy một widget, chọn Inactive thay vì xóa.
• Nếu tên Position khó hiểu, lưu rồi mở storefront để nhìn vị trí thực tế.

Ví dụ danh sách widget ở nhiều Position. Seller có thể đổi thứ tự, Edit để đổi Position hoặc tạm ẩn từng widget.

15.7 Bước 6 — mở storefront và chỉnh đến khi đúng ý

Sau khi lưu ba widget, mở storefront như một khách hàng. Đừng chỉ kiểm tra từng widget riêng lẻ; hãy xem toàn bộ mạch trang.

Nếu bạn thấy…	Thử làm…	Vì sao
Collection xuất hiện quá muộn	Đổi sang Position gần đầu hơn	Khách tìm nhóm quà nhanh hơn
Gallery làm trang quá dài	Bớt ảnh hoặc đổi sang ảnh quan trọng hơn	Giữ mạch trang gọn
Ưu đãi chưa đủ nổi bật	Đưa Hot Deals lên sớm hơn hoặc rút ngắn phần trước	Khách thấy chương trình đúng lúc
Ảnh bị cắt trên điện thoại	Đổi ảnh hoặc chọn ảnh có khoảng trống quanh nội dung chính	Giữ phần quan trọng trong khung
Khoảng trắng quá lớn	Giảm khoảng cách từng chút rồi xem lại	Tránh các khối bị rời nhau
Trang có quá nhiều phần	Tạm Inactive một widget và so sánh	Dễ biết phần nào thật sự cần

15.8 Kiểm tra trên máy tính

• Khách có hiểu store bán gì ngay ở phần đầu không?
• Ba widget có xuất hiện theo mạch đã chọn không?
• Ảnh và chữ có rõ, nút bấm có mở đúng nơi không?
• Có phần nào lặp lại hoặc chiếm quá nhiều chỗ không?

15.9 Kiểm tra trên điện thoại

• Tiêu đề có dễ đọc và nút có dễ bấm không?
• Ảnh có bị cắt mất phần chính hoặc quá nhỏ không?
• Số collection, ảnh và campaign có làm khách phải cuộn quá lâu không?
• Khoảng cách giữa các khối có tự nhiên không?

16. Khi đổi sang theme khác

Theme mới có thể có widget, Position và cách cắt ảnh khác. Vì vậy hãy xem preview của theme mới và sắp xếp lại theo ý tưởng hiện tại của store.

1	Xem preview theme mới Nhìn phong cách, cách chia phần và cách hiển thị trên máy tính lẫn điện thoại.

2	Giữ lại nội dung gốc Lưu ảnh, câu chữ, đường dẫn, collection và campaign mà bạn còn muốn dùng.

3	Chọn lại widget Tìm những khối trong theme mới có công dụng phù hợp. Không cần tìm tên giống hệt theme cũ.

4	Chọn lại vị trí Đặt từng khối vào nơi bạn thích trong các Position mà theme mới cung cấp.

5	Chọn lại số lượng Thêm hoặc bớt nội dung theo bố cục mới; không cần giữ số lượng của theme cũ hoặc preview.

6	Xem và chỉnh Kiểm tra cả máy tính và điện thoại trước khi hoàn tất.

17. Khi gặp vấn đề — dành cho Seller

Bạn đang thấy	Thử kiểm tra	Cách xử lý dễ nhất
Widget không xuất hiện	Đúng trang chưa? Đúng Position chưa? Đang Active hay Inactive?	Mở Edit, chọn lại, Save rồi làm mới storefront
Ảnh chưa hiện	Ảnh đã có hình xem trước trong cửa sổ chỉnh sửa chưa?	Tải lại, chờ hình xem trước rồi Save
Không thấy collection/campaign	Nội dung đó đã được thêm vào store chưa?	Thêm vào store rồi quay lại tìm bằng tên ngắn
Trang quá dài	Có quá nhiều khối hoặc quá nhiều mục giống nhau không?	Tạm ẩn, bớt mục hoặc đổi thứ tự
Bố cục chưa hợp ý	Widget có thể đặt ở Position khác không?	Đổi vị trí, Save và xem thử lại
Máy tính đẹp, điện thoại chưa đẹp	Ảnh, chữ, số mục và khoảng cách trên điện thoại	Bớt nội dung hoặc điều chỉnh từng phần rồi xem lại

Khi cần hỗ trợ: Gửi tên store, tên theme, tên widget, ảnh cửa sổ Edit và ảnh storefront đang gặp vấn đề. Nói rõ bạn muốn kết quả trông như thế nào.