annai 數位客服 — 操作手冊

本手冊說明 2 種使用角色：訪客（顧客）與業主（您）。
下方各區塊整理了每個角色會用到的頁面、操作步驟與注意事項。

👤 訪客 🏪 業主後台 ❓ 常見問題
👤

訪客（您的顧客）

公開頁面

訪客不需要登入，從您分享的網址即可使用。

數位名片 https://annai.cc/c/isbl → 開啟示範
訪客打開您的名片時看到：頭像 / 品牌名 / 副標、儲存聯絡人 / 分享 / 複製連結 / QR Code 四個按鈕、致電 / 導航 / 聊天三個 CTA。 往下捲動會看到關於我、營業時間、地址、電話、社群連結、輪播圖、服務項目、相片牆、常見問題、行動按鈕等區塊（顯示與排序皆可在「數位名片」設定）。
  • 網址代碼可在【數位名片 → 名片設定】修改（如：isbl 改成 my-shop）
  • 支援把名片頁加到主畫面，變成獨立 icon
AI 聊天 Widget 右下角浮動按鈕
點右下角圓形圖示開啟客服視窗。AI（佳佳）會根據您的「公司資料」與「知識庫」回答。
  • 語音輸入（麥克風）— 商家在系統設定勾選後才會出現
  • 語音播報 TTS（喇叭） — 商家在系統設定勾選後才會出現
  • 即時翻譯（A→中圖示）— 付費版自動顯示，可切換多國語言
  • 語音通話（電話圖示）— 付費版顯示，按下後撥號音 + 後台跳出來電視窗
把 Widget 嵌入到自家網站 系統設定 → Widget 嵌入碼
複製【系統設定】最上方那行 <script src=...>，貼到您網站的 </body> 之前，即可在貴站任何頁面顯示客服 widget。
🏪

業主後台

需登入

登入網址：https://annai.cc/admin/login.html
建議從 annai 首頁使用 PWA 安裝提示，將後台加入手機或電腦主畫面。

對話管理 /admin/dashboard.html → 前往
最常用的頁面。左側是訪客對話列表，中間是訊息內容，右側是訪客資訊（裝置 / 來源頁 / 訪客 ID）。
  • 右上「來訊提示音 開」— 後台收到新訊息時的鈴聲（不是 widget 內的 TTS）
  • 右上「開啟推播」— 一次性允許瀏覽器推播後，即使分頁關閉也會跳通知（需先裝成 PWA 才穩定）
  • 右上「清空白對話」— 一鍵清掉沒訪客發言、只有 AI 歡迎詞的空對話
  • 每筆對話右上：「人工接管」轉真人模式、「關閉對話」結束、「刪除紀錄」徹底移除
  • 對話列表如果出現橘色「🙋 待接手」徽章 → AI 答不出來，請進去接手（同時系統會寄 email 到您信箱通知）
公司資料 /admin/company.html → 前往
AI 客服回答的重要依據。共 4 個分頁：
  • 基本資訊：公司名稱、副標、電話、信箱、行業類型、地址、公司簡介
  • 營業時間：每日時段（可單日設多時段 / 公休）
  • 服務項目：每項可上傳 200×200 圖片、名稱、價格、說明（可換行）
  • 常見問題：FAQ 問答對，AI 會優先參考
填越完整，AI 回答越精準。建議每項至少填 50 字以上。
知識庫 /admin/knowledge.html → 前往
上傳文件或網址匯入，讓 AI 學您家的資料。
  • 支援 PDF / Word / TXT 上傳
  • 「官網匯入」一鍵抓取整個官網內容（會自動爬取 ~50 個頁面）
  • 「測試知識庫搜尋」可立即試問題，看 AI 會引用哪些段落
  • 每份文件可「下載」、「重新索引」、「刪除」
免費版上限 3 份；基礎版 20 份；專業版 100 份；企業版無限。
預約管理 /admin/booking.html → 前往
設定營業時段後，數位名片頁會自動出現「立即預約」按鈕，訪客可直接線上預約。
  • 每時段長度（分鐘）、每時段容量（同時可接幾組）
  • 可預約 N 天內、最少提前小時數
  • 每週各日營業時段（支援多時段，例如午餐 + 晚餐分開）
  • 公休日（特定日期跳過）
  • 切「預約清單」tab 看所有預約
