Cách thêm Chatbot AI Asyntai vào Squarespace

Hướng dẫn từng bước cho trang web Squarespace

Nền tảng:

Bước 1: Lấy Mã Nhúng của Bạn

Trước tiên, hãy vào Bảng điều khiển Asyntai và cuộn xuống phần "Mã nhúng". Sao chép mã nhúng riêng của bạn, mã này sẽ trông như sau:

<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>

Lưu ý: Mã ở trên chỉ là ví dụ. Bạn phải sao chép mã nhúng duy nhất của riêng mình từ Bảng điều khiển vì nó chứa ID tiện ích cá nhân của bạn.

Bước 2: Thêm mã bằng Code Injection

Nếu trang web của bạn dùng gói Squarespace Core, Plus hoặc Advanced (hoặc gói Business hay Commerce cũ), bạn có thể thêm chatbot vào tất cả các trang cùng lúc bằng Code Injection:

Đăng nhập vào tài khoản Squarespace và mở trang web của bạn
Nhấp Pages trong bảng bên trái
Nhấp Custom Code ở cuối bảng
Nhấp Chèn mã
Cuộn xuống phần Chân trang
Dán mã nhúng Asyntai vào hộp văn bản Chân trang
Nhấp "Save"

Lưu ý: Trên Squarespace 7.0, Code Injection nằm trong Pages → Website Tools.

Mẹo: Việc thêm mã vào phần Chân trang sẽ đặt nó ngay trước thẻ đóng </body>, đây là vị trí được khuyến nghị cho tiện ích chat và sẽ không làm chậm việc tải trang.

Thay thế: Sử dụng khối mã

Để chỉ thêm chatbot vào một số trang cụ thể, bạn có thể dùng khối mã. Khối mã chỉ chạy JavaScript với gói Core, Plus hoặc Advanced (hoặc gói Business hay Commerce cũ).

Mở trang web trong Trình soạn thảo Squarespace
Điều hướng đến trang bạn muốn thêm chatbot
Nhấp "Chỉnh sửa" trên trang
Di chuột qua một phần và nhấp vào \"+ Add Block\"
Cuộn xuống và chọn "Mã"
Nhấp biểu tượng bút chì để chỉnh sửa khối mã
Dán mã nhúng Asyntai của bạn
Đảm bảo menu Mode của khối được đặt thành HTML
Nhấp bên ngoài khối để đóng trình soạn thảo
Nhấp "Save"

Quan trọng: Khi dùng khối mã, bạn sẽ cần thêm mã vào từng trang mà bạn muốn chatbot xuất hiện. Để cài đặt trên toàn bộ trang web, hãy dùng phương pháp Code Injection ở trên.

Bước 3: Xác minh Cài đặt

Sau khi lưu các thay đổi, hãy mở trang web của bạn trong tab trình duyệt mới hoặc cửa sổ ẩn danh. Bạn sẽ thấy nút tiện ích chat ở góc dưới bên phải. Nhấp vào để đảm bảo nó mở và hoạt động đúng.

Không thấy tiện ích? Hãy đảm bảo bạn đã lưu và xuất bản các thay đổi. Thử xóa bộ nhớ đệm trình duyệt hoặc xem trang web trong cửa sổ ẩn danh. Squarespace có thể mất vài phút để áp dụng các thay đổi mã. Đôi khi mã không chạy khi bạn đang đăng nhập Squarespace, vì vậy hãy kiểm tra trang web trong cửa sổ riêng tư.

Thêm Thanh tìm kiếm AI

Thanh tìm kiếm AI là một widget riêng với mã riêng. Thêm nó cùng với chat, hoặc dùng một mình. Nó cần gói Standard trở lên: ở gói thấp hơn, thanh vẫn hiện nhưng không trả về kết quả.

Thêm thuộc tính data-replace vào thẻ script và thanh này sẽ thay chỗ thanh sẵn có của giao diện. Thêm nó trong Pages, Custom Code, Code Injection, Footer, cùng vị trí với mã chat. Squarespace chỉ cung cấp Code Injection với gói Core, Plus hoặc Advanced (hoặc gói Business hay Commerce cũ), vì vậy bạn cần một trong các gói này để cài đặt.

<script src="https://widget.asyntai.com/static/js/search-widget.js" data-asyntai-id="YOUR_WIDGET_ID" data-replace="auto" async></script>