Webflow

使用代理的 頻道 → 網站嵌入 → 聊天視窗 頁面複製完整的產生嵌入程式碼。它包含啟動指令碼與小工具指令碼，內含你的代理 ID 和目前的小工具 URL。請勿使用從舊範例複製的指令碼 URL。

Webflow 的自訂程式碼指南指出，網站或頁面自訂程式碼需要 Core、Growth、Agency 或 Freelancer Workspace，或是具有有效 Site 方案的網站。必須由 Site manager 或 Designer 加入。開始前請確認網站的方案與存取權限。

在整個網站加入小工具

1. 在 Agentkit 中，於 頻道 → 網站嵌入 啟用 聊天視窗，並複製兩個產生的 script 標籤。
2. 在 Webflow 中，開啟 Site settings → Custom code。
3. 將完整程式碼貼到 Footer code，放在結尾的 </body> 標籤之前。請勿在個別頁面再加入第二份。
4. 儲存變更，然後發布到你要測試的網域。
5. 開啟已發布的頁面，送出一個你已依核准來源核對過答案的問題。確認小工具載入且答案正確。

Footer code 套用於整個網站。Webflow 也允許在 Head code 放置指令碼，但其指南建議盡可能將指令碼放在 </body> 之前。請使用 Agentkit 產生的程式碼，而不要編輯其 URL 或 ID。一般嵌入檢查請參閱網站嵌入指南。

在單一頁面加入小工具

如果小工具只應出現在一個頁面，請勿將其加入 Site settings。在 Webflow Designer 中，開啟該頁面的 Page settings → Custom code → Before </body> tag，貼上兩個產生的 script 標籤，儲存並發布。Webflow 會在全站程式碼之後插入頁面程式碼，因此在兩處都加入相同的小工具會使其載入兩次。

測試已發布的網站

Webflow 指出自訂程式碼可在 Designer 預覽中執行，但變更在發布之前不會到達訪客。如果你的工作流程允許，請先測試已發布的 *.webflow.io 測試網域，再測試你打算使用的自訂網域。如果你設定了網域限制，請允許每一個你實際測試的網域。

如果小工具沒有出現，請檢查 Agentkit 中是否已啟用 聊天視窗、完整程式碼是否出現在已發布頁面的原始碼中、指令碼 URL 是否能在瀏覽器中載入，以及你是否發布了預期的 Webflow 網域。如果程式碼欄位無法使用，請依 Webflow 的目前存取規則檢查你的 Webflow Workspace 或 Site 方案以及你的角色。如果小工具出現但回覆失敗，請檢查代理的來源與網域限制。

若要在頁面區塊內顯示聊天面板而非浮動氣泡，請啟用獨立的 Iframe 頻道並依照 iframe 指南操作。