Bài viết về: Define Design

Cài đặt điều kiện cho Clipart Layer

MỤC LỤC


Những nội dung chính trong bài viết bao gồm:
Tổng quan về nút
Showcase: Chèn và đặt điều kiện cho các Layer trang phục clipart mèo


Bài viết này sẽ giúp bạn hiểu cách đặt điều kiện cho Clipart Layer.

TỔNG QUAN VỀ NÚT


Trong mục Tùy chọn nâng cao (Advanced Options), cụ thể cho Clipart/Text/Mask, bạn sẽ có nút được gọi là Đặt điều kiện cho Layer (Set Conditions For This Layer).

Để đặt điều kiện:
Chọn layer bạn muốn thêm điều kiện, sau đó mở tùy chọn Layer > Advanced Options
Nhấp vào Set Conditions For This Layer > Bấm Add Condition.


Sau đó, trong cửa sổ CONDITIONS:
Chọn Hiển thị (Show) hoặc Ẩn (Hide) cho layer ở bước 1.
Chọn layer bạn muốn đặt điều kiện sẽ Hiển thị / Ẩn .
Chọn mục "equal".
Chọn một category cụ thể hoặc sub-category của layer có điều kiện ở bước 4.
Khi bạn hoàn tất, hãy nhấp vào nút Apply.

Nút "Set Conditions For This Layer" được sử dụng chủ yếu cho Clipart. Tính năng này sẽ cần thiết nếu bạn muốn hiển thị hoặc ẩn clipart trong một số trường hợp nhất định.
Ví dụ: Có hai loại Clipart cho 2 giống mèo: mèo Lông Dài và mèo Sphynx. Trang phục của mỗi giống sẽ có kích thước khác nhau. Bằng cách thiết lập các điều kiện hiển thị cho từng Clipart trang phục cho các giống mèo, khách hàng có thể tránh được các vấn đề như ví dụ sau.


Bên cạnh đó, nếu bạn không đặt điều kiện cho từng Layer Clipart trang phục mà chèn toàn bộ category Clipart trang phục mèo vào, thì khách hàng của bạn sẽ có trải nghiệm như hình bên dưới. Nghĩa là, khách hàng của bạn phải tự tìm đúng mẫu trang phục cho giống mèo của họ, điều này khiến khách hàng của bạn sẽ có thể sẽ gặp khó khăn trong thao tác lựa chọn và ảnh hưởng trải nghiệm của họ. Bên cạnh đó còn khiến trang live store của bạn khá rối ren, đặc biệt trong trường hợp bạn có nhiều giống mèo hơn.


Đối với một số loại Clipart phức tạp hơn (như clipart niche bạn thân, thành viên gia đình,...) để giúp trải nghiệm cá nhân hóa của khách hàng trở nên dễ dàng, thuận tiện và ít nhầm lẫn hơn, thì việc cài đặt điều kiện cho các layer clipart là cần thiết.

SHOWCASE: CHÈN VÀ ĐẶT ĐIỀU KIỆN CHO CÁC LAYER TRANG PHỤC CLIPART MÈO



Giả sử bạn muốn thiết kế một sản phẩm và muốn bao gồm hai điều kiện sau cho Clipart của mình:
Điều kiện 1: Trang phục mèo Lông Dài sẽ chỉ được hiển thị nếu khách hàng chọn Long Hair Cat.
Điều kiện 2: Trang phục của mèo Sphynx sẽ chỉ hiển thị nếu khách hàng chọn chọn Sphynx Cat.
Đây là cách thực hiện từng bước:

Đặt Điều kiện 1 cho Clipart mèo Lông Dài:



Bước 1: Chèn layer Clipart Category của các giống mèo (Layer Cat Breeds). Trong ví dụ này, category này sẽ chỉ bao gồm 2 giống mèo: mèo Lông Dài và mèo Sphynx.

Bước 2: Chỉ chèn clipart trang phục mèo Lông Dài. Sau đó kéo tỷ lệ trang phục vừa với clipart mèo Lông Dài.


Bước 3: Đổi tên layer clipart trang phục mèo Lông Dài để dễ nhận biết (không bắt buộc) > Sau đó nhấn vào biểu tượng con mắt để ẩn layer này.


Để dễ quản lý và nhận biết các layer clipart, việc đổi tên càng sớm càng tốt sau khi thêm layer mới là vô cùng cần thiết.
Bước 4: Bấm chọn clipart trang phục mèo Lông Dài > vào Advanced Options, nhấp vào nút Set condition for this layer và thiết lập như sau: "Show This Layer if Cat Breeds equals Cat Breeds (Long Hair)"


Sau đó bấm Apply để hoàn tất cài đặt Điều kiện 1 cho mèo Lông Dài. Hãy chuyển sang bước tiếp theo và đặt điều kiện 2.

Đặt Điều kiện 2 giống mèo Sphynx:



Bước 5: Bấm chọn lại Layer Cat Breeds và nhấp vào clipart mèo Sphynx để thay đổi bản preview thành mèo Sphynx.


Bước 6: Chèn một layer clipart trang phục khác, nhưng lần này là dành cho mèo Sphynx. Sau đó kéo tỷ lệ kích thước trang phục cho phù hợp.



Bước 7: Chọn Sphynx Cat Costume Clip Art > Vào Advanced Options, nhấp vào nút Set condition for This Layer và thiết lập như sau: "Show This Layer if Cat Breeds equals Cat Breeds (Sphynx)" > Sau đó nhấp vào Apply.


Bước 8: Đổi tên Clipart trang phục mèo Sphynx (không bắt buộc).
Bước 9: Nhấn Save để hoàn tất cài đặt điều kiện cho layer.
Bước 10: Nhấp vào nút Re-order Field để sắp xếp vị trí các layer này.
Xem thêm: Re-order Field


Nếu được thiết lập đúng, đây sẽ là kết quả hiển thị trên live store của bạn sau khi hoàn thành các bước đặt điều kiện cho các layer.

Cập nhật vào: 20/05/2022

Bài viết có hữu ích không?

Chia sẻ phản hồi của bạn

Hủy bỏ

Cảm ơn!