促銷活動 /admin/promotions.html → 前往
設定後，數位名片頁頂端會出現紫色 banner，附帶優惠碼供訪客一鍵複製。 點擊「+ 新增活動」可加入活動名稱、優惠碼、起訖時間、彈窗內容（圖片 + 說明）。
訪客觸發 /admin/triggers.html → 前往
自動行銷規則 — 訪客在頁面停留 N 秒、滾動到某位置、即將離開時，主動跳出客服訊息或優惠券，提升轉換率。
系統設定 /admin/settings.html → 前往
  • Widget 嵌入碼：複製貼到自家網站
  • Widget 外觀：顯示位置、視窗標題、歡迎訊息、聊天頭像
  • FAB 設計：圓形浮動按鈕的底座 / 圖示 / 色彩、自訂 label
  • 語音功能（付費版）：勾選後 widget 才會出現麥克風與喇叭按鈕
  • 網域限制：填寫白名單後，只有授權網域能呼叫您的客服
  • 客服管理：新增 / 移除客服帳號，並設定客服上線時間（人數依方案）
統計報表 /admin/reports.html → 前往
對話數 / 訊息數 / 人工接管次數 / 接管率四個關鍵指標。 每日對話量長條圖、訊息來源（訪客 vs AI）比例、CSAT 滿意度評分分布、客服績效（處理對話數、平均首應時間）。 右上可切「最近 7 / 30 / 90 天」。
訂閱方案 /admin/subscription.html → 前往
上方顯示目前訂閱（方案 / 月費 / 訂閱期間 / 用量條），下方四個方案卡可升級。
  • 升級會導向綠界付款頁，付款完成後系統自動開通
  • 需降回免費版請按目前訂閱的「取消訂閱」（不會立即停用，到期日後生效）
  • 方案差異：免費（100 對話 / 3 文件 / 1 客服）→ 基礎 NT$599（5000 / 20 / 2）→ 專業 NT$990（50000 / 100 / 3）→ 企業 NT$1999（無限 / 無限 / 5）
數位名片管理 /admin/card.html → 前往
設定您要分享給顧客的名片頁外觀。共 8 個 tab：
  • 名片設定：網址代碼、頭像（200×200）、封面圖（1200×400）、標籤
  • 社群連結：Facebook、Instagram、Line、YouTube 等
  • 外觀設定：主題色、背景色、字體、按鈕圓角
  • 輪播圖：上傳圖片 + 說明，最多 10 張
  • 相片牆：作品集 / 商品照，最多 20 張，支援多選上傳
  • 行動按鈕：頂部 CTA 按鈕（最多 4 個）
  • 區塊排序：拖曳調整各區塊出現順序、顯示與否
  • 數據分析：頁面瀏覽、點擊數、來源統計
點右上「預覽名片」開新分頁看顧客視角。
修改密碼 /admin/change-password.html → 前往
輸入目前密碼 + 新密碼兩次即可。如果忘記密碼，請從登入頁點「忘記密碼？」，系統會寄重設信。
❓

常見問題

為什麼 widget 上沒有麥克風按鈕？

麥克風（STT）跟喇叭（TTS）要在【系統設定 → 語音功能】打勾，才會在訪客視窗出現。預設關閉，避免店家不知道而被收費。

推播為什麼收不到？

  1. 可從 annai 首頁的 PWA 安裝提示將後台加入主畫面
  2. 從桌面圖示開啟（不是用瀏覽器網址列）
  3. 後台右上「開啟推播」按鈕要點過一次，跳出權限請求時選「允許」
  4. iOS 要 16.4 以上版本才支援 PWA 推播
即使推播沒設好，AI 接不住的對話也會自動寄 email 到您的註冊信箱，不會錯過。

對話累積太多，怎麼整理？

對話列表右上「清空白對話」一鍵刪除沒訪客發言的對話（通常是訪客開窗就離開，AI 只說了歡迎詞）。 每筆對話也有「刪除紀錄」可徹底清除（不可復原）。

綠界付款怎麼運作？

在【訂閱方案】點「立即升級」會導向綠界付款頁。付款成功後，綠界會自動通知系統，訂閱即刻開通，無需人工介入。 同時您會在訂閱頁看到付款日期與訂單編號。

想換 widget 樣式怎麼辦？

到【系統設定 → Widget 外觀】調整位置 / 標題 / 歡迎訊息 / 聊天頭像；【FAB 設計】可換浮動按鈕的底座與圖示。 設定完點「儲存」即生效，訪客刷新網頁就會看到新版本。

客服人員可以同時登入幾個？

依方案：免費 1 位、基礎 2 位、專業 3 位、企業 5 位。多人可同時上線回覆，系統會記錄每位的處理對話數與首應時間，可在【統計報表】看績效。

數位名片網址可以改嗎？

可以。到【數位名片 → 名片設定 → 名片網址代碼】修改（如：isbl 改成 my-shop）。 注意：換代碼後舊網址會失效，已分享出去的 QR Code / 連結需重新產生。