Cách Thêm Chatbot AI Asyntai vào Adobe Commerce (Magento)

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

Nền tảng:

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

Đầu tiên, đi đến Bảng điều khiển Asyntai và cuộn xuống phần "Mã Nhúng". Sao chép mã nhúng duy nhất của bạn sẽ trông như thế này:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></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: Sử dụng Trình tạo Trang (Khuyến nghị)

Cách dễ nhất để thêm chatbot là sử dụng khối HTML Code của Trình tạo Trang:

Đăng nhập vào Bảng Quản trị Magento
Đi đến Content → Pages
Chỉnh sửa trang Chủ (hoặc bất kỳ trang nào bạn muốn chatbot)
Trong Trình tạo Trang, kéo phần tử "HTML Code" vào trang
Dán mã nhúng Asyntai của bạn
Nhấp "Save"
Xóa bộ nhớ đệm: System → Cache Management → Flush Magento Cache

Quan trọng: Sử dụng Trình tạo Trang chỉ thêm mã vào từng trang. Để cài đặt toàn trang, sử dụng phương pháp Layout XML bên dưới.

Thay thế: Sử dụng Layout XML (Tất cả Trang)

To add the chatbot to all pages, create a layout file in your theme:

Điều hướng đến thư mục giao diện: app/design/frontend/[Vendor]/[theme]/
Tạo cấu trúc thư mục nếu chưa tồn tại: Magento_Theme/layout/
Tạo hoặc chỉnh sửa tệp default_head_blocks.xml
Thêm mã sau:
<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <script src="https://asyntai.com/static/js/chat-widget.js" src_type="url" async="true" data-asyntai-id="YOUR_WIDGET_ID"/> </head> </page>
Thay thế YOUR_WIDGET_ID bằng ID tiện ích thực tế của bạn
Chạy: bin/magento cache:flush
Chạy: bin/magento setup:static-content:deploy -f (nếu ở chế độ sản xuất)

Thay thế: Sử dụng Khối CMS

Bạn cũng có thể tạo khối CMS và bao gồm nó trong chân trang:

Đi đến Content → Blocks
Nhấp "Add New Block"
Đặt tiêu đề như "Asyntai Chatbot"
Đặt Identifier thành asyntai_chatbot
In the content editor, switch to HTML mode and paste your embed code
Nhấp "Save Block"
Thêm khối vào mẫu chân trang bằng cách sử dụng: {{block id="asyntai_chatbot"}}
Xóa bộ nhớ đệm

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

Sau khi lưu thay đổi và xóa bộ nhớ đệm, truy cập cửa hàng 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 trò chuyện ở góc dưới bên phải. Nhấp vào nó để đảm bảo nó mở và hoạt động chính xác.