跳至主要內容

如何在您的網站上安裝 AI 代理程式

摘要

透過從您的 Astra Dashboard 複製程式碼片段並將其貼到您網站的 HTML 中,即可在幾個步驟內將 Astra 安裝在任何網站上,安裝完成後,您可以選擇 Astra 的顯示方式 — 作為聊天小工具、聚光燈檢視,或包含選用的魔法螢光筆功能。

說明

請依照以下步驟將 Astra 安裝到您的網站:

步驟 1:取得您的安裝程式碼

  • 登入您的 Astra 帳戶:https://astra.wati.io

  • 前往「Agents」(代理人),選擇一個要編輯的代理人,或點擊以建立新代理人。

  • 前往 Build My Agent(建立我的代理人),然後點擊設定按鈕以取得程式碼。

  • 選擇 Copy code(複製程式碼)以複製您的安裝程式碼。

步驟 2:將程式碼新增到您的網站

找出您網站類型的正確檔案,並將程式碼貼在 </body> 結束標籤之前。

  • 一般 HTML 網站:將程式碼新增到您的主要 HTML 檔案(通常是 public_html 資料夾內的 index.html)。

  • React.js:開啟 public/index.html 檔案,並將程式碼貼在 </body> 結束標籤之前。

  • Next.js:在 pages 資料夾中建立一個 _document.js 檔案,然後在 </body> 結束標籤之前包含該指令碼。

  • 其他網站:尋找管理 HTML 的檔案,並將程式碼貼在 </body> 結束標籤之前。

看起來會像這樣:

<!-- 您現有的 HTML 程式碼在此 --> 
<!-- 在此貼上 Astra 程式碼 -->
</body>

步驟 3:儲存並驗證

  1. 儲存您的變更,並視需要進行部署。

  2. 重新整理您的網站 — 您現在應該會看到 Astra 小工具出現。

部署選項

安裝 Astra 後,它可以在您網站上以不同的方式顯示。您也可以啟用 魔法螢光筆 功能以獲得互動式體驗。

1. 小工具(右下角聊天泡泡)

  • 顯示為網頁右下角的聊天泡泡。

  • 使用您的品牌圖示以實現個人化外觀。

  • 顯示建議的對話開頭,例如常見問題。

  • 訪客可以點擊問題,AI 代理人會直接回應。

2. 聚光燈(底部中央聊天檢視)

  • 顯示為螢幕底部中央的聚光燈風格聊天視窗。

  • 訪客可以選擇一個問題,AI 代理人將提供答案。

3. 魔法螢光筆

  • 讓訪客可以透過反白顯示網站上的任何文字來提問。

  • 例如,如果有人反白了「搜尋引擎優化」並點擊 Ask Astra(詢問 Astra)(或 Ask Agent(詢問代理人)),AI 代理人將會生成並回答該問題。

  • 此功能會掃描您整個網站的知識庫,以提供最相關的回應。

注意事項:如果您不想使用魔法螢光筆,可以透過導覽至 Agents > Select an Agent(代理人 > 選擇代理人)- 前往 Build My Agent > Branding(建立我的代理人 > 品牌),然後關閉 Magic highlighter(魔法螢光筆)切換開關來停用它。

選擇正確的選項

  • 您可以根據您網站的設計和訪客體驗偏好,在 小工具聚光燈 之間進行選擇。

  • 兩種都可以使用您先前複製的安裝程式碼進行部署。

  • 魔法螢光筆 可以與任一選項一起啟用,以實現更具互動性的瀏覽。

是否回答了您的問題?