AI Growth Widget 讓你可以在網站加入可自訂的對話小工具，讓訪客與你的業務互動，並透過支援的訊息頻道與你聯絡。
本指南將逐步介紹如何建立及設定 AI Growth Widget，包括品牌設定、互動設定、安裝至網站，以及確認小工具是否正常運作。完成設定後，你的 AI Growth Widget 即可正式啟用並與訪客互動。
開始前
建立 AI Growth Widget 前，請注意以下事項：
- 系統會在你設定期間自動儲存進度，因此你可以隨時離開並返回繼續設定，而不會遺失變更。
- 設定期間會提供即時預覽，讓你查看 AI Growth Widget 在網站上的顯示及運作方式。
- 你可以隨時切換不同設定步驟。系統會在完成整個設定流程時進行最終檢查。
注意：
- 所有變更都會自動儲存為草稿。
- 當你調整設定時，預覽內容亦會即時更新。
前往 AI Growth Widget 設定頁面
你可以按照以下步驟前往 AI Growth Widget 設定頁面：
- 點擊左側導覽列的
圖示，前往頻道頁面。 - 在頻道頁面的左側面板中，點擊 AI Growth Widget。
- 系統會將你重新導向至 AI Growth Widget 首頁。
- 點擊「開始設定」以建立你的 AI Growth Widget。
繼續設定草稿中的 AI Growth Widget
如果你之前已開始設定 AI Growth Widget，但尚未完成，建立你的 AI Growth Widget頁面會顯示設定進度卡。
此進度卡會顯示：
- 目前的設定進度，例如「步驟 2：互動」
- 視覺化進度指示
- 完成剩餘設定所需的預計時間
如要從上次離開的位置繼續，點擊「繼續設定」。系統會將你帶回最後儲存的設定步驟。
步驟 1：品牌及基本設定
此步驟讓你自訂 AI Growth Widget 的外觀，以及訪客在網站上看到的顯示方式。你可以設定品牌識別、預設訊息及語言。
自訂品牌識別
在品牌識別下，你可以設定 AI Growth Widget 的視覺及顯示元素。這些設定會影響 AI Growth Widget 在網站上的外觀，以及你的業務在對話中的呈現方式。
-
公司標誌
- 上載代表你品牌的標誌。此標誌會顯示在 AI Growth Widget 的歡迎畫面，並用作對話中回覆者的頭像。
-
按鈕顏色
- 選擇 AI Growth Widget 按鈕及主要行動呼籲元素所使用的顏色，讓 AI Growth Widget 的外觀配合你的網站品牌。
- 點擊
圖示選擇顏色，或直接輸入 HEX 色碼。
-
訊息氣泡顏色
- 設定對話視窗內訊息氣泡的顏色。此設定會影響與訪客對話時訊息的顯示方式。
- 點擊圖示選擇顏色，或直接輸入 HEX 色碼。
-
即時對話顯示名稱
- 輸入顯示給訪客的 AI Growth Widget 標題。一般可使用公司或產品名稱，讓訪客清楚知道正在與誰對話。
-
發送者顯示名稱
- 設定對話中顯示的訊息發送者名稱。訪客會在透過 AI Growth Widget 發送的回覆中看到此名稱。
-
歡迎訊息
- 輸入訪客在未設定彈出訊息的頁面開始對話時所顯示的預設訊息。此訊息可為對話定下基調，並鼓勵訪客開始互動。
選擇 AI Growth Widget 顯示模式
在AI Growth Widget 顯示模式下，選擇 AI Growth Widget 在網站上的顯示及運作方式。此設定會決定訪客的主要互動體驗。
你可以選擇以下兩種顯示模式：
導覽模式
一個顯示於網站底部中央的浮動對話列。
- 展開後提供更專注的對話體驗
- 將背景調暗，讓訪客將注意力集中於對話
- 適合在訪客瀏覽網站期間主動促進互動
- 內置側邊欄，可查看 AI agent 分享的連結
當 AI agent 在回覆中加入連結時，側邊欄會自動開啟，並透過內置瀏覽器顯示第一個連結。如果回覆中包含多個連結，訪客可以使用側邊欄底部切換不同連結、點擊對話中的連結更新側邊欄內容，或在新的瀏覽器分頁開啟頁面。
這讓訪客可以繼續瀏覽產品頁面、文章或表單，無需離開你的網站或中斷對話。
💡 最適合：產品探索及引導式互動
注意：
導覽模式設有內置側邊欄，會自動顯示 AI 回覆中的連結，讓訪客無需離開對話即可瀏覽內容。
支援模式
一個顯示於網站角落的傳統對話圖示。
- 點擊後開啟對話視窗
- 保持顯示，但不會干擾訪客的瀏覽體驗
- 適合以熟悉而簡單的方式提供支援
- 在訪客選擇開始對話前，網站內容會保持完整顯示
這讓訪客可以按照自己的節奏瀏覽網站，並在需要協助時才開始對話。
💡 最適合：持續提供支援及被動式互動
注意：
支援模式不設導覽模式所提供的內置側邊欄。
設定語言
在語言設定下，選擇 AI Growth Widget 支援的語言。這些設定會決定向訪客顯示哪個語言版本的 AI Growth Widget。
-
主要語言
- 選擇 AI Growth Widget 的預設語言。當訪客的瀏覽器語言不在支援範圍內時，系統會使用此語言。
- 點擊下拉式選單選擇語言。
-
其他語言
- 新增其他語言，為訪客提供本地化體驗。
- 點擊「新增」加入其他支援語言。
- 系統會根據訪客的瀏覽器設定顯示相符的支援語言。如果沒有相符語言，則會使用主要語言。
步驟 2：互動及頻道
在此步驟中，你可以設定訪客如何與 AI Growth Widget 互動，包括設定彈出訊息、決定是否收集訪客聯絡資料，以及選擇訪客可透過哪些外部訊息頻道與你的業務聯絡。
設定彈出訊息
在彈出訊息下，你可以建立一則簡短訊息，在網站上向訪客顯示，以打招呼並鼓勵他們開始對話。
-
訊息名稱
- 輸入名稱以方便識別此彈出訊息。此名稱只供內部參考，不會顯示給訪客。
-
訊息內容
- 輸入彈出訊息顯示給訪客的內容。訊息應簡短並具吸引力，最多可輸入 500 個字元。
-
顯示時間
- 選擇訪客進入頁面後，需要等待多久才顯示彈出訊息。
- 輸入秒數以設定延遲時間。例如，輸入 3，彈出訊息便會在訪客進入頁面 3 秒後顯示。
- 此延遲時間會套用至每次瀏覽已啟用彈出訊息的頁面。
設定「收集客戶資料」
如你希望訪客在開始對話前提供聯絡資料，可啟用收集客戶資料。
啟用後，訪客必須輸入所需資料，才可以繼續透過 AI Growth Widget 對話。
你可以選擇收集以下資料：
- 必須填寫電話號碼： 訪客必須輸入有效的電話號碼，才可以開始對話。
- 必須填寫電郵地址： 訪客必須輸入有效的電郵地址，才可以開始對話。
你可以根據需要啟用其中一項或同時啟用兩項。
注意：
如要根據收集到的聯絡資料觸發後續操作或自動化工作流程，請參閱透過 AI Growth Widget 收集聯絡表單，了解如何設定接收聯絡表單的觸發節點。
設定外部訊息頻道（選填）
外部訊息頻道讓訪客可以透過支援的訊息平台聯絡你的業務，而無需繼續在 AI Growth Widget 內對話。
只有已連接至你的 SleekFlow 工作空間的頻道，才可以啟用並顯示給訪客。
你可以為每個頻道：
- 選擇已連接的頻道帳戶（如適用）
- 開啟或關閉頻道，以控制是否在 AI Growth Widget 顯示
啟用後，這些頻道會作為其他聯絡方式顯示於 AI Growth Widget，讓訪客選擇希望透過哪種方式與你的業務聯絡。
注意：
如頻道尚未連接，便無法啟用，亦不會顯示給訪客。
新增電話通話作為外部訊息頻道
你亦可以在 AI Growth Widget 加入直接聯絡電話，讓訪客只需點擊一下即可聯絡你的銷售或客戶支援團隊。
在電話通話下，設定以下內容：
- 電話號碼： 輸入完整的國際格式電話號碼，例如 +1 234 567 890。
訪客使用方式：
- 流動裝置： 點擊電話選項後，裝置會開啟內置撥號功能，並自動填入電話號碼。
- 桌面裝置： 點擊電話選項後，系統可能會開啟 FaceTime 等通話應用程式，或讓訪客查看電話號碼並自行撥打。
啟用後，電話通話頻道會與其他外部訊息頻道一同顯示於 AI Growth Widget 的聯絡我們部分。
注意：
如啟用電話通話頻道，必須輸入有效的電話號碼。
步驟 3：部署及安裝至網站
在此步驟中，你需要將 AI Growth Widget 安裝至網站，並在完成設定前確認其正常運作。
在網站安裝及部署 AI Growth Widget
按照畫面上的指示安裝 AI Growth Widget：
-
前往你的網站
- 登入你的網站平台並開啟程式碼編輯器。
-
插入程式碼片段
- 複製畫面上顯示的程式碼片段，並貼到網站程式碼中。
- 如只需在指定頁面顯示 AI Growth Widget，請將程式碼片段貼在該頁面的
</body>結束標籤之前。 - 如要在所有頁面顯示 AI Growth Widget，請將程式碼片段加入網站的全域頁首或頁尾。
-
儲存並重新整理網站
- 儲存變更並重新整理網站。AI Growth Widget 應會顯示於網站上。
-
測試 AI Growth Widget
- 透過 AI Growth Widget 發送測試訊息，以確認其已成功連接 SleekFlow。
需要更多協助？🚀
安裝 AI Growth Widget 可能需要進行技術設定。你可以將此工作交由開發人員處理，或參閱以下各平台的逐步教學：
驗證安裝
安裝 AI Growth Widget 後，請確認設定是否正確：
- 輸入已安裝 AI Growth Widget 的頁面網址。
- 點擊「驗證安裝」。
- 查看驗證結果。
如果驗證成功
- 系統會顯示 AI Growth Widget 已成功安裝的確認訊息。
- 點擊右下角的「完成」，完成設定並正式啟用 AI Growth Widget。
如果驗證失敗
- 系統會顯示無法驗證安裝的訊息。
- 查看系統提供的疑難排解指引，並確認：
- 程式碼片段已安裝在正確的頁面或網域
- 網站變更已發佈
- AI Growth Widget 程式碼並未受到內容安全政策或廣告攔截器封鎖
注意：
驗證功能會檢查你提供的網址是否可偵測到已啟用的 AI Growth Widget。