您可以將企業知識提供給Agent、設定回覆方式,再透過外掛或提供的指令碼安裝聊天小工具,在網站加入AI聊天機器人。Quickchat AI網站聊天機器人將知識、對話設定與團隊Inbox集中管理。訪客無須建立帳號,即可在您的網站提問。
本教學以虛構的廚房設計公司Kestrel Kitchens為例。訪客先詢問翻修需要多久,再了解3公尺乘4公尺廚房的大致費用,最後提出報價需求。Agent根據公司資訊回答、收集專案詳情,並讓設計師接續對話。
完成後的網站體驗。Kestrel Kitchens及其企業資訊皆為虛構;小工具與回覆則透過實際的本機應用程式運作。
核心設定無須寫程式。依序完成知識與指示、潛在客戶資料收集與轉接人工,再安裝小工具。選用的API Action可將完整需求傳送至其他系統。
下載Kestrel Kitchens設定套件,取得範例網站、知識、Main Prompt、設定與測試訊息。這些可編輯檔案供您在管理介面依照步驟設定,並非一鍵匯入Agent的檔案。截圖及可複製的套件、提示詞與設定內容保留英文,以便重現經過測試的範例。
網站聊天機器人能做什麼?
聊天機器人會根據您的內容回答問題、儲存訪客希望後續聯絡的需求詳情,並在需要人工協助時將對話轉交團隊。
這些成果需要不同的驗證依據。正確的價格範圍來自Knowledge Base。報價需求需要在Inbox中留下聯絡方式與專案詳情。轉接人工則需要工作人員接管對話,並傳送訪客實際收到的回覆。
範例中的訪客流程。報價需求代表訪客表達興趣;價格與可安排時段仍由設計師確認。
| 訪客的問題 | Agent的工作 | 應檢查的項目 |
|---|---|---|
| 翻修需要多久? | 說明已公布的設計與安裝所需時間 | 回覆保留這些時程的適用條件 |
| 3公尺乘4公尺的廚房要多少錢? | 提供參考範圍,並說明現場勘查能確認哪些事項 | 不編造固定報價或每平方公尺單價 |
| 可以申請報價嗎? | 收集姓名、電子郵件、郵遞區號與專案類型 | 這些欄位出現在對話的已儲存資料中 |
| 有提供融資嗎? | 坦言提供的知識並未說明 | 不編造融資方案 |
| 可以和設計師聊聊嗎? | 在有人值班的時段使用Human Handoff | 設計師可從Inbox回覆,且訪客實際收到訊息 |
加入聊天機器人前需要準備什麼?
您需要Quickchat AI帳號、可驗證的企業資訊,以及網站外掛或自訂程式碼設定的存取權限。
- 建立Quickchat AI帳號並完成註冊步驟。請為本練習使用獨立Agent,以免範例資訊影響既有的客戶服務。
- 準備服務頁面、FAQ與政策,或使用套件中的虛構知識。為真實企業部署前,請替換虛構的價格與服務區域。
- 確認您的網站方案允許使用對應的安裝方式。WordPress需要外掛存取權限;部分託管式網站建置工具需要付費方案,才能加入全站自訂程式碼。
- 測試轉接人工時,安排人員查看測試用Inbox。另備妥桌面瀏覽器與手機,供最後的網站檢查使用。
Free適用於個人、非商業學習。Free方案每月包含50點AI額度。企業部署需要商業方案,測試也會使用與其他AI對話相同的回覆額度。網站建置工具的訂閱與外部API費用另計。費用章節會區分這些成本。
步驟1:如何以網站內容訓練聊天機器人?
將包含企業問題答案的頁面加入Knowledge Base,並在測試前驗證匯入內容。這些內容會成為Agent回答時的參考資料。
建立學習用Agent
- 在初始設定畫面選擇Set up manually。若已在管理介面,請使用AI Agent旁的+(Add new AI Agent)建立獨立Agent,再選擇Set up manually。
- 在Identity的Name your AI Agent下輸入
Kestrel Kitchens。將套件中的main-prompt.txt貼入Describe what you want your agent to do。這會成為Agent的Main Prompt,詳見步驟2。選擇Next。 - 暫時將Knowledge Base留空,選擇Next。繼續通過External apps,不選擇連線。在Deployment選擇Chat widget,再選擇Next。
- 在Choose your plan使用Skip for now繼續個人學習練習,或為企業用途選擇合適的商業方案。接著完成或關閉畫面中顯示的選用優惠。
- 在管理介面的Identity確認Agent名稱,再開啟Knowledge Base。選擇使用自己的頁面,或下方提供的範例文章。
Identity包含Agent名稱與Main Prompt。接下來的操作會使用Knowledge Base、Actions & MCPs與Your Website。
匯入自己的頁面
- 在Knowledge Base選擇Add Website。依需求選擇單一頁面或網站匯入選項。
- 輸入公開網址。若匯入網站,請檢查找到的頁面,選取應作為回答依據的服務、價格、流程與FAQ頁面。
- 檢查匯入的文字。確認價格使用正確幣別與稅務處理方式,且過期促銷或無關頁面未成為資料來源。
- 等待處理完成。測試已安裝的小工具前,請套用或發布管理介面中顯示的待處理知識變更。
先使用幾個內容清楚的頁面。網站可能在價格卡片呈現吸引人的價格,卻把限制條件放在其他地方;Agent需要兩者。只匯入首頁可能漏掉安裝條件、地理限制或退款政策,而這些資訊會影響回答是否實用。
使用Kestrel Kitchens資料來源
若要在尚未架設網站的情況下重現範例,可直接加入企業資訊:
- 在Knowledge Base選擇Add Article。這會建立Untitled文章並開啟Edit Article。
- 在Title輸入
Kestrel Kitchens: services, prices and process。在Content下選擇Plain Text,貼上套件中的knowledge.txt。 - 選擇Save,等待文章狀態變為Ready。確認其標題出現在Knowledge Base清單中。
Knowledge Base位於Agent導覽列。本範例只需一篇文章;若使用自己的已發布頁面,請選擇Add Website。
已儲存的文章保留價格與時程的適用條件。其虛構資訊與範例網站一致。
複製完整範例知識
Kestrel Kitchens is a fictional kitchen design and renovation business used in this tutorial. It serves Bristol, Bath and addresses within 25 miles of central Bristol.
Services: kitchen design, supply and full installation. A full kitchen renovation typically costs £18,000 to £45,000 including VAT. This is a planning range, not a quote. The final price depends on the survey, layout, cabinetry, appliances and building work. Room dimensions alone are not enough to calculate a firm price.
Timelines: survey and design normally take 2 to 3 weeks. Installation usually takes 4 to 8 weeks after all materials are available. These are typical durations, not a promised start date or completion date.
Process: discuss the project, arrange a site survey, agree the design and receive a written quote, then schedule work once the quote is accepted and materials are available. The chatbot cannot book a survey or confirm availability.
The design team works Monday to Friday, 09:00 to 17:00, Europe/London. Quote enquiries need the visitor's full name, email, postcode and project type. A preferred timeline is helpful but optional. The team follows up by email. Do not promise a response deadline.
資料來源刻意未說明融資事項,方便您測試Agent如何處理確實缺漏的資訊。對真實網站,請持續更新來源頁面,並在支援時使用重新整理設定;Knowledge Base指南說明如何整理與測試這些來源。
步驟2:聊天機器人應該說什麼,又絕不能承諾什麼?
使用Main Prompt定義Agent如何運用知識:先回答問題、讓回覆有用,並將確定報價等決策留給團隊。
對Kestrel而言,房間尺寸能說明專案規模,卻無法確定櫥櫃、家電或建築工程需求。Agent應說明來源中含VAT的£18,000至£45,000規劃預算範圍,不應根據地板面積計算更精確的價格。
這些價格是教學用的虛構資料。重點是保留來源事實與團隊仍需做出的決策之間的區別。
- 在Identity的Main Prompt卡片選擇Edit。
- 貼上下方完整提示詞。儲存後,重新開啟編輯器確認已儲存的文字。
- 將企業資訊保留在Knowledge Base。提示詞用來設定回覆風格、資料收集行為與需要人工決定的事項。
Main Prompt是指示欄位。下方及套件中的完整文字可直接複製使用。
複製完整Main Prompt
You are the website assistant for Kestrel Kitchens. Help visitors understand our services, indicative prices and process using the Knowledge Base.
Answer the visitor's question before asking for contact details. Keep replies concise, usually two to four sentences. Use the visitor's language.
Treat prices as planning ranges. Never calculate a firm quote from room dimensions, invent a discount, promise a start date, confirm a survey booking or claim financing is available. If the Knowledge Base does not answer a question, say that a designer must confirm it.
When a visitor wants a quote or follow-up, collect their full name, email, postcode and project type in conversation. Ask one or two relevant questions at a time. Ask about their preferred timeline only after the required details, and accept a refusal without pressure. Do not ask for payment information.
Offer Human Handoff when the visitor asks for a designer or needs information you cannot confirm. Respect the configured working hours. Never claim that a designer is connected or a quote is booked. If the team is unavailable, offer an email follow-up.
Acknowledge the details the visitor has provided. Do not claim CRM delivery or a confirmed booking. The design team reviews enquiries in the Inbox.
開啟AI Preview,詢問How long does a full kitchen renovation take?。本機對照測試中,Agent回答勘查與設計需2至3週,接著說明材料備齊後,安裝需4至8週。時間長度與適用條件都很重要。
開始新對話,詢問Do you offer financing?。正確回覆應承認來源無法確認有此方案,並請設計師回答。即使在提示詞中加入更肯定的措辭,也無法補足缺少的企業資訊。
有資料依據的回答,也保留材料必須備齊的條件。
確實缺漏的資訊。來源不含融資條款。
步驟3:如何在對話中收集報價需求?
Smart Data Gathering會在對話中詢問指定資訊,並儲存訪客提供的內容。針對報價需求,只收集設計師後續聯絡所需的資料。
在此啟用與編輯內建Actions。範例的Smart Data Gathering卡片名稱為Quote enquiries。
- 開啟Actions & MCPs,啟用Smart Data Gathering並選擇Edit Action。將Name設為
Quote enquiries,Description設為Capture contact and project details for a kitchen design enquiry.。儲存後的名稱會成為卡片標題。 - 在Data to collect下加入下表各列。重現範例時,請保留這些英文Data point名稱;聯絡資料名稱與Inbox訪客欄位之間有特定對應關係。
- 將Reason for collecting information設為
So a Kestrel Kitchens designer can assess your project and follow up by email.。 - 將When to ask for data設為After exchanging a few messages,How to ask for data設為Subtle。
- 儲存Action。在AI Preview先詢問一個有用的服務問題,再提出報價需求,並在Inbox檢查已儲存的資料。
| 資料欄位(Data point) | 要詢問的問題 | 格式或範例值 |
|---|---|---|
Full name | What is your full name? | Full name |
Email | What email can our designer use? | |
Postcode | What is the property postcode? | Text |
Project type | What kitchen work do you need? | Text |
Timeline | When would you like to start? | Text |
這些問題說明要收集的資訊。時機與風格設定引導Agent何時提問;也請測試實際對話。
姓名、電子郵件、郵遞區號與專案類型是本範例完整需求的必要資料。如Main Prompt所述,預計時程為選填。這項業務要求與對話式資料收集設定是兩回事;步驟8會在傳送CRM請求前強制檢查必要欄位。
Agent應回答一般費用問題,不得要求訪客先提供電子郵件才能取得答案。訪客也可以拒絕提供資料。使用I am only researching. I do not want to leave contact details.測試,確認對話仍有幫助,且不會反覆索取資料。
收集的資料會存到哪裡?
在Inbox開啟對話。標準聯絡資料會顯示在訪客欄位中;其他收集值則附在對話中,可透過Export Gathered Data匯出。
訪客在對話中提供聯絡方式與專案詳情。
已儲存欄位是資料成功收集的證據。請逐一比對訪客提供的值。
在Where to send data下,Email new leads會在首次收集到電子郵件或電話號碼時通知該Agent的每位管理員。只有姓名不會觸發郵件。Preview和Simulation不會傳送這些通知,因此在依賴郵件送達前,請以已安裝的小工具進行受控測試,確認自己的管理員信箱收到通知。本機教學操作保持停用外部郵件寄送。
Smart Data Gathering文件說明資料收集、通知與匯出。用於自己的網站時,請說明索取資訊的原因,並在小工具中連結隱私權聲明。聊天機器人資料保護指南有助於檢視整體資料流。
步驟4:如何讓人工接管對話?
Human Handoff將對話轉交團隊,再由工作人員在Inbox接管並回覆同一位訪客。
發布小工具前,先準備好轉接流程。要求聯絡設計師的訪客不應被迫先填完報價資料,Agent也不應在無人值班時暗示有人在線上。
- 在Actions & MCPs啟用Human Handoff,開啟Edit Action。
- 保持標準規則Media Message、User Frustration、Customer Support Suggestion與Lack Of Knowledge開啟;Irrelevant Advice保持關閉。Main Prompt已說明何時應提供設計師協助。經過測試的範例使用這些標準規則,未加入自訂規則。
- 設定下方訊息與服務時段,然後儲存。學習練習中請關閉Email notifications,直接在Inbox檢查轉接結果。
| 設定 | Kestrel Kitchens設定值 |
|---|---|
| Question | Would you like me to connect you with a kitchen designer? |
| Confirmation | I have passed your chat to our design team. A designer will reply here when available. |
| Human Agents’ availability | On |
| Your time zone | Europe/London |
| Working hours | Monday to Friday, 09:00 to 17:00 |
| Message outside working hours | Our design team is available Monday to Friday, 9am to 5pm UK time. Leave your name and email so a designer can follow up. |
請使用實際有人查看Inbox的時段。虛構的班表並不保證立即回覆。
在有人值班的時段,從網站詢問Can I speak to a designer?。完成Agent要求的轉接確認。在Inbox開啟對話;若尚未指派,選擇Assign to me,或在顯示Take over時選擇該控制項。傳送人工回覆,確認訪客收到訊息。需要讓AI恢復處理時,使用Reassign to AI。
Inbox集中顯示對話、接管控制項與訪客資料。回覆前先選取該訪客的對話。
請檢查對話由誰負責,以及人工回覆是否送達,而不只確認Agent提出了轉接。
同一次轉接在訪客端的畫面。Maya Patel是本機測試使用的虛構設計師。
在設定時段以外,使用新對話重測。Agent應說明服務時間,並提供已設定的後續聯絡方式。若為了測試暫時調整班表,請於測試後恢復實際時段。Human Handoff文件說明相關設定與Inbox流程。
聊天機器人轉人工操作教學分別檢查對話由誰負責、交回 AI 處理的流程,以及非工作時段的異常。
步驟5:如何讓小工具符合網站風格?
在Channels → Your Website設定外觀與固定文字。歡迎訊息應具體說明訪客可以詢問哪些事項。
三個分頁分別處理安裝、外觀與固定文字。Appearance也包含頭像與啟動按鈕標籤。
外觀設定
- 開啟Appearance。Kestrel使用Custom主題,背景為白色,標頭與強調色為深綠色(
#315448),標頭文字為白色。保留預設文字大小與圓角控制項。 - 在Branding → AI Agent Avatar點擊頭像的上傳圖示,選擇套件中的
website/kestrel-avatar.png,並在裁切對話框選擇Upload。 - 將Widget window max width設為400px,Widget window max height設為520px。啟動按鈕大小選擇Small,置於右側,並使用
Ask about your kitchen作為標籤。此標籤適用於小型啟動按鈕。預覽其位置,確認與網站上的Cookie橫幅或其他浮動控制項如何並存。 - 保持Auto-open Widget關閉。每次載入頁面就開啟小工具會打斷瀏覽,尤其是在手機上。
選擇顏色時檢查預覽。仍須在實際網站測試,因為啟動按鈕會與網站控制項共用畫面空間。
文字內容設定
開啟Text Content並使用下列設定值:
| 設定 | 設定值 |
|---|---|
| Header | Kestrel Kitchens |
| Welcome message | Hello, I can help with kitchen costs, timelines and quote enquiries. What are you planning? |
| Conversation starters | How long does a renovation take? / What does a kitchen cost? / Can I request a quote? |
| Disclaimer text | AI assistant. Prices are indicative. A designer confirms your quote after a survey. |
對話開場選項應引導有用的任務。免責聲明則告訴訪客哪些決定仍需設計師確認。
Agent可使用訪客的語言回覆。固定歡迎訊息與小工具標籤的翻譯是Other languages下的獨立設定,適用於付費方案。多語言網站應同時測試回覆與固定介面文字;多語言聊天機器人指南說明兩者的差異。
外觀變更可能需要幾分鐘才會反映在使用快取的訪客工作階段。請先重新載入,再判斷儲存的變更是否失敗。Hide Quickchat AI Branding需要Professional或以上方案;白牌設定教學說明其他需要檢查的位置。
步驟6:如何在網站安裝聊天機器人?
將Widget安裝在網站共用版型中,或使用支援的平台整合。浮動Widget必須在訪客正在瀏覽的頁面中執行。
- 開啟Channels → Your Website → Install。
- 啟用Widget & Embed access,供公開小工具使用。
- 選擇適合網站的安裝方式,複製此Agent顯示的程式碼片段或Scenario ID。
- 發布變更,開啟公開網站,並詢問一個您確定Knowledge Base中有答案的問題。
從此Agent的Install畫面複製。Scenario ID是公開的小工具識別碼,並非私密API金鑰。
一般網站:將Widget程式碼貼在body結束標籤前
選擇Install manually with code並複製Widget程式碼片段。目前載入器的格式如下:
<script>
(function(e,a,d,i,c,t=a.createElement(d)){e[c]=e[c]||function(){(e[c].q=e[c].q||[]).push(arguments)},t.src=i,t.async=1,a.body.insertAdjacentElement("beforeend",t)})(window,document,"script","https://bubble.quickchat.ai/chat.js","_quickchat");
_quickchat("init", "YOUR_SCENARIO_ID");
</script>
將YOUR_SCENARIO_ID替換為Install中的值。在共用版型中,將完整程式碼貼入一次,緊接在</body>之前,或使用建置工具的全站頁尾欄位。此載入器會將指令碼插入頁面body,因此若放在body尚未存在時的head中,可能無法載入。
放置位置很重要。以iframe為基礎的HTML區塊是獨立頁面,不適合此浮動Widget。
獨立的Embed選項會將聊天介面放入頁面容器。若需要內嵌聊天區段,請使用該選項產生的程式碼。直接將程式碼插入頁面的HTML區塊可支援此模式;將程式碼隔離在iframe中的建置工具區塊則是另一種情況。請參閱網站管道文件。
WordPress:安裝官方外掛
- 在WordPress開啟Plugins → Add New,搜尋Quickchat AI Agent,然後選擇Install Now與Activate。
- 開啟Settings → Quickchat AI Agent。
- 貼上Quickchat AI Install畫面的Scenario ID,選擇Save Changes。
- 開啟公開頁面檢查小工具。請在外掛與手動程式碼之間擇一,避免重複安裝載入器。
您需要允許安裝外掛的WordPress安裝環境與方案。WordPress聊天機器人指南展示外掛介面與WordPress專屬檢查項目。
Squarespace:使用頁尾程式碼注入
- 開啟網站的Code Injection面板。若帳號中的導覽位置不同,可使用管理介面的設定搜尋。
- 將完整Widget程式碼貼入Footer並儲存。
- 在另一個瀏覽器分頁開啟已發布的頁面,測試回答。
Squarespace在Core、Plus、Advanced及部分舊方案提供Code Injection。頁尾注入會在全站的</body>之前放入程式碼。浮動小工具應使用此位置;頁面層級的iframe區塊並不等同於此方式。這類自訂程式碼不適用於Squarespace結帳頁面。
Wix:在body末端加入自訂程式碼
- 在網站管理介面開啟Settings → Custom Code,再選擇+ Add Custom Code。
- 貼上Widget程式碼,命名為
Quickchat AI widget。 - 套用至All pages,選擇Body - end,再選擇Apply。
- 測試已發布的網站,也要測試切換到其他頁面的情況。
Wix的自訂程式碼要求網站已發布並連接網域。此浮動小工具應使用全站Custom Code設定。
Webflow:使用頁尾程式碼並發布
- 開啟Site settings → Custom code。
- 將Widget程式碼貼入Footer code,選擇Save changes。
- 使用Publish發布到指定網域,再測試該已發布網址。
Webflow的自訂程式碼設定需要符合資格的付費Workspace或有效的Site方案。只儲存設定不會將其發布。
Shopify:選擇既有Agent程式碼或Shopify應用程式
若要使用已建立的Kestrel Agent,請在Online Store → Themes → Edit code → layout/theme.liquid的</body>之前加入其Widget程式碼,再儲存並檢查店面。編輯前先備份主題,更換主題後重新檢查安裝。此方式會顯示您選定的Agent,不會設定商品或訂單Actions。
若需要以商店為主的Agent,Quickchat AI Shopify應用程式設定會透過獨立的初始設定流程連接商店。完成連線後,使用Enable Widget in Shopify Theme Editor,或開啟Online Store → Themes → Edit theme → App embeds。啟用Quickchat AI Widget並儲存。Shopify的應用程式嵌入文件說明主題控制項;切換已發布的主題後,請重新啟用應用程式嵌入。
上述建置工具的操作路徑已依官方文件核對。操作截圖展示Kestrel範例網站與實際本機小工具,並非各個建置工具中已登入帳號的截圖。
排查Agent前,先檢查程式碼片段
以下選用檢查會使用您提供的值:
- 檢查Widget程式碼片段。依您提供的Scenario ID檢查貼上的程式碼,不會擷取您的網站。
- 比較部署方式。將您填寫的管道、網站存取權限與所需功能,對照Quickchat AI的設定選項。這不會檢查您的網站或帳號。
在相容的瀏覽器中,這些檢查也可作為網站工具使用。連結會開啟標準表單。
步驟7:如何在訪客使用前測試聊天機器人?
分別測試回答、已儲存資料與回覆送達。AI Preview與Simulation Testing有助於評估行為;已發布的網站則用來確認訪客能使用已安裝的小工具。
在Simulation Testing中執行獨立問題
開啟Testing → Create Dataset,命名為Kestrel Kitchens: website launch checks,並選擇Paste messages。加入下方的時程、價格與融資問題,每個問題之間以單獨一行的---分隔。只有換行會讓文字仍屬於同一則測試訊息。設定Evaluation criteria以檢查事實與回覆是否簡潔,再選擇Run → Start Run。套件包含完全相同的訊息與評估標準。
資料集的每一列都會開始獨立對話。請用Simulation測試這些獨立問題;多輪報價與人工接管檢查則應在同一段AI Preview或網站對話中進行。另行檢查Action紀錄與接收端,因為對話紀錄評估器無法驗證外部送達。
開啟已完成的執行結果並檢查回覆。此價格回答保留規劃預算範圍;回覆分數無法證明已送達其他系統。
在Inbox中開啟同一項費用測試的對話。請檢查完整回答,包括為何單靠尺寸無法確定報價,不要只依賴分數。
| 測試訊息或順序 | 預期結果 | 檢查項目 |
|---|---|---|
How long does a full kitchen renovation take? | 勘查與設計需2至3週;材料備齊後安裝需4至8週 | 回覆與資料來源 |
How much would a 3 by 4 metre kitchen cost? | 參考範圍為含VAT的£18,000至£45,000;確定報價需要現場勘查 | 不編造固定價格 |
Do you offer financing? | Agent無法根據來源確認,並提供詢問設計師的方式 | 回覆,以及訪客要求時的轉接 |
Can I get a quote? My name is Sam Taylor. | 詢問缺少的資訊;尚不傳送完整需求Action | 已儲存姓名;CRM未收到資料 |
My email is sam@example.com. The postcode is BS6 7AB and it is a full kitchen renovation. | 儲存提供的電子郵件、郵遞區號與專案類型 | Inbox欄位;選用的Action紀錄與接收端 |
I have not decided when to start. | 接受時程尚未確定 | 不編造日期,也不強制要求時程 |
I am only researching. I do not want to leave contact details. | 繼續回答,不反覆要求提供資料 | 下一則有用的回覆 |
Can I speak to a designer? | 依設定走服務時段內或時段外的流程 | 對話負責人與人工回覆送達 |
¿Cuánto suele durar una reforma de cocina? | 使用西班牙語回答,保留相同時間範圍與條件 | 事實與語言皆需檢查 |
獨立案例之間請使用新對話。重新載入頁面可能會恢復既有對話,因此需要全新測試時,請使用小工具的新增對話控制項。
在手機上檢查網站
螢幕寬度低於768 CSS像素時,開啟的小工具會採全螢幕版型。確認您能開啟小工具、在鍵盤顯示時輸入、捲動對話,以及關閉小工具返回網站。
窄螢幕上開啟的小工具。此網站以瀏覽為主,請保持Auto-open關閉。
最後由真人從Inbox回覆。好的AI回答無法證明人工支援流程正常。變更來源、提示詞、Actions或網站主題後,請重測其中一小組檢查項目。
步驟8:如何將完整需求傳送至CRM?
選用的API Action可在對話具備所有必要資訊後,將已儲存欄位傳送至HTTP接收端。即使沒有這項擴充,核心網站聊天機器人也已可使用。
已收集聯絡資料與這筆需求已完整需要區分。Quickchat AI在新收集到標準聯絡欄位(包括姓名)時會設定lead_captured。單憑此旗標,無法確認電子郵件、郵遞區號或專案類型已存在。
平台會檢查每個條件。模型負責收集資訊;條件則決定請求何時符合執行資格。
準備接收端
使用您控制、可接受下方JSON本文的CRM或自動化端點。套件包含小型本機示範接收端,方便想在連接CRM前先檢查請求的讀者使用。其設定說明會建立私密權杖,並說明如何開放暫時的HTTPS端點。只可將虛構測試資料傳送至示範接收端。
若偏好受管理的整合,請依照Google Sheets報表教學或自訂CRM教學操作。不要同時開啟兩個會建立相同潛在客戶的工作流程。
設定一個自動API Action
- 開啟Actions & MCPs → Custom Actions → Add Action → API Action。若開啟以描述建立的建置工具,請選擇Create manually。
- 將API Action Name設為
Send quote enquiry。 - 將What to ask the user first留空。此Action讀取Smart Data Gathering已儲存的欄位,不會要求模型再填一組參數。
- 在API Endpoint選擇
POST,輸入接收端的HTTPS/enquiries網址。 - 加入下方標頭、本文與條件,再儲存並啟用Action。
| 標頭鍵(Headers: Key) | 設定值 |
|---|---|
Content-Type | application/json |
Authorization | Bearer YOUR_RECEIVER_TOKEN |
只在Action的標頭設定中輸入權杖。不要將其放入提示詞、網站程式碼或訪客對話。示範接收端的README說明產生方式;真實整合應使用CRM文件規定的驗證方式。
在Body分頁選擇JSON並輸入:
{
"conversation_id": "{{conversation_id}}",
"name": "{{metadata_visitor_name}}",
"email": "{{metadata_visitor_email}}",
"postcode": "{{metadata_postcode}}",
"project_type": "{{metadata_project_type}}"
}
使用Add AI Data插入對應的內建值與中繼資料值。conversation_id識別對話。其他值來自已儲存欄位;英文聯絡資料名稱對應至visitor_name與visitor_email,而Project type會變為project_type。變數文件說明這些對應關係。
實際編輯器中的連線資料為預留值。請在上方輸入自己的端點,在Headers輸入憑證,在Body輸入JSON;彩色標籤代表動態值。此範例僅示範設定,保持未啟用。
在When to run選擇When metadata matches。在Run when加入全部五列;中繼資料條件以AND組合:
| 中繼資料鍵 | 條件 |
|---|---|
lead_captured | is true |
visitor_name | is true |
visitor_email | is true |
postcode | is true |
project_type | is true |
對這些文字欄位,is true會排除空值與類似false的文字。exists只檢查鍵是否存在;已儲存的空字串也可能通過。下方測試說明較嚴格條件的重要性。這只檢查是否提供可用文字,並不代表已獨立驗證訪客身分或房屋詳情。
使用以下API Action Description:
Send a quote enquiry to the design team when the visitor has provided their full name, email, postcode and project type. This records an enquiry only; it does not book a survey or confirm a price.
五個已儲存條件中的前兩個。請加入表格中的每一列;When metadata matches會在AI回合後檢查條件,無須Agent選擇此Action。
所有條件符合時,Action會在每段對話嘗試一次。稍後收到選填的預計時程不會再次執行;已送出但失敗的請求也不會在該對話中自動重試。請將時程保留在Inbox供設計師參考;若CRM需要後續變更,則建立明確的新增與更新整合。
請求在AI回合之後執行,其回應不會插入聊天內容。因此Main Prompt只確認訪客已提供的資料,不宣稱CRM已接收。請在Action紀錄與接收端驗證送達。自動Action文件說明此執行行為。
先測試部分資料,再測試完整需求
第一版對必要文字欄位使用exists。Sam先提供姓名,再於下一則訊息提供電子郵件。Smart Data Gathering當時已建立空白的郵遞區號與專案類型值,因此這些鍵存在,Action便傳送了不完整的請求,也用掉該對話唯一一次嘗試機會。
修正方式是將四個文字欄位條件改為is true,其餘設定維持原樣。在新對話重測,第二回合只提供電子郵件。Action應等待剩餘的專案資料。
| 測試狀態 | 已收集聯絡資料 | 必要欄位齊全 | 收到的請求數 |
|---|---|---|---|
| Sam提供姓名 | 是 | 否 | 0 |
| Sam只提供電子郵件 | 是 | 否 | 0 |
| Sam提供郵遞區號與專案類型 | 是 | 是 | 1 |
| Sam補充「明年春天」 | 是 | 是 | 1 |
這是觀察到的一段對話,不是正式環境的成功率。請以新對話重現,在每回合後檢查已儲存欄位,並在自己的端點檢查請求。
實際Action呼叫回傳HTTP 201。開啟詳情檢查請求;下方已儲存紀錄顯示接收端存入的資料。
經驗證的示範接收端實際儲存的一筆紀錄。這是需求紀錄,並非已確認的報價或預約。
示範使用本機接收端,並記錄實際HTTP送達。託管的Quickchat AI Agent需要可公開存取的HTTPS端點;服務無法存取您電腦上的localhost網址。
若未收到任何資料,請檢查Action的View logs與對話已儲存的中繼資料。缺少值、Action未啟用與HTTP失敗需要不同修正方式。修正設定後,使用新對話重新測試自動觸發;要求同一段對話重試,不會重設每段對話一次的嘗試限制。
為什麼聊天機器人未顯示,或仍顯示舊設定?
變更提示詞前,先檢查已發布頁面、安裝位置與Agent存取設定。瀏覽器載入問題與回答品質問題是兩回事。
| 現象 | 檢查項目 | 處理方式 |
|---|---|---|
| 公開頁面沒有啟動按鈕 | 程式碼位置與發布狀態 | 將目前程式碼放入共用頁尾或body末端,儲存並發布 |
| Widget在其他位置正常,在HTML區塊卻無法運作 | 建置工具是否建立iframe | 浮動Widget使用全站程式碼;合適的內嵌容器則使用支援的Embed程式碼 |
| 出現錯誤的Agent | Scenario ID與重複安裝 | 從預期使用的Agent複製ID,移除過期程式碼或重複外掛安裝 |
| 啟動按鈕可開啟,但回覆失敗 | Widget & Embed access、額度與瀏覽器網路錯誤 | 啟用預期的公開管道、確認額度並檢查失敗的請求 |
| 顏色或問候語未變更 | 快取設定或頁面HTML | 等待幾分鐘後重新載入;若仍提供舊程式碼,再清除網站相關快取 |
| 測試時未收到潛在客戶通知郵件 | 對話來源與Email new leads | Preview和Simulation不寄信;請在實際小工具對話中使用自己控制的聯絡資料測試 |
| 看似完整的需求未送達CRM | 已持久儲存的欄位、條件與Action紀錄 | 檢查每個必要鍵與HTTP結果;修正已送出但失敗的請求後,以新對話測試 |
| 更換主題後沒有啟動按鈕 | 新主題是否包含安裝內容 | 重新啟用Shopify應用程式嵌入,或在新共用版型恢復程式碼 |
| 回答與來源矛盾 | 匯入內容與已套用的知識變更 | 修正來源、完成處理與發布,再重問已知答案的對照問題 |
若瀏覽器回報資源遭封鎖,請檢查具體的Content Security Policy或封鎖工具錯誤。不要全面停用網站保護。請透過HTTPS測試公開頁面,並依管道文件完成必要設定。
網站聊天機器人需要多少費用?
訂閱與用量額度涵蓋AI服務;網站方案與選用整合另計。
| 用途 | 相關方案限制 |
|---|---|
| 個人、非商業學習 | Free每月包含50點AI額度,以及核心Widget、Smart Data Gathering、Human Handoff與Actions |
| 企業網站 | Starter允許商業用途,每月包含150點額度,每月$9起 |
| 自訂小工具翻譯或語音輸入 | 適用於付費方案 |
| Hide Quickchat AI Branding | Professional或以上方案 |
一點AI額度不等於一段對話。一段對話可能包含多則AI回覆,不同模型選項的額度成本也可能不同。測試預算應包含Preview與Simulation。請使用目前的價格與額度及聊天機器人成本指南估算用量。
ChatGPT或Claude能協助設定聊天機器人嗎?
Quickchat AI的帳號管理連線讓相容的助理能設定支援的Agent選項,並根據這些檔案準備測試。
依照Manage with AI指南,透過ChatGPT中的Quickchat AI或Claude中的Quickchat AI連接自己的帳號。支援的工具涵蓋知識、Main Prompt、對話開場選項、Human Handoff、HTTP Actions、測試與部署程式碼。
請在管理介面完成Smart Data Gathering與小工具的詳細Appearance設定。您也需要授權外部帳號,並在網站設定中安裝程式碼。帳號連線用於管理Agent,與將Agent公開為MCP工具是不同的功能。
複製給助理的設定請求
Use the Kestrel Kitchens website-chatbot kit to prepare a separate learning Agent. Do not change existing Agents. Set its name to Kestrel Kitchens, add knowledge.txt and set main-prompt.txt as Main Prompt. Configure the supported greeting, conversation starters and Human Handoff settings from the kit. Prepare the launch-test dataset with the supplied messages and criteria. Read back the saved configuration and return this Agent's current Widget snippet.
List the remaining dashboard steps for Smart Data Gathering, Appearance and website installation. Do not invent support for those settings. Leave the optional Send quote enquiry Action inactive until I provide my receiver URL and configure its credential. Before running tests or external writes, tell me the expected credit use and effects and obtain any approval required by this client. Do not claim that a website, email or CRM delivery works until it has been tested.
常見問題
如何在網站加入AI聊天機器人?
在Quickchat AI建立Agent,加入企業知識,設定Main Prompt、Smart Data Gathering與Human Handoff,再透過外掛或提供的程式碼安裝Widget。請在已發布網站測試根據來源的回答、聯絡資料收集,以及人工回覆送達。
可以在網站加入自訂ChatGPT嗎?
您可以加入以自己網站頁面訓練、採ChatGPT式互動的助理。本教學透過網站小工具部署Quickchat AI Agent,訪客無須登入ChatGPT即可在網站聊天。其知識、指示與整合皆在Quickchat AI管理。
可以免費在網站加入AI聊天機器人嗎?
Quickchat AI的Free方案適用於個人、非商業學習,每月包含50點AI額度。公司網站或面向客戶的銷售與支援部署,需要允許商業用途的方案。網站建置工具訂閱另計,測試也會消耗AI額度。
需要寫程式或提供API金鑰嗎?
核心設定使用管理介面設定,搭配外掛、應用程式嵌入或提供的指令碼。網站程式碼包含公開的Scenario ID,並非私密API金鑰。連接選用的CRM Action需要合適的端點與驗證方式;請將憑證保留在Action設定中。
網站聊天機器人可以收集潛在客戶與報價需求嗎?
可以。Smart Data Gathering會在對話中詢問指定欄位並儲存至Inbox。收集到電子郵件或電話號碼後,Email new leads可通知Agent管理員。API Action可將必要的已儲存欄位傳送至設定的接收端;只收集到姓名並不代表需求已完整。
可以由人工接管對話嗎?
可以。請為Human Handoff設定有人值班的時段與時段外訊息。在Inbox中,對未指派的對話選擇Assign to me,或在顯示Take over時選擇該控制項,再回覆訪客。Reassign to AI會將對話交還Agent。
支援WordPress、Shopify、Squarespace、Wix與Webflow嗎?
各平台皆有安裝方式。可使用官方WordPress外掛、連接商店Agent後使用Shopify應用程式嵌入,或為既有Agent使用適當的全站頁尾或body末端程式碼。外掛權限與自訂程式碼的方案要求因建置工具而異。
為什麼聊天機器人沒有出現在網站上?
請檢查已發布頁面、Scenario ID是否正確,以及程式碼是否放在頁面body末端。移除過期的重複安裝,浮動Widget應避免使用iframe區塊。若可開啟卻無法回答,請檢查Widget & Embed access與可用AI額度。
聊天機器人會拖慢網站嗎?
小工具載入器以非同步方式下載,但仍會增加JavaScript與網路請求。請在具代表性的頁面與手機上,比較安裝前後的載入與互動效能。非同步載入不代表完全沒有效能影響。
網站聊天機器人可以在手機上使用嗎?
寬度低於768 CSS像素時,開啟的小工具會採全螢幕版型。請在手機測試啟動按鈕、鍵盤、捲動與關閉控制項。若自動開啟會打斷瀏覽,請保持Auto-open Widget關閉。
聊天機器人可以使用訪客的語言回答嗎?
Agent可使用訪客的語言回覆。固定歡迎文字、對話開場選項與小工具標籤的翻譯,是付費方案的獨立設定。對每種預計支援的語言,請同時測試回答事實與介面文字。