> For the complete documentation index, see [llms.txt](https://hotro.lovinbot.ai/wiki/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://hotro.lovinbot.ai/wiki/tinh-nang-chinh/ai-assistant/nhung-len-website.md).

# Nhúng Lên Website

{% hint style="warning" %}
Lưu ý: Mỗi lần điều chỉnh bạn cần bấm "Lưu" -> Sẽ cập nhật một mã nhúng mới -> Cập nhật lên Website/ Landing Page phiên bản mới nhất
{% endhint %}

### <mark style="color:blue;">Hướng dẫn nhúng AI Assistant lên website</mark>

{% @arcade/embed flowId="BX370VMhSA198JuigpJU" url="<https://app.arcade.software/share/BX370VMhSA198JuigpJU>" %}

***

### **Bước 1: Cài Đặt Thông Tin Chatbot**

#### **Logo Chatbot:**

Chọn biểu tượng hoặc logo đại diện cho chatbot của bạn. ( Kích thước 1:1)

<figure><img src="/files/czVFY54EpFKtEDYNusCF" alt=""><figcaption></figcaption></figure>

#### **Tên Chatbot:**

Ví dụ: **Bé Quê - Tư Vấn viên.**

**Mô Tả Chatbot (Không Bắt Buộc):**

Mô tả sẽ hiển thị với người dùng để giúp họ hiểu chức năng chatbot.

* *Ví dụ:*\
  \&#xNAN;*"Dạ chào anh/chị - Em là Bé Quê, rất vui được hỗ trợ mọi người về Quà Tết 2025 từ Vị Quê. Mình tìm quà cho doanh nghiệp, cá nhân ạ."*

<figure><img src="/files/bAZkhnAfcAAqn5oiZ9z8" alt=""><figcaption></figcaption></figure>

***

### **Bước 2: Tuỳ Chỉnh Màu Sắc Khung Chat**

* **Mã Màu Khung Chat:** Chọn màu phù hợp với thương hiệu hoặc trang web của bạn.
  * Gợi ý: Sử dụng mã màu hơi tối để tạo sự hài hòa, ví dụ: `#2971ff`.
* Nếu chưa hài lòng với màu sắc, bạn có thể quay lại điều chỉnh sau.

<figure><img src="/files/h6vtQ6Wro44i7conWBiD" alt=""><figcaption></figcaption></figure>

***

### **Bước 3: Tạo Văn Bản Giới Thiệu Chatbot**

<figure><img src="/files/3gD0K6TM8bfmtJatLMzA" alt=""><figcaption></figcaption></figure>

**Câu Giới Thiệu (Không Bắt Buộc):**\
Câu giới thiệu này sẽ xuất hiện trên logo chat khi người dùng truy cập vào website. Bạn có thể bỏ trống nếu không cần hiển thị.

***

### **Bước 4: Nhúng Chatbot Lên Website**

1. **Copy đoạn mã nhúng Chatbot (iFrame)** do AI Store cung cấp.
2. **Thêm mã nhúng vào mã HTML của trang web:**
   * Dán mã nhúng vào vị trí muốn hiển thị chatbot.
3. **Lưu và kiểm tra hiển thị:**
   * Đảm bảo chatbot hoạt động mượt mà và phù hợp với giao diện website.

***