Tuỳ chọn Ô mẫu ảnh cho phép khách hàng chọn từ một bộ ảnh có tên, trong đó mỗi lựa chọn thực sự đổi hình hiển thị trên canvas. Đây là tuỳ chọn nên dùng khi thiết kế có các biến thể hình ảnh thực sự, như các phối màu khác nhau của cùng một hình minh hoạ, thay vì một bộ chọn lựa chọn đơn giản như Danh sách lựa chọn.

Để thêm tuỳ chọn này, vào Bộ tuỳ chọn ở thanh bên, mở bộ tuỳ chọn của sản phẩm, bấm Thêm tuỳ chọn, chọn Ô mẫu ảnh trong mục Danh sách lựa chọn, rồi bấm Thêm.

Bộ tuỳ chọn trong thanh điều hướng bên
Nút Thêm tuỳ chọn trong trình chỉnh sửa bộ tuỳ chọn
Menu Thêm tuỳ chọn với Ô mẫu ảnh được chọn trong mục Danh sách lựa chọn

Nội dung

Phần Nội dung điều khiển nhãn, các ảnh khách hàng chọn và cách chúng được hiển thị.

  • Nhãn: tên trường hiển thị phía trên bộ chọn, mặc định là "Image swatch"
  • Ảnh mặc định: một ảnh dự phòng độc lập, chọn từ bất kỳ tài nguyên nào trong thư viện của bạn, không nhất thiết là một trong các giá trị ô mẫu bên dưới
  • Bộ hình ảnh: ban đầu để trống, dùng Thêm ảnh (tải lên hoặc chọn một file) và Nhập từ thư mục (thêm hàng loạt mọi file đang có trong một thư mục Tài nguyên) để điền vào
Bảng Nội dung với Nhãn, Ảnh mặc định và Bộ hình ảnh trống hiển thị các nút Thêm ảnh và Nhập từ thư mục

Bấm Nhập từ thư mục sẽ mở thư viện Tài nguyên. Ô mẫu ảnh đọc trực tiếp các file ảnh nằm ngay trong thư mục, nên một thư mục phẳng như "Choose Color" dùng được ngay. Đánh dấu ô chọn của thư mục trong danh sách Thư mục (đừng đi vào trong thư mục, vì bấm vào tên thư mục sẽ mở nó chứ không chọn nó) và bấm Xong.

Hộp thoại Ảnh với ô chọn của thư mục Choose Color được đánh dấu trong danh sách Thư mục

Mỗi file trong thư mục đó trở thành một giá trị trong Bộ hình ảnh, được đặt tên theo tên file, và giá trị đầu tiên tự động được đặt làm Mặc định.

Bảng Nội dung sau khi nhập, hiển thị Black, Blue, Brown, Green, Navy và Pink trong Bộ hình ảnh với Black được đặt làm Mặc định
  • Kiểu hiển thị: chọn Ảnh thu nhỏ để hiển thị mỗi giá trị dưới dạng ô ảnh, Nút để hiển thị dưới dạng nút chữ, hoặc Danh sách thả xuống để hiển thị dưới dạng menu chọn
Bản xem trước bộ tuỳ chọn hiển thị kiểu hiển thị Nút với mỗi màu là một nút có nhãn
Bản xem trước bộ tuỳ chọn hiển thị kiểu hiển thị Danh sách thả xuống dưới dạng menu chọn

Cách hiển thị trên canvas

Đây là điểm khiến Ô mẫu ảnh khác với Danh sách lựa chọn: chọn một giá trị không chỉ ghi lại lựa chọn mà còn vẽ lại lớp canvas của chính tuỳ chọn đó bằng ảnh tương ứng. Chọn Pink sẽ lập tức đổi hình trên mockup sản phẩm sang phiên bản màu hồng.

Canvas và bản xem trước bộ tuỳ chọn sau khi chọn Pink, hiển thị hình con mèo màu hồng trên áo

Điều kiện

Giống hầu hết các loại tuỳ chọn, Ô mẫu ảnh hỗ trợ điều kiện riêng, nên bạn có thể hiện hoặc ẩn nó dựa trên một lựa chọn khác trong bộ tuỳ chọn. Vì mỗi giá trị có tên riêng (Black, Blue, Brown...), các tên đó cũng xuất hiện như những mục riêng trong bộ chọn Điều kiện của các tuỳ chọn khác, giống như các lựa chọn của Danh sách lựa chọn. Xem hướng dẫn Bộ tuỳ chọn có điều kiện (Conditional Option Sets) nếu bạn muốn thiết lập.

Cập nhật ngày: 17/07/2026