> ## Knowledge Base Index > Fetch the complete knowledge base index at: https://support.teeinblue.com/sitemap.xml > Use this file to discover available pages before exploring further. > Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash). # Cách tạo và sử dụng Color Categories # Color Categories là gì? Color Categories là **một thư viện tập hợp các lựa chọn về màu sắc** có thể được sử dụng để khách hàng **thay đổi màu chữ (layer text)** trên một design. Khách hàng có thể chọn lựa một màu sắc trong số đó để tùy chỉnh design theo ý họ. Dưới đây là ví dụ về một color category: ![Color Category trong Teeinblue portal](https://storage.crisp.chat/users/helpdesk/website/6085dc2a7293d800/img-27_1bxi0ux.png) Như vậy, trên live store, khách hàng sẽ được lựa chọn từ những màu sắc có trong category này để thay đổi màu của một layer text: ![](https://storage.crisp.chat/users/helpdesk/website/6085dc2a7293d800/img-28_t0cgap.png) # Cách tạo Color Category * Từ trang Home, bạn tìm tới page **Assets** > **Color Categories** * Chọn **New Category** ![](https://storage.crisp.chat/users/helpdesk/website/6085dc2a7293d800/image_1cx5w7r.png) * **Đặt tên** cho category này và chọn **Create** # Thêm Colors (các lựa chọn màu) vào category * Để thêm màu vào trong category, bạn có thể **điền mã màu (color hex)** trong ô text box hoặc **chọn một màu từ ô vuông color picker**. Và chọn **Add new** ![](https://storage.crisp.chat/users/helpdesk/website/6085dc2a7293d800/img-30_1svef2s.png) # Chỉnh sửa Colors trong category * Sau khi thêm các màu, cách hiển thị **ảnh đại diện mặc định cho các options màu sắc này** trên personalization form sẽ dưới dạng \*\*Thumbnail images. \*\* * Để **đổi tên màu**, click vào tên màu, mặc định tên màu = mã màu (color hex), sau đó đổi tên, chọn **Save** để xác nhận. ![](https://storage.crisp.chat/users/helpdesk/website/6085dc2a7293d800/img-36_jsx3s9.png) Tên màu sẽ xuất hiện trên storefront nếu bạn chọn tùy chọn hiển thị là *Dropdown list of Option Name* hoặc bật toggle *Show option name on hover* * Bấm vào **nút X để xóa** * Để **thay đổi thứ tự các lựa chọn màu sắc**, click, giữ chuột và kéo thả đến vị trí theo thứ tự mà bạn muốn. ![](https://storage.crisp.chat/users/helpdesk/website/6085dc2a7293d800/img-32_h2n6h6.png) # Sử dụng Color Categories trong Artwork 2.0 Trong Artwork 2.0, hãy thêm một Color Layer vào form cá nhân hóa. Bạn có thể đặt màu mặc định, sau đó truyền màu đã chọn vào một Layer hỗ trợ như Text Layer. ### Thêm Color Layer 1. Trong **Teeinblue Portal > Artworks**, mở một Artwork. 2. Chọn **+ Layer > Form Elements > Color**. ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/codex-image-aug-26-2026-080738_42h0sc.png) ### Thiết lập Color option Bạn có thể tạo Color option riêng cho Artwork hoặc sử dụng Global Color Option có sẵn. #### Tạo Color option mới 1. Trong **Teeinblue Portal > Artworks > mở Artwork > chọn Color Layer > Personalization Settings**, chọn **Create a new option**. 2. Nhập **Option Title**. 3. Trong **Color options**, chọn một trong các loại sau: * **Solid Color category:** Chọn một Color Category. ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/screenshot-2026-09-14-142107_j31fvt.png) * **Color Sequence categories:** Chọn một nhóm Color Categories. ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/screenshot-2026-09-14-142352_1nrof52.png) * **Color picker:** Trong **Select default value**, chọn màu hoặc nhập mã hex. ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/screenshot-2026-09-14-142448_1f1v3pf.png) | Với Color Layer, **Select default value** hiển thị khi bạn chọn **Create a new option**. Để bỏ màu mặc định, chọn **Clear default value**. #### Sử dụng Global Color Option có sẵn 1. Trong **Teeinblue Portal > Artworks > mở Artwork > chọn Color Layer > Personalization Settings**, chọn **Use an existing global option**. 2. Trong **Select a global option**, chọn Color Global Option đã tạo. ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/codex-image-aug-26-2026-082248_1bzttst.png) ### Đặt giá trị mặc định cho Global Color Option 1. Trong **Teeinblue Portal > Assets > Global Options**, tạo mới hoặc mở một Color Global Option. 2. Chọn **Solid Color category**, **Color Sequence** hoặc **Color picker**. 3. Trong **Select default value**, chọn một màu, một sequence hoặc chọn màu bằng color picker. 4. Chọn **Save**. | Giá trị mặc định thuộc Global Option. Các Artwork sử dụng Global Option này sẽ dùng cùng giá trị mặc định. ### Áp dụng Color option cho Layer khác 1. Trong **Teeinblue Portal > Artworks > mở Artwork**, chọn Layer mà khách hàng có thể đổi màu, chẳng hạn như Text Layer. 2. Trong **Populate Values**, bật **Populate Color from another option**. 3. Trong **Select a Color option**, chọn Color Layer. 4. Giữ nguyên giá trị `{{color}}`. ![](https://storage.crisp.chat/users/helpdesk/website/-/6/0/8/5/6085dc2a7293d800/codex-image-aug-26-2026-081454_qn8nfn.png) Layer được liên kết sử dụng màu mặc định trước khi khách hàng chọn màu. Nếu khách hàng chọn màu khác, màu họ chọn sẽ thay thế giá trị mặc định. ### Kiểm tra kết quả 1. Mở sản phẩm trên storefront đang sử dụng Artwork. 2. Kiểm tra Color option đang hiển thị giá trị mặc định và Layer được liên kết sử dụng màu đó. 3. Chọn màu khác và kiểm tra preview đã cập nhật. ![](https://storage.crisp.chat/users/helpdesk/website/6085dc2a7293d800/img-28_t0cgap.png) | Đọc thêm về [Chức năng Add Text và các tùy chỉnh](/vi/article/chuc-nang-add-text-va-cac-tuy-chinh-13thgw6/)