Cài Website Chat: tạo widget, lấy mã và gắn vào website

Chuẩn bị trước khi bắt đầu

• Tài khoản TrolyPage có quyền tạo kênh Website.
• Tên miền thực tế khách truy cập, gồm cả www hoặc tên miền con nếu website có dùng.
• Quyền cài script vào website, hoặc người quản lý WordPress, Shopify hay mã nguồn hỗ trợ bạn.

Mở ứng dụng TrolyPage. Ảnh dùng nhãn English; nếu giao diện của bạn đang là tiếng Việt, đối chiếu tên mục được giải thích trong từng bước. Nhấn Mở ảnh lớn để đọc rõ các ô và số chú thích.

1. Tạo widget cho website của bạn

Mở Channels & Social → Messaging → Website. Widget là phần nút và cửa sổ chat sẽ xuất hiện trên website.

1. Trong Add Website widget, điền Widget Name (số 1). Tên giúp bạn nhận đúng widget khi có nhiều website; ví dụ ảnh dùng Docs Demo - May Store - 2026-10-02.
2. Ở Allowed Domains (số 2), nhập mỗi tên miền một dòng. Ví dụ website của bạn dùng maystore.example và www.maystore.example thì khai báo cả hai; thay bằng tên miền thật của bạn.
3. Nhập tên miền, không nhập đường dẫn như /san-pham/ao. Ảnh dùng localhost và 127.0.0.1 cho trang demo chạy trên máy; hai giá trị này không thay cho tên miền website công khai.
4. Nhấn Save (số 3), chờ màn hình cấu hình mở ra. Kiểm tra tên widget ở đầu trang. Nếu widget đã tồn tại, mở cấu hình widget đó thay vì tạo thêm một widget trùng mục đích.

2. Chỉnh giao diện và cách xuất hiện

Trong Website assistant, lần lượt mở các mục bên trái. Xem Preview bên phải để hiểu thay đổi trước khi áp dụng:

• Content & contacts: chỉnh nội dung lời chào và thông tin liên hệ. Dùng câu ngắn cho khách biết họ có thể hỏi gì.
• Appearance: chọn mẫu, màu, kích thước và vị trí nút. Chọn màu hợp website; đặt nút tránh che giỏ hàng hoặc nút mua.
• Behavior: chọn màn hình đầu tiên, cách mở và lời mời cạnh nút. Chọn mở bằng click khi muốn khách chủ động; cân nhắc trước khi bật mở tự động.
• Visibility: kiểm tra Show widget, thiết bị desktop/mobile và phạm vi trang. Nếu giới hạn theo giờ hỗ trợ, kiểm tra đúng giờ bạn muốn khách thấy chat.
• Language & wording: chỉnh ngôn ngữ và câu chữ phù hợp khách. Không coi ngôn ngữ của trang quản trị là ngôn ngữ widget tự động.

Chỉ báo Draft saved nghĩa là bản nháp đã lưu. Khi đã kiểm tra xong, dùng Apply to website và xem kết quả. Nếu phần Install vẫn báo Configuration not published, đừng coi bản nháp đã áp dụng; mở lại cấu hình và kiểm tra trạng thái trước khi tiếp tục.

3. Sao chép mã và cài một lần

Mở Install on website (số 1). Phần kiểm tra phân biệt cấu hình, mã cài đặt và tín hiệu từ website. Installation code is ready chỉ cho biết có mã để cài.

1. Chọn HTML / React hoặc CMS (số 2) theo cách website được quản lý.
2. Nhấn Copy code (số 3). Dùng nguyên mã của đúng widget; không sao chép mã trong ảnh và không thay token bằng một chuỗi ví dụ.
3. Với HTML/React, mở bố cục chung hoặc footer của website, dán mã ngay trước thẻ đóng </body>. Nhờ người quản lý mã nguồn thực hiện nếu bạn không có quyền sửa.
4. Với CMS, dùng mục chèn script vào footer theo nền tảng. Xem hướng dẫn cài Website Chat theo nền tảng cho WordPress, Shopify và lựa chọn tương ứng.
5. Lưu/xuất bản thay đổi trên website của bạn. Chỉ cài một lần trong bố cục chung; đừng thêm thêm một bản trong mỗi trang sản phẩm.

4. Kiểm tra trên chính website

Mở một trang thật chứa mã vừa cài và tải lại. Kiểm tra có nút chat, mở được cửa sổ, đóng được và không che thao tác chính. Nếu trình cấu hình có Check again, quay lại để kiểm tra tín hiệu website; Waiting for a signal from the website nghĩa là chưa có bằng chứng website đã gửi tín hiệu.

Mở website trên điện thoại của bạn, kiểm tra bàn phím, nút gửi và nút đóng vẫn dùng được. Kiểm tra cả trang chủ lẫn trang sản phẩm nếu chỉ một số trang được phép hiển thị. Trong Messaging, Enter Chat của dòng widget mở inbox tương ứng; widget hiện ra chưa có nghĩa đã có AI nhận tin.

Chuẩn bị dữ liệu và tạo trợ lý AI

Kết nối kênh chỉ đưa kênh vào TrolyPage. AI cần thông tin của cửa hàng để trả lời. Ví dụ dưới đây dùng cửa hàng hư cấu Mây Store và một áo Linen giá 320.000 đồng; hãy thay dữ liệu mẫu bằng thông tin đã xác nhận của bạn.

1. Tạo một trợ lý riêng

1. Mở AI Agent rồi nhấn Create Agent. Màn hình hướng dẫn có các bước Purpose, Business knowledge, Workflow và Review & create.
2. Để nhập dữ liệu theo ví dụ này, chọn Quick creation. Điền Agent Name (số 1) và Description (số 2). Dùng tên dễ phân biệt như Mây Store — Tư vấn khách; mô tả việc trợ lý được làm.
3. Nhấn Create & Open Builder (số 3). Kiểm tra tên trợ lý ở đầu Builder. Trợ lý mới ở trạng thái Draft; chưa tự nhận hội thoại.

