Du kan legge til en AI-chatbot på nettstedet ditt ved å gi en agent bedriftens kunnskap, konfigurere svarene og installere en chatwidget med en utvidelse eller et medfølgende skript. Nettstedschatboten fra Quickchat AI samler kunnskap, samtaleinnstillinger og teamets Inbox på ett sted. Besøkende stiller spørsmål på nettstedet ditt uten å opprette en konto.
I denne veiledningen bygger vi Kestrel Kitchens, en fiktiv bedrift som designer kjøkken. En besøkende spør hvor lang tid en oppussing tar, undersøker sannsynlig kostnad for et kjøkken på 3 ganger 4 meter og ber deretter om et tilbud. Agenten svarer ut fra bedriftens informasjon, samler inn prosjektdetaljene og lar en designer fortsette samtalen.
Den ferdige opplevelsen på nettstedet. Kestrel Kitchens og bedriftens opplysninger er fiktive; widgeten og svarene kjører gjennom den virkelige lokale applikasjonen.
Grunnoppsettet krever ingen programmering. Følg kunnskap og instruksjoner, innsamling av leads og overføring til en person, og installer deretter widgeten. En valgfri API Action sender fullstendige forespørsler til et annet system.
Last ned oppsettspakken for Kestrel Kitchens for eksempelnettstedet, kunnskapen, Main Prompt, innstillingene og testmeldingene. Dette er redigerbare filer du følger i kontrollpanelet, ikke import av en agent med ett klikk.
Skjermbilder og kopierbare filer, prompter og konfigurasjon i pakken er på engelsk, slik at du kan gjenskape det testede eksempelet.
Hva skal chatboten på nettstedet gjøre?
Chatboten svarer på spørsmål ut fra innholdet ditt, lagrer opplysningene for ønsket oppfølging og overfører samtaler til teamet når det trengs en person.
Disse resultatene krever ulike bevis. Et riktig prisintervall kommer fra Knowledge Base. En tilbudsforespørsel trenger kontakt- og prosjektdetaljer i Inbox. En overføring krever at en person tar ansvar og sender et svar som når den besøkende.
Den besøkendes vei gjennom eksempelet. En tilbudsforespørsel registrerer interesse; designeren må fortsatt bekrefte pris og tilgjengelighet.
| Den besøkendes spørsmål | Agentens oppgave | Hva du bør kontrollere |
|---|---|---|
| Hvor lang tid tar en oppussing? | Forklar de publiserte varighetene for design og installasjon | Svaret beholder forbeholdene om disse varighetene |
| Hva koster et kjøkken på 3 ganger 4 meter? | Oppgi det veiledende intervallet og forklar hva en befaring avklarer | Ingen oppdiktet fastpris eller pris per kvadratmeter |
| Kan jeg be om et tilbud? | Samle inn navn, e-post, postnummer og prosjekttype | Feltene vises i samtalens lagrede data |
| Tilbyr dere finansiering? | Erkjenn at den medfølgende kunnskapen ikke sier noe om det | Ingen oppdiktet finansieringsordning |
| Kan jeg snakke med en designer? | Bruk Human Handoff innenfor bemannede åpningstider | En designer kan svare fra Inbox, og den besøkende mottar svaret |
Hva trenger du før du legger til en chatbot?
Du trenger en Quickchat AI-konto, bedriftsinformasjon du kan verifisere, og tilgang til nettstedets innstillinger for utvidelser eller egendefinert kode.
- Opprett en Quickchat AI-konto og fullfør registreringen. Bruk en separat agent til denne øvelsen, slik at eksempelopplysningene ikke påvirker en eksisterende kundeservice.
- Gjør klar tjenestesidene, vanlige spørsmål og retningslinjene dine, eller bruk den fiktive kunnskapen i pakken. Erstatt de fiktive prisene og tjenesteområdet før du publiserer for en virkelig bedrift.
- Kontroller at nettstedsabonnementet tillater den aktuelle installasjonsmetoden. WordPress trenger tilgang til utvidelser; enkelte vertsbaserte nettstedbyggere krever et betalt abonnement for egendefinert kode på hele nettstedet.
- Avtal at noen følger med på testens Inbox når du prøver overføring til en person. Ha en nettleser på datamaskin og en telefon tilgjengelig til sluttkontrollene av nettstedet.
Free er for personlig, ikke-kommersiell læring. Free-abonnementet inkluderer 50 AI-kreditter per måned. Bruk i en bedrift krever et kommersielt abonnement, og testing bruker samme svarkvote som andre AI-samtaler. Abonnement på nettstedbyggeren og eksterne API-kostnader kommer i tillegg. Kostnadsdelen skiller mellom disse kostnadene.
Trinn 1: Hvordan trener du en chatbot på nettstedets innhold?
Legg sidene som inneholder bedriftens svar, i Knowledge Base, og verifiser deretter det importerte innholdet før du tester. Dette gir agenten referansemateriale til svarene.
Opprett agenten til læringsøvelsen
- På den første oppsettskjermen velger du Set up manually. Fra et eksisterende kontrollpanel bruker du + ved siden av AI Agent (Add new AI Agent) for å opprette en separat agent, og velger deretter Set up manually.
- I Identity skriver du
Kestrel Kitchensunder Name your AI Agent. Lim innmain-prompt.txtfra pakken i Describe what you want your agent to do. Dette blir agentens Main Prompt, forklart i trinn 2. Velg Next. - La Knowledge Base være tom foreløpig, og velg Next. Fortsett gjennom External apps uten å velge en tilkobling. I Deployment velger du Chat widget og deretter Next.
- På Choose your plan bruker du Skip for now for å fortsette den personlige læringsøvelsen, eller velger et egnet kommersielt abonnement for bedriftsbruk. Fullfør eller lukk eventuelle valgfrie tilbud som vises etterpå.
- I kontrollpanelet bekrefter du agentens navn i Identity, og åpner deretter Knowledge Base. Velg enten dine egne sider eller eksempelartikkelen nedenfor.
Identity inneholder agentens navn og Main Prompt. Knowledge Base, Actions & MCPs og Your Website er de neste stoppene i denne gjennomgangen.
Importer dine egne sider
- I Knowledge Base velger du Add Website. Velg én side eller alternativet for import av et nettsted, avhengig av hvor mye du trenger.
- Skriv inn den offentlige URL-en. Ved import av et nettsted går du gjennom sidene som er funnet, og velger sidene om tjenester, priser, prosess og vanlige spørsmål som skal ligge til grunn for svarene.
- Undersøk den importerte teksten. Bekreft at prisene har riktig valuta og avgiftsbehandling, og at gamle kampanjer eller uvedkommende sider ikke har blitt kilder.
- Vent til behandlingen er ferdig. Bruk eller publiser eventuelle ventende kunnskapsendringer som kontrollpanelet viser, før du tester den installerte widgeten.
Begynn med noen få tydelige sider. Et nettsted kan vise et tiltalende priskort, men plassere forbeholdene et annet sted; agenten trenger begge deler. Import av bare forsiden kan utelate installasjonsvilkår, geografiske grenser eller refusjonsregler som gjør et svar nyttig.
Bruk kilden for Kestrel Kitchens
For å gjenskape eksempelet uten å publisere et nettsted først legger du til opplysningene direkte:
- I Knowledge Base velger du Add Article. Dette oppretter en Untitled-artikkel og åpner Edit Article.
- Skriv
Kestrel Kitchens: services, prices and processi Title. Under Content velger du Plain Text og limer innknowledge.txtfra pakken. - Velg Save og vent til artikkelen er Ready. Bekreft at tittelen vises i listen i Knowledge Base.
Knowledge Base finnes i agentens navigasjon. Eksempelet trenger én artikkel; bruk Add Website for dine egne publiserte sider.
Den lagrede artikkelen beholder forbeholdene om priser og tidsplaner. De fiktive opplysningene samsvarer med eksempelnettstedet.
Kopier hele kunnskapsgrunnlaget for eksempelet
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.
Kilden lar bevisst finansiering være uspesifisert. Det gir en nyttig test av hvordan agenten håndterer et reelt kunnskapshull. For et virkelig nettsted holder du kildesidene oppdatert og bruker støttede oppdateringsinnstillinger der de finnes; veiledningen til Knowledge Base forklarer hvordan du organiserer og tester kildene.
Trinn 2: Hva skal chatboten si, og hva må den aldri love?
Bruk Main Prompt til å definere hvordan agenten anvender kunnskapen: svar først, gi nyttige svar, og overlat beslutninger som et bindende pristilbud til teamet.
For Kestrel angir rommålene prosjektets omfang. De fastslår ikke kjøkkeninnredning, hvitevarer eller bygningsarbeid. Agenten skal forklare kildens planleggingsintervall på £18,000 til £45,000, inkludert merverdiavgift, uten å beregne en mer presis pris fra gulvarealet.
Disse prisene er fiktive data til veiledningen. Poenget er å beholde skillet mellom kildeopplysninger og en beslutning teamet fortsatt må ta.
- I Identity velger du Edit på Main Prompt-kortet.
- Lim inn hele prompten nedenfor. La den lagres, og åpne deretter redigeringsvinduet igjen for å bekrefte den lagrede teksten.
- Behold bedriftsopplysningene i Knowledge Base. Bruk prompten til svarstil, innsamling av opplysninger og beslutninger som krever en person.
Main Prompt er instruksjonsfeltet. Hele teksten nedenfor og i pakken er versjonen du kan kopiere.
Kopier hele 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.
Åpne AI Preview og spør How long does a full kitchen renovation take?. I den lokale kontrolltesten svarte agenten med 2 til 3 uker til befaring og design, deretter 4 til 8 uker til installasjon etter at materialene er tilgjengelige. Både varigheten og forbeholdet er viktige.
Start en ny samtale og spør Do you offer financing?. Det riktige svaret erkjenner at kilden ikke fastslår noe tilbud, og henviser spørsmålet til en designer. Mer selvsikre formuleringer i prompten ville ikke gitt den manglende bedriftsopplysningen.
Et kjent svar, inkludert forbeholdet om at materialene må være tilgjengelige.
En opplysning som faktisk mangler. Kilden inneholder ingen finansieringsvilkår.
Trinn 3: Hvordan samler du inn tilbudsforespørsler i chatten?
Smart Data Gathering spør etter utvalgte opplysninger i en samtale og lagrer det den besøkende oppgir. For en tilbudsforespørsel samler du bare inn det designeren trenger for å følge opp.
Aktiver og rediger de innebygde Actions her. Eksempelets Smart Data Gathering-kort heter Quote enquiries.
- Åpne Actions & MCPs, aktiver Smart Data Gathering og velg Edit Action. Sett Name til
Quote enquiriesog Description tilCapture contact and project details for a kitchen design enquiry.Det lagrede navnet blir kortets tittel. - Under Data to collect legger du til radene nedenfor. Behold disse engelske Data point-navnene når du gjenskaper eksempelet; kontaktnavnene har særskilte tilordninger til besøksfeltene i Inbox.
- Sett Reason for collecting information til
So a Kestrel Kitchens designer can assess your project and follow up by email. - Sett When to ask for data til After exchanging a few messages, og How to ask for data til Subtle.
- Lagre Action. I AI Preview stiller du et nyttig spørsmål om en tjeneste før du ber om et tilbud, og undersøker de lagrede opplysningene i Inbox.
| Datafelt (Data point) | Spørsmål som skal stilles | Format eller eksempelverdier |
|---|---|---|
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 |
Spørsmålene beskriver opplysningene som skal samles inn. Innstillingene for tidspunkt og stil styrer når agenten spør; test også den faktiske samtalen.
Navn, e-post, postnummer og prosjekttype er påkrevde opplysninger for en fullstendig forespørsel i dette eksempelet. Ønsket starttidspunkt er valgfritt, som Main Prompt forklarer. Dette forretningskravet er separat fra innstillingene for innsamling i samtalen; trinn 8 håndhever de påkrevde feltene før en CRM-forespørsel sendes.
Agenten skal svare på et generelt kostnadsspørsmål uten å kreve en e-postadresse for å gi svaret. En besøkende kan også avslå innsamling. Bruk I am only researching. I do not want to leave contact details. for å kontrollere at samtalen fortsatt er nyttig uten gjentatte forespørsler.
Hvor havner de innsamlede opplysningene?
Åpne samtalen i Inbox. Vanlige kontaktopplysninger vises i feltene for den besøkende; de andre innsamlede verdiene forblir knyttet til samtalen og kan eksporteres gjennom Export Gathered Data.
Den besøkende oppgir kontakt- og prosjektdetaljer i chatten.
De lagrede feltene er beviset på innsamlingen. Sammenlign hver verdi med det den besøkende oppga.
Under Where to send data varsler Email new leads alle agentens administratorer når en e-postadresse eller et telefonnummer samles inn for første gang. Et navn alene utløser ingen e-post. Preview og Simulation sender ikke disse varslene, så kontroller din egen administratorinnboks med en kontrollert test på den installerte widgeten før du stoler på e-postlevering. Den lokale gjennomgangen har ekstern e-postlevering deaktivert.
Dokumentasjonen for Smart Data Gathering beskriver innsamling, varsler og eksport. På ditt eget nettsted bør du forklare hvorfor du ber om opplysningene, og lenke til personvernerklæringen i widgeten. Veiledningen om personvern for chatboter hjelper deg med å gjennomgå den samlede dataflyten.
Trinn 4: Hvordan lar du en person overta chatten?
Human Handoff overfører en samtale til teamet; en person overtar deretter i Inbox og svarer den samme besøkende.
Gjør klar overføringen før du publiserer widgeten. En som ber om en designer, skal ikke måtte fullføre tilbudsskjemaet først, og agenten skal ikke antyde at noen er pålogget utenfor bemannede åpningstider.
- I Actions & MCPs aktiverer du Human Handoff og åpner Edit Action.
- Behold standardreglene Media Message, User Frustration, Customer Support Suggestion og Lack Of Knowledge på; la Irrelevant Advice være av. Main Prompt forklarer allerede når agenten skal tilby en designer. Det testede eksempelet bruker disse standardreglene uten å legge til egne regler.
- Konfigurer meldingene og tilgjengeligheten nedenfor, og lagre. La Email notifications være av i læringsøvelsen, og kontroller overføringen direkte i Inbox.
| Innstilling | Verdi for 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. |
Bruk tider når en person faktisk følger med på Inbox. Den fiktive tidsplanen er ikke et løfte om umiddelbart svar.
I en bemannet periode spør du Can I speak to a designer? fra nettstedet. Fullfør eventuell bekreftelse på overføring som agenten ber om. I Inbox åpner du samtalen og velger Assign to me når den ikke er tildelt, eller Take over når den kontrollen vises. Send et svar som person, og bekreft at den besøkende mottar det. Bruk Reassign to AI når AI-en skal fortsette.
Inbox samler samtalen, kontrollen for eierskap og besøksopplysningene. Velg den besøkendes samtale før du svarer.
Kontroller eierskapet og at svaret fra personen er levert, ikke bare agentens tilbud om overføring.
Den besøkendes side av samme overføring. Maya Patel er den fiktive designeren som brukes i den lokale testen.
Gjenta i en ny samtale utenfor de konfigurerte åpningstidene. Agenten skal forklare tilgjengeligheten og tilby den angitte oppfølgingen. Hvis du midlertidig endrer tidsplanen for å kjøre denne kontrollen, gjenoppretter du den virkelige tidsplanen etterpå. Dokumentasjonen for Human Handoff forklarer innstillingene og flyten i Inbox.
I veiledningen for overføring fra chatbot til et menneske finner du separate kontroller av hvem som har ansvaret for samtalen, tilbakeføring til AI og feil utenfor åpningstidene.
Trinn 5: Hvordan tilpasser du widgeten til nettstedet?
Angi utseendet og den faste teksten under Channels → Your Website. Gjør velkomstmeldingen konkret nok til å forklare hva den besøkende kan spørre om.
De tre fanene skiller installasjon, utseende og fast tekst. Appearance inneholder også avatar og etikett for startknappen.
Utseende
- Åpne Appearance. For Kestrel velger du et Custom-tema med hvit bakgrunn, mørkegrønn topptekst og aksentfarge (
#315448) og hvit tekst i toppteksten. Behold standard tekststørrelse og avrundede kontroller. - Under Branding → AI Agent Avatar klikker du på avatarens opplastingsikon, velger
website/kestrel-avatar.pngfra pakken og velger Upload i beskjæringsdialogen. - Sett Widget window max width til 400px og Widget window max height til 520px. Velg Small for startknappens størrelse, plasser den til høyre og bruk
Ask about your kitchensom etikett. Etiketten er tilgjengelig med den lille startknappen. Forhåndsvis plasseringen mot eventuelle informasjonskapselbannere eller andre flytende kontroller på nettstedet. - La Auto-open Widget være av. Å åpne widgeten ved hver sidelasting forstyrrer nettlesingen, særlig på en telefon.
Kontroller forhåndsvisningen mens du velger farger. Testen på det publiserte nettstedet er fortsatt viktig fordi startknappen deler plass med nettstedets kontroller.
Tekstinnhold
Åpne Text Content og bruk disse verdiene:
| Innstilling | Verdi |
|---|---|
| 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. |
Samtalestartere bør åpne nyttige oppgaver. Ansvarsfraskrivelsen forteller besøkende hvilke beslutninger som fortsatt trenger en designer.
Agenten kan svare på den besøkendes språk. Oversettelse av den faste velkomstmeldingen og widgetetikettene er en separat innstilling under Other languages, tilgjengelig i betalte abonnementer. For et flerspråklig nettsted tester du både svaret og den faste grensesnittsteksten; veiledningen til flerspråklige chatboter forklarer dette skillet.
Utseendeendringer kan bruke noen minutter på å nå hurtigbufrede besøksøkter. Last inn på nytt før du konkluderer med at en lagret endring mislyktes. Hide Quickchat AI Branding krever Professional eller høyere; veiledningen til egen merkevare dekker de andre flatene du bør undersøke.
Trinn 6: Hvordan installerer du chatboten på nettstedet?
Installer Widget i nettstedets felles layout, eller bruk den støttede plattformintegrasjonen. Den flytende Widget må kjøre på siden den besøkende leser.
- Åpne Channels → Your Website → Install.
- Aktiver Widget & Embed access for den offentlige widgeten.
- Velg installasjonsmetoden for nettstedet ditt, og kopier kodesnutten eller Scenario ID som vises for denne agenten.
- Publiser endringen, åpne det offentlige nettstedet og still et spørsmål du vet finnes svar på i Knowledge Base.
Kopier fra denne agentens Install-skjerm. Dens Scenario ID er en offentlig widgetidentifikator, ikke en privat API-nøkkel.
Alle nettsteder: lim inn Widget-kodesnutten før den avsluttende body-taggen
Velg Install manually with code og kopier Widget-kodesnutten. Det gjeldende lasteskriptet har denne formen:
<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>
Erstatt YOUR_SCENARIO_ID med verdien fra Install. Lim inn hele kodesnutten én gang, rett før </body> i den felles layouten, eller bruk nettstedbyggerens felt for bunntekst på hele nettstedet. Dette lasteskriptet setter inn et skript i sidens body, så plassering i head før body finnes kan hindre lasting.
Plasseringen er viktig. En iframe-basert HTML-blokk er en separat side og passer ikke for denne flytende Widget.
Det separate Embed-alternativet plasserer en chat i en beholder på siden. Bruk den genererte kodesnutten hvis du ønsker en chatseksjon inne i siden. En HTML-blokk som setter kode direkte inn på siden, kan støtte dette mønsteret; en byggerblokk som isolerer koden i en iframe, er et annet tilfelle. Se dokumentasjonen for nettstedskanalen.
WordPress: installer den offisielle utvidelsen
- I WordPress åpner du Plugins → Add New, søker etter Quickchat AI Agent og velger deretter Install Now og Activate.
- Åpne Settings → Quickchat AI Agent.
- Lim inn Scenario ID fra Install-skjermen i Quickchat AI og velg Save Changes.
- Åpne en offentlig side og kontroller widgeten. Bruk enten utvidelsen eller en manuell kodesnutt, slik at du ikke installerer lasteskriptet to ganger.
Du trenger en WordPress-installasjon og et abonnement som tillater utvidelser. Veiledningen til WordPress-chatboten viser utvidelsens grensesnitt og kontroller som er spesifikke for WordPress.
Squarespace: bruk kodeinnsetting i bunnteksten
- Åpne nettstedets Code Injection-panel. Bruk søket i kontrollpanelets innstillinger hvis navigasjonen er annerledes på kontoen din.
- Lim inn hele Widget-kodesnutten i Footer og lagre.
- Åpne den publiserte siden i en egen nettleserfane og test et svar.
Squarespace tilbyr Code Injection i Core, Plus, Advanced og enkelte eldre abonnementer. Innsetting i bunnteksten plasserer koden før </body> på hele nettstedet. Bruk denne flaten for den flytende widgeten; en iframe-blokk på sidenivå er ikke tilsvarende. Denne egendefinerte koden gjelder ikke Squarespaces betalingssider.
Wix: bruk egendefinert kode ved slutten av body
- I nettstedets kontrollpanel åpner du Settings → Custom Code og deretter + Add Custom Code.
- Lim inn Widget-kodesnutten og gi den navnet
Quickchat AI widget. - Bruk den på All pages, velg Body - end og deretter Apply.
- Test det publiserte nettstedet, inkludert navigasjon til en annen side.
Wix krever et publisert nettsted med et tilkoblet domene for egendefinert kode. Bruk den nettsteddekkende Custom Code-innstillingen for denne flytende widgeten.
Webflow: bruk kode i bunnteksten og publiser
- Åpne Site settings → Custom code.
- Lim inn Widget-kodesnutten i Footer code og velg Save changes.
- Velg Publish til det aktuelle domenet, og test deretter den publiserte URL-en.
Webflows innstillinger for egendefinert kode krever et kvalifisert betalt Workspace eller et aktivt Site-abonnement. Lagring av innstillingen alene publiserer den ikke.
Shopify: velg kodesnutten for den eksisterende agenten eller Shopify-appen
For Kestrel-agenten du allerede har bygget, legger du Widget-kodesnutten rett før </body> i Online Store → Themes → Edit code → layout/theme.liquid, lagrer og undersøker nettbutikken. Ta en sikkerhetskopi av temaet før redigering, og kontroller installasjonen på nytt etter temabytte. Denne metoden viser agenten du har valgt; den konfigurerer ikke Actions for produkter eller ordrer.
For en butikkrettet agent kobler oppsettet av Quickchat AI-appen for Shopify til butikken gjennom sin egen oppstartsprosess. Etter tilkoblingen bruker du Enable Widget in Shopify Theme Editor, eller åpner Online Store → Themes → Edit theme → App embeds. Aktiver Quickchat AI Widget og lagre. Shopifys dokumentasjon for appinnbygging forklarer temakontrollene; aktiver appinnbyggingen på nytt når du bytter det publiserte temaet.
Metodene for nettstedbyggere ovenfor ble kontrollert mot offisiell dokumentasjon. Skjermbildene i gjennomgangen viser eksempelnettstedet til Kestrel og den virkelige lokale widgeten; de er ikke skjermbilder fra innloggede kontoer hos hver nettstedbygger.
Kontroller kodesnutten før du feilsøker agenten
Disse valgfrie kontrollene bruker verdiene du oppgir:
- Kontroller en Widget-kodesnutt. Kontroller innlimt kode mot oppgitt Scenario ID. Dette henter ikke nettstedet ditt.
- Sammenlign publiseringsmetoder. Kontroller de oppgitte kanalene, nettstedstilgangen og nødvendige funksjoner mot oppsettsalternativene i Quickchat AI. Dette undersøker ikke nettstedet eller kontoen din.
I en kompatibel nettleser er disse kontrollene også tilgjengelige som nettstedsverktøy. Lenkene åpner de vanlige skjemaene.
Trinn 7: Hvordan tester du chatboten før de besøkende gjør det?
Test svaret, lagrede data og levert svar separat. AI Preview og Simulation Testing hjelper deg med å vurdere atferd; det publiserte nettstedet beviser at den besøkende kan bruke den installerte widgeten.
Kjør uavhengige spørsmål i Simulation Testing
Åpne Testing → Create Dataset, gi det navnet Kestrel Kitchens: website launch checks og velg Paste messages. Legg til spørsmålene om varighet, pris og finansiering nedenfor, atskilt av en linje med --- mellom spørsmålene. Et linjeskift alene beholder teksten i én testmelding. Sett Evaluation criteria til å kontrollere fakta og konsise svar, og velg deretter Run → Start Run. Pakken inneholder de nøyaktige meldingene og kriteriene.
Hver rad i datasettet starter en separat samtale. Bruk Simulation for de uavhengige spørsmålene; kjør kontrollene av tilbudsforespørsel over flere meldinger og overtakelse av en person i én AI Preview- eller nettstedssamtale. Undersøk Action-loggen og mottakeren separat, fordi en evaluator av samtaleteksten ikke kan verifisere ekstern levering.
Åpne en fullført kjøring og undersøk svarene. Dette prissvaret beholder planleggingsintervallet; svarpoengsummen beviser ikke levering til et annet system.
Samme kostnadstest åpnet som en samtale i Inbox. Undersøk hele svaret, inkludert hvorfor målene alene ikke kan fastslå et bindende pristilbud, fremfor å stole bare på poengsummen.
| Testmelding eller sekvens | Forventet resultat | Undersøk |
|---|---|---|
How long does a full kitchen renovation take? | 2 til 3 uker til befaring/design; 4 til 8 uker til installasjon etter at materialene er tilgjengelige | Svar og kilde |
How much would a 3 by 4 metre kitchen cost? | £18,000 til £45,000 inkludert merverdiavgift som veiledende intervall; befaring trengs for et bindende pristilbud | Ingen oppdiktet fastpris |
Do you offer financing? | Agenten kan ikke bekrefte det fra kilden og tilbyr kontakt med en designer | Svar, deretter overføring hvis ønsket |
Can I get a quote? My name is Sam Taylor. | Spør etter manglende opplysninger; ikke send Action for fullstendig forespørsel ennå | Lagret navn; ingen CRM-kvittering |
My email is sam@example.com. The postcode is BS6 7AB and it is a full kitchen renovation. | Lagre oppgitt e-post, postnummer og prosjekttype | Inbox-felt; eventuell Action-logg og mottaker |
I have not decided when to start. | Godta en ukjent tidsplan | Ingen oppdiktet dato eller påkrevd tidsplan |
I am only researching. I do not want to leave contact details. | Fortsett å svare uten gjentatte forespørsler om opplysninger | Neste nyttige svar |
Can I speak to a designer? | Følg den konfigurerte flyten innenfor eller utenfor åpningstidene | Samtalens eierskap og levering av svar fra en person |
¿Cuánto suele durar una reforma de cocina? | Svar på spansk og behold de samme tidsintervallene og forbeholdene | Fakta så vel som språk |
Bruk en ny samtale mellom uavhengige tilfeller. Ny innlasting av siden kan gjenoppta en eksisterende samtale, så bruk widgetens kontroll for ny chat når du trenger en ny test.
Kontroller nettstedet på en telefon
På skjermer under 768 CSS-piksler bruker den åpne widgeten fullskjermvisning. Kontroller at du kan åpne den, skrive med tastaturet synlig, rulle i samtalen og lukke den for å gå tilbake til nettstedet.
Den åpne widgeten på en smal skjerm. La Auto-open være av for dette nettstedet der nettlesing er hovedoppgaven.
Avslutt med at en virkelig person svarer fra Inbox. Et godt AI-svar beviser ikke at veien til menneskelig support fungerer. Gjenta et lite utvalg av disse kontrollene etter endringer i kilder, prompter, Actions eller nettstedets tema.
Trinn 8: Hvordan sender du en fullstendig forespørsel til CRM-systemet?
En valgfri API Action kan sende de lagrede feltene til en HTTP-mottaker etter at samtalen har alle påkrevde opplysninger. Nettstedschatboten kan allerede brukes uten denne utvidelsen.
Det viktige skillet går mellom en kontakt er samlet inn og denne forespørselen er fullstendig. Quickchat AI setter lead_captured når et standard kontaktfelt, inkludert et navn, samles inn for første gang. Flagget alene fastslår ikke at e-post, postnummer eller prosjekttype finnes.
Plattformen kontrollerer hvert vilkår. Modellen samler inn opplysningene; vilkårene avgjør når forespørselen kan sendes.
Gjør klar mottakeren
Bruk et CRM- eller automatiseringsendepunkt du kontrollerer, som godtar JSON-innholdet nedenfor. Pakken inkluderer en liten lokal demonstrasjonsmottaker for lesere som vil undersøke forespørselen før de kobler til et CRM-system. Oppsettsinstruksjonene oppretter en privat token og forklarer hvordan du gjør et midlertidig HTTPS-endepunkt tilgjengelig. Send bare fiktive testdata til demonstrasjonsmottakeren.
For en administrert integrasjon følger du i stedet veiledningen til rapportering i Google Sheets eller veiledningen til et tilpasset CRM-system. Ikke aktiver to arbeidsflyter som begge oppretter samme lead.
Konfigurer én automatisk API Action
- Åpne Actions & MCPs → Custom Actions → Add Action → API Action. Velg Create manually hvis den beskrivelsesbaserte byggeren åpnes.
- Sett API Action Name til
Send quote enquiry. - La What to ask the user first være tomt. Denne Action leser feltene som allerede er lagret av Smart Data Gathering; den ber ikke modellen fylle ut et nytt sett med parametere.
- Under API Endpoint velger du
POSTog skriver inn mottakerens HTTPS-URL for/enquiries. - Legg til headere, forespørselsinnhold og vilkår nedenfor, og lagre og aktiver Action.
| Headere: nøkkel | Verdi |
|---|---|
Content-Type | application/json |
Authorization | Bearer YOUR_RECEIVER_TOKEN |
Skriv tokenen bare i headerinnstillingen til Action. Hold den utenfor prompten, nettstedets kodesnutt og samtalen med den besøkende. Demonstrasjonsmottakerens README forklarer hvordan du genererer den; bruk CRM-systemets dokumenterte autentisering for en virkelig integrasjon.
I Body-fanen velger du JSON og skriver inn:
{
"conversation_id": "{{conversation_id}}",
"name": "{{metadata_visitor_name}}",
"email": "{{metadata_visitor_email}}",
"postcode": "{{metadata_postcode}}",
"project_type": "{{metadata_project_type}}"
}
Bruk Add AI Data til å sette inn de tilsvarende innebygde verdiene og metadataverdiene. conversation_id identifiserer samtalen. De andre verdiene kommer fra de lagrede feltene; de engelske kontaktnavnene tilordnes visitor_name og visitor_email, mens Project type blir project_type. Dokumentasjonen for variabler forklarer disse tilordningene.
Det virkelige redigeringsvinduet med plassholdere for tilkoblingsdetaljer. Skriv inn ditt eget endepunkt ovenfor, legitimasjon i Headers og JSON i Body; de fargede brikkene identifiserer dynamiske verdier. Dette eksempelet viser bare konfigurasjon og ble beholdt inaktivt.
Under When to run velger du When metadata matches. I Run when legger du til alle fem radene; metadatavilkårene kombineres med AND:
| Metadatanøkkel | Vilkår |
|---|---|
lead_captured | is true |
visitor_name | is true |
visitor_email | is true |
postcode | is true |
project_type | is true |
For disse tekstfeltene avviser is true tomme verdier og tekst som tolkes som usann. exists kontrollerer bare at en nøkkel finnes; en lagret tom streng kan passere. Testene nedenfor viser hvorfor det strengere vilkåret er viktig. Dette kontrollerer at brukbar tekst er oppgitt, ikke at den besøkendes identitet eller eiendomsopplysninger er verifisert uavhengig.
Bruk denne 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.
De første to av fem lagrede vilkår. Legg til hver rad fra tabellen; When metadata matches kontrollerer dem etter en AI-tur uten at agenten velger Action.
Action forsøkes kjørt én gang per samtale når alle vilkårene er oppfylt. Den kjører ikke igjen når den besøkende senere oppgir et ønsket starttidspunkt, som er valgfritt, og en sendt forespørsel som mislykkes, prøves ikke automatisk på nytt i samme samtale. Behold tidsplanen i Inbox til designeren, eller bygg en integrasjon med separate funksjoner for oppretting og oppdatering hvis CRM-systemet trenger senere endringer.
Forespørselen kjører etter AI-turen, og svaret fra den settes ikke inn i chatten. Derfor bekrefter Main Prompt den besøkendes opplysninger uten å hevde at et CRM-system har godtatt dem. Verifiser leveringen i Action-loggen og mottakeren. Dokumentasjonen for automatiske Actions beskriver denne kjøringsatferden.
Test ufullstendige data, deretter den fullstendige forespørselen
Den første versjonen brukte exists for de påkrevde tekstfeltene. Sam oppga et navn, og deretter en e-post i neste melding. Smart Data Gathering hadde allerede opprettet tomme verdier for postnummer og prosjekttype, så disse nøklene fantes, og Action sendte en ufullstendig forespørsel. Det brukte også opp samtalens ene forsøk.
Rettelsen var å endre de fire tekstfeltvilkårene til is true, mens resten av oppsettet var uendret. Gjenta testen i en ny samtale, og oppgi bare en e-post i andre tur. Action skal vente på de resterende prosjektdetaljene.
| Testtilstand | Kontakt samlet inn | Påkrevde felt klare | Mottatte forespørsler |
|---|---|---|---|
| Sam oppgir et navn | Ja | Nei | 0 |
| Sam oppgir bare en e-post | Ja | Nei | 0 |
| Sam oppgir postnummer og prosjekttype | Ja | Ja | 1 |
| Sam legger til «next spring» | Ja | Ja | 1 |
Dette er én observert samtale, ikke en suksessrate i produksjon. Gjenskap den med en ny samtale, undersøk de lagrede feltene etter hver tur, og kontroller forespørselen på ditt eget endepunkt.
Det faktiske Action-kallet returnerte HTTP 201. Åpne detaljene for å undersøke forespørselen; den lagrede posten nedenfor viser hva mottakeren lagret.
Én faktisk lagret post fra den autentiserte demomottakeren. Dette er en forespørsel, ikke et bekreftet pristilbud eller en bestilling.
Demonstrasjonen brukte en lokal mottaker og registrerte faktisk HTTP-levering. En vertsbasert Quickchat AI-agent trenger et offentlig tilgjengelig HTTPS-endepunkt; en localhost-URL på datamaskinen din kan ikke nås fra tjenesten.
Hvis ingenting kommer frem, undersøk View logs på Action og samtalens lagrede metadata. Manglende verdier, en deaktivert Action og en HTTP-feil trenger ulike rettelser. Korriger konfigurasjonen og bruk en ny samtale for å teste den automatiske utløseren igjen; å be den samme chatten prøve på nytt nullstiller ikke et forsøk som bare gjøres én gang per samtale.
Hvorfor mangler chatboten, eller viser gamle innstillinger?
Kontroller den publiserte siden, installasjonsplasseringen og agentens tilgang før du endrer prompten. Et problem med lasting i nettleseren er separat fra et problem med svarkvaliteten.
| Det du opplever | Hva du bør undersøke | Hva du bør gjøre |
|---|---|---|
| Ingen startknapp på den offentlige siden | Plassering av kodesnutten og publiseringsstatus | Legg gjeldende kodesnutt i felles bunntekst eller slutten av body, lagre og publiser |
| Widgeten fungerer andre steder, men ikke i en HTML-blokk | Om nettstedbyggeren oppretter en iframe | Bruk kode på hele nettstedet for den flytende Widget; bruk den støttede Embed-kodesnutten i en egnet beholder inne i siden |
| Feil agent vises | Scenario ID og duplikatinstallasjoner | Kopier ID-en fra ønsket agent og fjern gamle kodesnutter eller doble utvidelsesinstallasjoner |
| Startknappen åpnes, men svarene mislykkes | Widget & Embed access, kreditter og nettverksfeil i nettleseren | Aktiver den tiltenkte offentlige kanalen, kontroller kvoten og undersøk den mislykkede forespørselen |
| En farge eller hilsen forblir uendret | Hurtigbufret konfigurasjon eller side-HTML | Vent noen minutter, last inn på nytt og tøm deretter nettstedets aktuelle hurtigbuffer hvis den fortsatt leverer en gammel kodesnutt |
| Ingen e-post om lead under en test | Samtalekilden og Email new leads | Preview og Simulation undertrykker e-post; test en virkelig widgetsamtale med dine egne kontrollerte kontaktopplysninger |
| En tilsynelatende fullstendig forespørsel når aldri CRM-systemet | Lagrede felt, vilkår og Action-logg | Kontroller hver påkrevd nøkkel og HTTP-resultatet; bruk en ny samtale etter å ha rettet en sendt forespørsel som mislyktes |
| Ingen startknapp etter temabytte | Om det nye temaet inkluderer installasjonen | Aktiver Shopify-appinnbyggingen på nytt, eller gjenopprett kodesnutten i den nye felles layouten |
| Et svar motsier kilden | Importert innhold og brukte kunnskapsendringer | Rett kilden, fullfør behandling/publisering og gjenta et kontrollspørsmål med kjent svar |
Hvis nettleseren rapporterer en blokkert ressurs, undersøk den konkrete feilen fra Content Security Policy eller blokkeringen. Unngå å deaktivere nettstedets beskyttelse generelt. Test den offentlige siden over HTTPS og bruk kanaldokumentasjonen for nødvendig oppsett.
Hva koster en chatbot på nettstedet?
Abonnementet og brukskvoten betaler for AI-tjenesten; nettstedsabonnementet og valgfrie integrasjoner er separate kostnader.
| Bruk | Relevant abonnementsgrense |
|---|---|
| Personlig, ikke-kommersiell læring | Free inkluderer 50 AI-kreditter per måned og grunnfunksjonene Widget, Smart Data Gathering, Human Handoff og Actions |
| Et bedriftsnettsted | Starter tillater kommersiell bruk og inkluderer 150 kreditter per måned, fra $9/måned |
| Egendefinerte widgetoversettelser eller taleinndata | Tilgjengelig i betalte abonnementer |
| Skjule merkevaren med Hide Quickchat AI Branding | Professional eller høyere |
Én AI-kreditt er ikke én samtale. En samtale kan inneholde flere AI-svar, og ulike modellvalg kan ha ulike kredittkostnader. Inkluder Preview og Simulation i testbudsjettet. Bruk gjeldende priser og kvoter og veiledningen til chatbotkostnader for å anslå volumet ditt.
Kan ChatGPT eller Claude hjelpe med å sette opp chatboten?
Tilkoblingen for kontoadministrasjon i Quickchat AI lar en kompatibel assistent konfigurere støttede agentinnstillinger og forberede tester fra disse filene.
Koble til din egen konto gjennom Quickchat AI i ChatGPT eller Quickchat AI i Claude, og følg Manage with AI-veiledningen. De støttede verktøyene dekker kunnskap, Main Prompt, samtalestartere, Human Handoff, HTTP Actions, testing og kodesnutten for publisering.
Fullfør Smart Data Gathering og de detaljerte Appearance-innstillingene for widgeten i kontrollpanelet. Du må også autorisere eksterne kontoer og installere kodesnutten i nettstedets innstillinger. Kontotilkoblingen brukes til å administrere agenten; den er separat fra å gjøre en agent tilgjengelig som MCP-verktøy.
Kopier en oppsettsforespørsel til assistenten din
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.
Vanlige spørsmål
Hvordan legger jeg til en AI-chatbot på nettstedet mitt?
Opprett en agent i Quickchat AI, legg til bedriftens kunnskap, konfigurer Main Prompt, Smart Data Gathering og Human Handoff, og installer deretter Widget med en utvidelse eller den medfølgende kodesnutten. Test et kildebasert svar, lagrede kontaktopplysninger og et levert svar fra en person på det publiserte nettstedet.
Kan jeg legge til en tilpasset ChatGPT på nettstedet mitt?
Du kan legge til en assistent av samme type som ChatGPT, trent på dine egne sider. Denne veiledningen publiserer en Quickchat AI-agent via nettstedets chatwidget, slik at besøkende kan chatte på nettstedet ditt uten å logge inn på ChatGPT. Kunnskapen, instruksjonene og integrasjonene administreres i Quickchat AI.
Kan jeg legge til en AI-chatbot på nettstedet mitt gratis?
Free-abonnementet i Quickchat AI støtter personlig, ikke-kommersiell læring og inkluderer 50 AI-kreditter per måned. Et bedriftsnettsted eller en kundevendt løsning for salg og support trenger et abonnement som tillater kommersiell bruk. Abonnement på nettstedbyggeren kommer i tillegg, og testing bruker også AI-kreditter.
Må jeg programmere eller oppgi en API-nøkkel?
Grunnoppsettet bruker innstillinger i kontrollpanelet og en utvidelse, appinnbygging eller et medfølgende skript. Kodesnutten for nettstedet inneholder en offentlig Scenario ID, ikke en privat API-nøkkel. Tilkobling av en valgfri CRM-Action krever et egnet endepunkt og tilhørende autentisering; oppbevar denne legitimasjonen i innstillingene for Action.
Kan en chatbot på nettstedet samle inn leads og tilbudsforespørsler?
Ja. Smart Data Gathering spør etter valgte felt i samtalen og lagrer dem i Inbox. Email new leads kan varsle agentens administratorer etter at en e-postadresse eller et telefonnummer er samlet inn. En API Action kan sende de påkrevde lagrede feltene til en konfigurert mottaker; et innsamlet navn alene utgjør ikke en fullstendig forespørsel.
Kan en person overta chatten?
Ja. Konfigurer Human Handoff med bemannede åpningstider og en melding for tiden utenfor åpningstidene. I Inbox velger du Assign to me for en samtale uten tildeling, eller Take over når den kontrollen vises, og svarer deretter den besøkende. Reassign to AI gir samtalen tilbake til agenten.
Fungerer det på WordPress, Shopify, Squarespace, Wix og Webflow?
Alle har en installasjonsmetode. Bruk den offisielle WordPress-utvidelsen, Shopifys appinnbygging etter at butikkagenten er koblet til, eller en passende kodesnutt i bunnteksten eller slutten av body på hele nettstedet for en eksisterende agent. Tilgang til utvidelser og abonnementskrav for egendefinert kode varierer mellom nettstedbyggerne.
Hvorfor vises ikke chatboten på nettstedet mitt?
Kontroller den publiserte siden, at Scenario ID er riktig, og at kodesnutten er plassert på slutten av sidens body. Fjern gamle duplikatinstallasjoner og unngå iframe-baserte blokker når du bruker den flytende widgeten (Widget). Hvis den åpnes, men ikke kan svare, kontroller Widget & Embed access og tilgjengelige AI-kreditter.
Vil chatboten gjøre nettstedet mitt tregere?
Widgetens lasteskript lastes ned asynkront, men legger likevel til JavaScript og nettverksforespørsler. Sammenlign lasteytelse og respons ved bruk før og etter installasjonen på representative sider og en telefon. Asynkron lasting betyr ikke at ytelsen er upåvirket.
Fungerer chatboten på telefoner?
Den åpne widgeten bruker fullskjermvisning under 768 CSS-piksler. Test startknappen, tastaturet, rulling og lukkekontrollen på en telefon. La Auto-open Widget være av når automatisk åpning ville forstyrre nettlesingen.
Kan chatboten svare på de besøkendes språk?
Agenten kan svare på den besøkendes språk. Oversettelse av den faste velkomstteksten, samtalestarterne og widgetetikettene er en separat innstilling i betalte abonnementer. Test både fakta i svaret og grensesnittets tekst for hvert språk du vil støtte.