> For the complete documentation index, see [llms.txt](https://docs.maiagent.ai/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.maiagent.ai/build/choose-channel/web-chat/website.md).

# 串接對話平台：網站

串接網站對話平台：建立 Website 對話平台、設定名稱與 Agent、自動回覆與登入設定，取得網站嵌入碼。

## <mark style="color:blue;">一、進入設定頁面</mark> <a href="#navigate-to-settings" id="navigate-to-settings"></a>

### 1. 路徑一：新增網頁客服對話 <a href="#path-add-web-chat" id="path-add-web-chat"></a>

點擊左側選單 「 <mark style="color:blue;">客服對話 > 對話平台</mark>」 ，點選右上角的 「<mark style="color:blue;">＋串接對話平台</mark>」，選擇平台 「 <mark style="color:blue;">Website</mark> 」

<figure><img src="https://1593648278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fmzb5NG9GDzFP2YDKeYVl%2Fuploads%2Fgit-blob-b363369406b30ab309948bb844041f929a0d865b%2Fwebsite-channel-list-add.png?alt=media" alt="對話平台列表，右上角的「串接對話平台」按鈕以紅框標示"><figcaption><p>對話平台列表：點選右上角的「串接對話平台」</p></figcaption></figure>

<figure><img src="https://1593648278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fmzb5NG9GDzFP2YDKeYVl%2Fuploads%2Fgit-blob-8c14c3191ba03e76504cdd15fda7ba3e2491cabd%2Fwebsite-new-channel-select.png?alt=media" alt="串接對話平台的「選擇平台」步驟，Website 以紅框標示，旁邊還有 LINE、Messenger、Instagram 等平台"><figcaption><p>「選擇平台」步驟：選擇 Website</p></figcaption></figure>

### 2. 路徑二：Agent 關聯對話平台 <a href="#path-ai-agent-link-channel" id="path-ai-agent-link-channel"></a>

進入左側功能欄的 <mark style="color:blue;">AI 功能</mark> → <mark style="color:blue;">AI 助理</mark>，選擇要設定的 Agent，再切換到 <mark style="color:blue;">對話平台</mark>分頁。找到要調整的網頁對話平台後，點選 <mark style="color:blue;">平台設定</mark>。

<figure><img src="https://1593648278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fmzb5NG9GDzFP2YDKeYVl%2Fuploads%2Fgit-blob-5e4cbe8c4ddea1cd989636458fe4d4b495d9b6d9%2Fai-agent-channel-platform-settings-prod.png?alt=media" alt="Agent 的對話平台分頁，每張平台卡片都有平台設定按鈕"><figcaption><p>從 Agent 的對話平台分頁點選「平台設定」。</p></figcaption></figure>

完成設定後，點選頁面上方的 <mark style="color:blue;">返回 AI 助理設定</mark>，即可回到原 Agent 的 <mark style="color:blue;">對話平台</mark>分頁。在 <mark style="color:blue;">基本</mark>、<mark style="color:blue;">額度</mark>與 <mark style="color:blue;">自動回覆設定</mark>之間切換時，這個返回入口仍會保留。

<figure><img src="https://1593648278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fmzb5NG9GDzFP2YDKeYVl%2Fuploads%2Fgit-blob-23b4840e7805af70d9060e4db1f4166b1fc2020a%2Finbox-back-to-ai-agent-settings-prod.png?alt=media" alt="對話平台設定頁上方的返回 Agent 設定按鈕"><figcaption><p>設定完成後，可直接返回原本的 Agent 設定頁。</p></figcaption></figure>

{% hint style="info" %}
只有從 Agent 的 <mark style="color:blue;">對話平台</mark>分頁進入時，才會顯示 <mark style="color:blue;">返回 AI 助理設定</mark>。若是從左側選單的 <mark style="color:blue;">對話平台</mark>直接進入，頁面維持原本的導覽方式。
{% endhint %}

#### 使用情境：調整網站客服後回到 Agent <a href="#scenario-return-to-agent" id="scenario-return-to-agent"></a>

客服主管要為「產品諮詢助理」更新網站客服設定。她在這個 Agent 的 <mark style="color:blue;">對話平台</mark>分頁點選 <mark style="color:blue;">平台設定</mark>，完成調整後點選 <mark style="color:blue;">返回 AI 助理設定</mark>，回到同一個 Agent 的對話平台清單，繼續檢查其他客服入口，不需要再從 Agent 清單重新尋找。

### 3. 路徑三：對話平台操作 <a href="#path-channel-management" id="path-channel-management"></a>

左側功能欄中的 「 <mark style="color:blue;">客服對話 > 對話平台</mark> 」，找到您想要設定的對話平台，點選該列 「 <mark style="color:blue;">操作</mark> 」 欄的 <mark style="color:blue;">編輯</mark> 圖示即可進入對話平台配置。

<figure><img src="https://1593648278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fmzb5NG9GDzFP2YDKeYVl%2Fuploads%2Fgit-blob-2c01ec9accadb8f7ca338ef2b14162e7bdbfbb8a%2Fwebsite-channel-list-actions.png?alt=media" alt="對話平台列表，第一列「操作」欄的編輯、分析、刪除圖示以紅框標示"><figcaption><p>「操作」欄的第一個圖示為「編輯」</p></figcaption></figure>

## <mark style="color:blue;">二、基本設定</mark> <a href="#basic-settings" id="basic-settings"></a>

「基本」分頁裡「一般」群組的五個分類，各有專頁詳細說明：

### 1. 基本設定 <a href="#general-settings" id="general-settings"></a>

平台名稱、Agent、返回地址、自訂域名、允許嵌入的網域、公開訪問 URL 與三種嵌入方式，請見[基本設定](/build/conversation-settings/platform-settings/basic-settings.md)。

#### 允許嵌入的網域 <a href="#allowed-embed-origins" id="allowed-embed-origins"></a>

嵌入白名單的運作方式、設定步驟與啟用前檢查清單，請見[基本設定：允許嵌入的網域](/build/conversation-settings/platform-settings/basic-settings.md#allowed-embed-origins)。

### 2. 外觀設定 <a href="#appearance-settings" id="appearance-settings"></a>

Logo、大頭貼、顯示設定與淺色／深色主題配色，請見[外觀設定](/build/conversation-settings/platform-settings/appearance-settings.md)。

### 3. 功能設定 <a href="#feature-settings" id="feature-settings"></a>

是否啟用、允許上傳檔案、引用文件、OCR、提問集選項顯示模式與 AI 感知設定，請見[功能設定](/build/conversation-settings/platform-settings/function-settings.md)；工具顯示模式在[回覆等待樣式](/build/conversation-settings/platform-settings/loading-display.md#narrative-tool-display)設定。

### 4. 互動設定 <a href="#interaction-settings" id="interaction-settings"></a>

開場白、對話開始問題、開場白選項納入 Agent 上下文、對話顯示設定、滿意度問卷與額度用完提示訊息，請見[互動設定](/build/conversation-settings/platform-settings/interaction-settings.md)。

#### 開場白選項納入 Agent 上下文 <a href="#include-greeting-in-context" id="include-greeting-in-context"></a>

開啟前後差異、適用情境與注意事項，請見[互動設定：開場白選項納入 Agent 上下文](/build/conversation-settings/platform-settings/interaction-settings.md#include-greeting-in-context)。

### 5. 登入設定 <a href="#login-settings" id="login-settings"></a>

**設定 SSO 登入來源**

* MaiAgent 目前支援透過 Keycloak 整合實現 SSO（Single Sign-On）服務
* 於 「 <mark style="color:blue;">登入來源</mark> 」 下拉選單中進行切換
* 開啟 「 <mark style="color:blue;">啟用登入功能</mark> 」 後，在 「 <mark style="color:blue;">登入來源</mark> 」 選擇身分驗證方式，例如 AD、MaiAgent 或 Keycloak；各方式說明見 [Web Chat：登入方式](/build/choose-channel/web-chat.md#login-methods)

<figure><img src="https://1593648278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fmzb5NG9GDzFP2YDKeYVl%2Fuploads%2Fgit-blob-315142127e60be714106184a853579214e465358%2Fwebsite-login-source.png?alt=media" alt="登入設定：啟用登入功能已開啟，登入來源下拉選單展開，選項為 AD、MaiAgent、Keycloak"><figcaption><p>開啟「啟用登入功能」後，從「登入來源」選擇身分驗證方式</p></figcaption></figure>

**嵌入端免登入對話**

若您把 Web Chat 嵌入自家網站，且使用者已在您的網站登入過，可開啟 「 <mark style="color:blue;">允許嵌入端以 Source ID 免登入對話</mark> 」 讓他們直接對話。設定方式與簽章串接說明請見 [以聯絡人 Source ID 免登入對話](/build/choose-channel/web-chat/source-id-access.md)。

**沿用 Keycloak 登入身分呼叫工具**

登入來源選擇 Keycloak 時，可開啟 「 <mark style="color:blue;">沿用 Keycloak 登入身份呼叫工具</mark> 」，讓 Agent 呼叫 MCP／API 工具時自動帶上訪客本人的 Keycloak 登入憑證。設定方式與注意事項請見 [沿用 Keycloak 登入身分呼叫工具](/build/choose-channel/web-chat.md#keycloak-token-passthrough)。

## <mark style="color:blue;">三、自動回覆設定</mark> <a href="#auto-reply-settings" id="auto-reply-settings"></a>

您可以在此設定機器人回覆時間段。

* 點選日期旁的開關鈕：選定一周中的哪幾天回覆。
* 設定時段：選定開始的時間與結束的時間。
* 新增時段：如果有多個時段要設定，可按下 「 <mark style="color:blue;">+新增時段</mark> 」 來新增，並設定時段。
* 設定完成後按 <mark style="color:blue;">更新</mark> 儲存。

<figure><img src="https://1593648278-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2Fmzb5NG9GDzFP2YDKeYVl%2Fuploads%2Fgit-blob-573a60f91909a7ed0d8b9ad2abaa3fc28abc1033%2Fwebsite-auto-reply-settings.png?alt=media" alt="自動回覆設定分頁：週一到週日各有開關、時段 00:00 到 00:00 與「新增時段」，右下角為「更新」按鈕"><figcaption><p>「自動回覆設定」分頁：逐日設定開關與回覆時段</p></figcaption></figure>

自動回覆時段是每個對話平台各自的設定，LINE、Messenger、Instagram 等通訊軟體的對話平台也在同一個分頁設定。新建立的對話平台預設七天全天自動回覆，對話平台列表的 <mark style="color:blue;">自動回覆時段</mark> 欄顯示「24 小時回覆」。

### 時段外會怎樣 <a href="#outside-auto-reply-hours" id="outside-auto-reply-hours"></a>

時段只決定 AI 要不要自動回覆，客服人員隨時都能回覆。時段外收到的訊息，若對話還沒有客服負責、沒在排隊等真人，且對話的自動回覆仍開著：

* **AI 不回覆**：訊息照常進到 <mark style="color:blue;">所有對話</mark>，但 Agent 不會回答。
* **不會轉真人、不會送離線訊息**：轉真人是在 AI 處理訊息時才判斷，時段外不會觸發，所以不會自動派給客服，[客服轉真人設定：服務時間](/build/conversation-settings/human-handoff.md#service-hours) 的 <mark style="color:blue;">離線訊息</mark> 也不會送出。
* **對話留在「未指派」等客服接手**：對話狀態列顯示「非 AI 回覆時段・待客服處理」，對話清單上標示待客服處理的圖示（滑過提示「非 AI 回覆時段，AI 不會回覆，需客服處理」）。客服可按 <mark style="color:blue;">我來接手</mark> 或 <mark style="color:blue;">指派客服</mark>，見 [真人客服接手與回覆：未指派的對話](/serve/daily-operations/human-handoff-operations.md#unassigned-queue)。

已經有客服負責的對話，時段外收到的訊息照樣留在負責客服名下；正在排隊等真人的對話也維持排隊狀態，不會改成「未指派」。

例如一個 LINE 對話平台設定平日 09:00–18:00 自動回覆。客人週六早上傳訊問營業時間，Agent 不會回答，這則對話出現在 <mark style="color:blue;">未指派</mark>，狀態列顯示「非 AI 回覆時段・待客服處理」。值班客服看到後按 <mark style="color:blue;">我來接手</mark> 回覆。週一 09:00 之後，其他新進的對話照常由 Agent 回覆；這則已被客服接手的對話則要等客服按 <mark style="color:blue;">解決</mark> 或 <mark style="color:blue;">轉回 AI Agent</mark> 之後，Agent 才會再回覆。

{% hint style="info" %}
透過 [API](https://docs.maiagent.ai/api) 直接呼叫 Agent 的對話不受自動回覆時段限制。
{% endhint %}

### 使用情境：只用真人客服、不開 AI <a href="#human-only-mode" id="human-only-mode"></a>

想先讓客服人員在 MaiAgent 回覆客人、暫時不讓 AI 回答時（例如剛從其他客服系統搬過來），把這個對話平台的自動回覆時段七天全關：

1. 進入對話平台的 <mark style="color:blue;">自動回覆設定</mark> 分頁
2. 把週一到週日的開關都關閉
3. 按 <mark style="color:blue;">更新</mark>

還沒建立對話平台的話，建立時 <mark style="color:blue;">AI 助理</mark> 可以先不選，建立後再關閉時段，從建立那一刻起 AI 就不會回覆（LINE 對話平台建立的當下就會切換 Webhook，見 [從其他後台搬到 MaiAgent](/build/choose-channel/line.md#migrate-from-other-line-service)）。

儲存後，對話平台列表的 <mark style="color:blue;">自動回覆時段</mark> 欄顯示「-」，之後每則進線都依[時段外](#outside-auto-reply-hours)的方式處理：

* **不會自動派工**：每則新對話都留在 <mark style="color:blue;">未指派</mark>，請安排客服人員定期查看，在對話中按 <mark style="color:blue;">我來接手</mark> 後回覆，或用 <mark style="color:blue;">指派客服</mark> 交給特定同事。
* **狀態列顯示「非 AI 回覆時段・待客服處理」**：代表 AI 不會回、需要有人處理，不會標成 AI 處理中。
* **之後要開 AI**：回到 <mark style="color:blue;">自動回覆設定</mark> 打開需要的日期與時段並按 <mark style="color:blue;">更新</mark> 即可，對話平台需已選擇 AI 助理。新進的對話會由 Agent 回覆；已被客服接手的對話維持由客服負責，客服按 <mark style="color:blue;">解決</mark> 或 <mark style="color:blue;">轉回 AI Agent</mark> 後才交回 Agent。

例如一家門市品牌把 LINE 官方帳號搬到 MaiAgent，AI 回答內容還在調整，先只讓客服回覆。建立 LINE 對話平台時 AI 助理先不選，建立後立刻把自動回覆時段七天全關。之後客人傳來的訊息都出現在 <mark style="color:blue;">未指派</mark>，客服按 <mark style="color:blue;">我來接手</mark> 後回覆。兩週後 AI 調整完成，在對話平台選好 AI 助理、打開平日的自動回覆時段，之後新進的對話就由 Agent 回覆。

{% hint style="warning" %}
自動回覆時段只管 MaiAgent 的 AI。LINE 官方帳號的自動回應訊息、Meta Business Suite 的離線自動回覆訊息等平台原生自動回覆不受影響，要到該平台的後台關閉，見 [收到 LINE 的自動回應訊息](/build/choose-channel/line.md#line-auto-response)、[FB Messenger：客人還收到自動訊息](/build/choose-channel/fb.md#faq-meta-auto-reply)。
{% endhint %}


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation by asking a question.

Perform an HTTP GET request on the following URL with the `ask` and `goal` query parameters:

```
GET https://docs.maiagent.ai/build/choose-channel/web-chat/website.md?ask=<question>&goal=<user_goal>
```

`ask` is the immediate question: it should be specific, self-contained, and written in natural language.
`goal` is what the user is ultimately trying to achieve, the reason they need the answer. Sharing it helps GitBook give you a better, more relevant answer. A goal is most helpful when it describes the outcome the user wants rather than restating the question. For example, with `ask=how do I create an API token`, a goal like `automate deployments from our CI pipeline` lets GitBook tailor the answer to that use case.

The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.