2. Nhập kiến thức có thể kiểm tra

Trong Builder, chọn Knowledge → Create Article. Điền tên tài liệu (số 1), nội dung (số 2), rồi nhấn + Add (số 3). Chờ nguồn xuất hiện trong Connected knowledge với trạng thái Ready. Nếu chưa thấy, tải lại Builder và kiểm tra trước khi thêm lần nữa để tránh trùng nguồn.

Bạn có thể sao chép mẫu dưới đây để học thao tác. Giá và chính sách này chỉ thuộc ví dụ:

Mây Store — dữ liệu thực hành
Sản phẩm: Áo Linen demo, mã MAY-LINEN-01.
Giá: 320.000 đồng/áo. Màu: trắng, xanh. Size: S, M, L.
Số đo áo: S ngực 100 cm, dài 66 cm; M 104 cm, 68 cm; L 108 cm, 70 cm.
Đây là số đo thành phẩm. Khách nên so với áo đang mặc vừa.
Khách có thể yêu cầu đổi size trong 7 ngày từ ngày nhận,
nếu áo chưa dùng, chưa giặt và còn tem. Nhân viên kiểm tra trước khi xác nhận.
Nhân viên hỗ trợ thứ Hai–thứ Bảy, 09:00–18:00, Asia/Ho_Chi_Minh.
Chưa có dữ liệu tồn kho, phí giao, ngày giao, giảm giá và chính sách hoàn tiền.
Demo không tạo đơn hoặc thu tiền.

3. Viết chỉ dẫn trong Prompt

Chọn Prompt, nhập vào System prompt content. Chờ chỉ báo Saved; nếu có Save changes, nhấn nút đó và kiểm tra lại. Mẫu dưới đây giúp trợ lý trả lời đúng phạm vi:

Bạn là trợ lý tư vấn của Mây Store. Trả lời tiếng Việt, xưng mình, gọi khách là bạn.
Dùng Knowledge để trả lời giá, màu, size và chính sách.
Trả lời câu hỏi chính trước; mỗi lượt chỉ hỏi một thông tin còn thiếu.
Phân biệt số đo áo và số đo cơ thể.
Không tự tạo giảm giá, tồn kho, phí giao, ngày giao hoặc cam kết hoàn tiền.
Thiếu dữ liệu thì nói rõ chưa có thông tin và hỏi khách có muốn nhân viên kiểm tra.
Không bắt khách cung cấp điện thoại chỉ để hỏi giá.
Khi khách cần người thật hoặc báo lỗi hàng, ghi nhận và dùng công cụ bàn giao đã cấu hình.
Nếu chưa có công cụ bàn giao, không nói rằng đã chuyển thành công.
Demo chỉ tư vấn; không tạo đơn, thanh toán, booking, QR hoặc vận đơn.

Điều chỉnh cho cửa hàng của bạn

• Giá và chính sách: thay trong Knowledge trước. Chỉ dẫn “dùng Knowledge” giúp bạn sửa giá ở nguồn thay vì nhúng nhiều giá mâu thuẫn trong prompt.
• Cách tư vấn: nếu bán giày, thay bảng số đo áo bằng bảng chiều dài bàn chân của từng mẫu. Thay câu hỏi tư vấn tương ứng; không dùng bảng size áo cho giày.
• Thông tin chưa có: giữ quy tắc hỏi lại hoặc nhờ nhân viên. Muốn báo phí giao, phải thêm nguồn phí và điều kiện áp dụng trước.
• Bàn giao: một câu trong prompt chưa tự tạo người nhận hay thông báo. Cấu hình công cụ bàn giao và nhân viên thực sự phụ trách trong phần Tools trước khi hứa đã chuyển.

4. Kiểm tra câu trả lời trước khi kích hoạt

Test run là khung thử trong Builder. Nó giúp bạn đối chiếu nội dung, không chứng minh kênh Messenger, Zalo hay website đã được phân công. Nếu muốn thử, dùng các câu sau và so với nguồn:

Phân công AI cho đúng kênh

Chỉ thực hiện khi dữ liệu và chỉ dẫn đã sẵn sàng. Trong Builder, nút Publishing mở bước xác nhận kích hoạt trợ lý. Sau khi bạn xác nhận, quay lại danh sách AI Agent và kiểm tra trạng thái của chính trợ lý; đừng suy ra đã kích hoạt từ chỉ báo Saved.

1. Mở General Settings → AI Routing. Công tắc Allow AI to auto-respond (số 1) có phạm vi toàn hệ thống; cần kiểm tra với người quản lý trước khi thay đổi trong workspace đang vận hành.
2. Trong Assign by Channel, tìm tên kênh (số 2) và mở Channel assignment (số 3). Chọn trợ lý dành cho kênh đó. Disable AI for Channel nghĩa là tắt AI trên kênh; Use Default Agent dùng trợ lý dự phòng.
3. Kiểm tra lựa chọn còn đúng sau khi tải lại trang. Nếu có quy tắc ở Assign by rule, đọc quy tắc trước: quy tắc khớp được ưu tiên hơn lựa chọn theo kênh. Default Agent chỉ là lớp dự phòng.

Khi widget chưa xuất hiện

Kết thúc bước cài đặt khi: widget đúng tên xuất hiện trên đúng tên miền, chỉ có một bản, mở/đóng được trên thiết bị cần dùng và cấu hình hiển thị khớp dự định. Website Chat chưa hỗ trợ chuỗi Follow-up; không dùng widget để hứa gửi nhắc khách sau khi họ rời website.