Widget API

供開發者使用，或適合任何想從自己的按鈕開啟聊天的人。

安裝中

<script src="https://keyda.in/business/widget.js"
        data-key="kb_live_your_key_here" async></script>

script 標籤只需要 src 與 data-key。其餘所有設定——顏色、位置、問候語、語言——都來自您的儀表板，因此您永遠不需要為了變更這些設定而重新部署網站。

小工具會以安裝 → 您的機器人所使用的語言中設定的語言顯示：包含按鈕、輸入提示、通知，以及版面配置的方向（阿拉伯文與烏爾都文為由右至左）。這些字串會隨小工具設定一併送達，因此不會有第二次請求，您這邊也無需進行任何翻譯。

模式

懸浮（預設）。 位於角落的啟動按鈕，點擊後會開啟聊天面板。

內嵌模式。 在頁面上放置一個空的容器，聊天視窗就會填滿該區域：

<div data-keyda-bot style="height:520px"></div>

容器需要設定高度。在內嵌模式下，對話視窗隨時可見，因此沒有開啟或關閉的問題。

JavaScript API

指令碼載入後即可在 window.KeydaBot 上使用：

範例 — 從您自己的「聯絡我們」按鈕開啟對話：

<button onclick="KeydaBot.open()">Chat with us</button>

它在您的頁面上的行為表現

• 面板會開啟在啟動按鈕的 上方，該按鈕會固定在原處並變更為關閉控制項。再次點擊它、點擊標題中的 ✕，或按下 Escape 鍵即可關閉對話。
• 訪客可以從標頭展開面板——它會擴展至視窗高度且最大寬度為 760px——且瀏覽器會記住此選擇。在手機上，面板預設即為全螢幕，因此不會顯示該控制項。
• 您的標誌大小設定變更的是標誌，而非按鈕：啟動器會維持原本的大小，標誌則會在其中放大。按鈕大小（安裝 → 外觀）才是用來調整按鈕本身大小的設定——不論其形狀為小、中或大。
• 四種按鈕形狀：帶有您標籤文字的藥丸形、圓形泡泡、圓角方形，以及帶尾巴的聊天泡泡。尾巴會朝向您的頁面那一側。
• 所有內容都在 shadow root 內渲染，因此您的 CSS 無法破壞小工具，小工具的 CSS 也無法影響您的網站。
• 面板只有在訪客開啟時才會載入，因此不會拖慢您的網頁速度。
• 如果訪客再次回來，對話會在 24 小時內繼續，之後才會重新開始。重新開啟面板會還原原本的對話串——包括檔案，以及尚未回答的歡迎流程問題。
• 輸入框中的迴紋針圖示可讓訪客在一則訊息中最多附加三張照片或文件（檔案大小與類型詳見限制與安全性）。照片會先在瀏覽器中縮小尺寸才上傳，因此一張 1200 萬畫素的照片離開頁面時可能只有數百 KB。在安裝中關閉檔案功能後，該按鈕就會消失。
• 歡迎流程會以一般聊天泡泡的形式呈現：選項會變成泡泡下方的按鈕，當步驟為選填時會出現「跳過」按鈕，輸入框的提示文字則會變成該問題。已完成的流程會保存在訪客瀏覽器中 30 天。
• 如果無法連線至助理，小工具會顯示簡短訊息，絕不會在你的網頁中丟出錯誤。

應用程式 SDK 內

相同的聊天功能在每個 SDK 中皆可運作，因此附件與歡迎流程無需發布新版本即可套用到您的應用程式——但有一個例外。從網頁檢視中開啟檔案選取器是宿主應用程式的責任。iOS、React Native 與 Ionic 套件已支援此功能；Android 與 Flutter 則需要 SDK 0.1.4 以上版本。在較舊版本中，小工具會辨識所在的應用程式外殼並隱藏迴紋針圖示，而不是顯示一個按了也沒有反應的按鈕。