Điền sẵn trường text bằng URL sản phẩm tùy chỉnh

Pre-fill text option bằng URL sản phẩm tùy chỉnh cho phép bạn tự động điền sẵn các trường text một dòng trên storefront khi khách hàng mở link. Tính năng này hữu ích cho các chiến dịch quảng cáo cá nhân hóa, link khuyến mãi, hoặc các sản phẩm đã cấu hình sẵn mà bạn muốn điền trước một cái tên hay một đoạn text cụ thể.

Trường hợp sử dụng

Link pre-fill rất phù hợp khi bạn muốn tạo trải nghiệm mua sắm cá nhân hóa cho khách hàng:

• Quảng cáo cá nhân hóa: Chạy quảng cáo nhắm đến từng nhóm khách hàng cụ thể (ví dụ: nhắm đến nhóm khách tên "Jason" bằng một link quảng cáo mở ra chiếc áo thun đã có sẵn chữ "Jason" được gõ và render trên mockup).
• Link sản phẩm đã cấu hình sẵn: Chia sẻ link trực tiếp qua bộ phận chăm sóc khách hàng hoặc mạng xã hội, giới thiệu các tên mẫu trên sản phẩm bán chạy mà khách không phải tự gõ.

Cách hoạt động

Khi khách hàng mở một link sản phẩm có chứa query parameter, Teeinblue sẽ tự động nhận diện và áp giá trị đó vào form cá nhân hóa của bạn:

• Khớp theo Option Title: Tham số trên URL phải khớp chính xác với Option Title bạn đã đặt trong Artwork editor ở Teeinblue Portal.
• Phân biệt chữ hoa chữ thường: Việc khớp phân biệt hoa thường tuyệt đối. Ví dụ, nếu option title trong portal là Name thì tham số URL phải là ?Name=Emily (tham số kiểu ?name=Emily sẽ bị bỏ qua).
• Hoạt động với mọi ngôn ngữ của storefront: Việc khớp dựa trên title gốc trong portal, không dựa trên title đã dịch hiển thị trên storefront. Chỉ một link quảng cáo duy nhất là dùng được cho mọi ngôn ngữ của khách hàng.
• Preview mockup tức thì: Ngay khi trang load xong, ô text được điền và canvas preview render lại cùng đoạn text đó.
• Khách hàng vẫn toàn quyền: Khách hàng vẫn có thể tự do sửa, thay thế hoặc xóa trắng đoạn text đã điền sẵn trước khi thêm sản phẩm vào giỏ.

Các bước thiết lập

Bước 1. Tìm Option Title trong Teeinblue Portal

• Trong Teeinblue Portal, vào Campaigns (hoặc Artworks).
• Mở Campaign của bạn và click Edit artwork trên thẻ Printarea.
• Chọn text layer của bạn và mở Personalization Settings của nó.
• Kiểm tra chính xác đoạn text trong trường Option title. Để ý đúng từng chữ hoa, chữ thường.

Bước 2. Thêm tham số vào link sản phẩm

Lấy URL sản phẩm thông thường của bạn và thêm vào sau một dấu hỏi (?), rồi đến Option Title=Giá trị.

Ví dụ 1: Một trường đơn giản

Nếu option title của bạn là Name:

https://yourstore.com/products/personalized-t-shirt?Name=Emily

Kết quả trên storefront:

• Trường Name → Emily
• Preview mockup cập nhật ngay lập tức với Emily.

Ví dụ 2: Kết hợp với Variant của Shopify

Bạn có thể kết hợp tham số của Teeinblue với tham số variant mặc định của Shopify bằng dấu &:

https://yourstore.com/products/personalized-t-shirt?variant=67845120065749&Name=Emily

Kết quả trên storefront:

• Variant 67845120065749 được chọn tự động.
• Trường Name → Emily.

Ví dụ 3: Nhiều trường cùng lúc

Bạn có thể điền sẵn nhiều trường text cùng một lúc:

https://yourstore.com/products/personalized-mug?First Name=Emily&Last Name=Jones

Kết quả trên storefront:

• Trường First Name → Emily
• Trường Last Name → Jones

Giá trị được định dạng và giới hạn như thế nào

Giá trị điền sẵn từ URL phải chịu đúng các quy tắc định dạng và làm sạch như khi khách hàng tự gõ tay:

• Kiểu chữ hoa/thường: Nếu bạn đặt option là UPPERCASE hoặc lowercase, giá trị từ URL sẽ tự động được định dạng theo (ví dụ: ?Name=jason thành JASON).
• Độ dài tối đa: Nếu đoạn text trên URL vượt quá số ký tự tối đa cho phép, nó sẽ bị cắt bớt về đúng giới hạn (ví dụ: ?Name=Alexander thành Alexa nếu giới hạn là 5).
• Giới hạn ký tự của font: Nếu font của bạn không hỗ trợ số hoặc chữ có dấu, các ký tự không được hỗ trợ sẽ tự động bị loại bỏ.
• Emoji & ký tự ẩn: Emoji và các ký hiệu định dạng ẩn luôn bị lọc bỏ.
• Từ trong blacklist: Nếu URL chứa một từ bị cấm trong blacklist của bạn, từ đó vẫn hiện trong ô nhập, nhưng phần kiểm tra form sẽ chặn khách hàng thêm vào giỏ và hiển thị thông báo lỗi.

Lưu ý quan trọng & giới hạn

• Layer ẩn & toggle điều kiện:
• • Artwork bản cũ (Classic): Nếu một text layer có toggle ẩn/hiện riêng và đang tắt mặc định, việc truyền giá trị qua URL sẽ tự động bật toggle đó lên và hiển thị trường nhập.
  • Artwork v2: Nếu một text layer bị ẩn sau một option toggle điều kiện riêng biệt (dependency), toggle cha sẽ không tự động bật. Tuy nhiên, khi khách hàng bật toggle đó lên, đoạn text điền sẵn đã nằm sẵn ở đó chờ họ.
• Pre-fill hoạt động ở đâu:
• • Trang sản phẩm trên storefront (cả SDK v1 và v2).
  • Form nhúng trực tiếp trên trang sản phẩm và form dạng modal popup (nút "Personalize").
• Pre-fill KHÔNG hoạt động ở đâu:
• • Popup sản phẩm Cross-sell và Add-on.
  • Màn hình "Edit Customization" mở từ giỏ hàng.
  • Text nhiều dòng, number, date, dropdown và option upload ảnh.
  • Tích hợp headless, Make/Integromat, hay bản xem trước đơn hàng trong Shopify Admin.
• Tham số theo dõi (tracking):
• • Các tham số tracking quảng cáo thông thường (như utm_source, utm_campaign, fbclid) không khớp với option title nào sẽ được bỏ qua một cách an toàn và không ảnh hưởng đến việc cá nhân hóa.

Cập nhật vào: 01/11/2026