您可以對即時通訊對話方塊套用多項 HTML 自訂設定。
HTML 即時通訊元素選項
df-messenger 元素的子項元素可以是下列其中之一:
df-messenger-chat:代理對話方塊一律開啟。df-messenger-chat-bubble:可使用開啟或關閉對話框按鈕,開啟或關閉代理對話。
df-messenger 的 HTML 自訂項目
df-messenger HTML 元素包含下列屬性:
| 屬性 | 輸入政策 | 值 |
|---|---|---|
agent-id |
必填 | 與 Dialogflow CX 代理相關聯的代理 ID。 |
allow-feedback |
選用 | 設為 all,允許使用者對代理的回覆提供意見回饋。 |
language-code |
必填 | 預設語言代碼。 |
project-id |
必填 | 代理的專案 ID。 |
location |
選用 | 代理的區域。預設值為 global。 |
intent |
選用 | 開啟即時通訊對話方塊時,叫用的自訂事件。如果即時通訊一開始就開啟 (例如 df-messenger-chat 或 expanded/minimized df-messenger-chat-bubble),則會在載入網頁時觸發。您可以使用事件處理常式,在系統呼叫這個事件時,產生第一個代理訊息。 |
oauth-client-id |
選用 | OAuth 驗證的必要欄位。預設值為空值。如果未提供這個值,並啟用 Dialogflow CX Messenger 未經驗證的存取權,未經驗證的使用者就能與代理互動。如果提供這個值,代理對話方塊會顯示「要求驗證」疊加層,要求使用者先登入才能使用代理 (您可以使用 request-auth-text 屬性控制文字)。 |
storage-option |
選用 | 指定對話訊息的本機儲存空間。如果訊息不應儲存,請使用 none。使用 none 時,系統會在重新整理或重新載入頁面時清除所有訊息。預設為 sessionStorage。 |
session-ttl |
選用 | 設定工作階段的維持時間 (以秒為單位),必須小於 86400 (1 天),預設值為 1800 (30 分鐘)。 |
url-allowlist |
選用 | 允許從以逗號分隔的網址前置字元清單載入圖片。HTML 或 Markdown 回覆中使用的圖片網址,開頭必須是列出的前置字元之一。使用 * 允許所有網址。 |
max-query-length |
選用 | 定義文字查詢的長度上限。如果值為負數,則長度不受限制。預設值為 256。其他說明文件。 |
df-messenger-chat 的 HTML 自訂項目

df-messenger-chat HTML 元素包含下列屬性:
| 屬性 | 輸入政策 | 值 |
|---|---|---|
chat-title |
選用 | 聊天方塊的標題。顯示在即時通訊方塊頂端。 |
chat-subtitle |
選用 | 聊天方塊的副標題。顯示在chat-title下方。 |
chat-title-icon |
選用 | 對話方塊標題中顯示的圖示。預設顯示在即時通訊方塊上方、chat-title 左側。 |
bot-writing-text |
選用 | 代理撰寫內容時顯示的文字。 |
bot-writing-image |
選用 | 代理撰寫內容時顯示的圖片。優先順序高於 bot-writing-text。 |
request-auth-text |
選用 | 需要驗證時顯示的按鈕文字。 |
placeholder-text |
選用 | 輸入欄位空白時要顯示的文字。預設為「提出問題…」。 |
bot-actor-image |
選用 | 代理演員圖片的來源。顯示在每組代理回覆中。 |
user-actor-image |
選用 | 使用者演員圖片的圖片來源。顯示在每則使用者訊息上。 |
df-messenger-chat-bubble 的 HTML 自訂項目

df-messenger-chat-bubble HTML 元素與 df-messenger-chat 具有相同屬性,以及下列額外屬性:
| 屬性 | 輸入政策 | 值 |
|---|---|---|
expanded |
選用 | 布林值,決定是否一開始就開啟即時通訊。如未設定,即時通訊會記住上次的狀態。 |
chat-icon |
選用 | 聊天泡泡圖示。必須是公開可用的 URI。 |
chat-close-icon |
選用 | 聊天泡泡的關閉圖示。必須是公開可用的 URI。 |
chat-collapse-icon |
選用 | 標題列中收合按鈕的圖示。必須是公開可用的 URI。 |
anchor |
選用 | 定義即時通訊對話方塊相對於開啟或關閉對話框的位置。值為兩個方向字詞 (top、bottom、left、right),以 - 分隔。預設值為 top-left。第一個方向定義錨定點,第二個方向定義遠離對話框的主要展開方向。例如:top-left 位於對話框上方,並向左和向上展開 (遠離對話框)。 |
chat-width |
選用 | 定義即時通訊視窗的寬度。數值 (以像素為單位)。預設為 320 像素。 |
chat-height |
選用 | 定義即時通訊視窗的高度。數值 (以像素為單位)。預設為 480 像素。 |
allow-fullscreen |
選用 | 定義是否能以全螢幕模式開啟即時通訊視窗。如果設為 always,則會在所有螢幕大小上以全螢幕模式開啟。如果設為 small,則在螢幕大小小於 500 像素時,會以全螢幕模式開啟,否則會以一般視窗開啟。可能會覆寫 chat-width、chat-height 和 anchor (如有設定)。 |
minimized |
選用 | 決定即時通訊一開始是否以最小化形式開啟。使用與 anchor 相同的邏輯。如已指定,這項屬性的優先順序會高於 expanded。這也會在載入時觸發初始 intent。 |