您可以為聊天對話方塊套用許多 HTML 自訂設定。
HTML 聊天室元素選項
df-messenger 元素的子元素可以是下列任一元素：
df-messenger-chat：服務專員對話方塊一律處於開啟狀態df-messenger-chat-bubble：可透過開啟或關閉氣泡按鈕開啟或關閉服務專員對話方塊
df-messenger 的 HTML 自訂項目
df-messenger HTML 元素的屬性如下：
| 屬性 | 輸入政策 | 值 |
|---|---|---|
agent-id |
必填 | 與 Dialogflow 服務專員相關聯的 ID。 |
allow-feedback |
選用 | 將其設為 all，即可讓使用者針對服務機器人的回答提供意見回饋。 |
language-code |
必填 | 預設語言代碼。 |
project-id |
必填 | 代理程式的專案 ID。 |
location |
選用 | 服務專員的地區。預設值為 global。 |
intent |
選用 | 開啟即時通訊對話方塊時會叫用的自訂事件。您可以使用事件處理常式，這個常式會為此事件呼叫並產生第一個服務專員訊息。 |
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 |
選用 | 輸入欄位空白時，要顯示的文字。預設值為「Ask something…」。 |
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 相同的邏輯。如果指定，系統會在載入時執行初始 intent。 |