Hvordan legger jeg til ChatLab på Webflow-nettstedet mitt?

I ChatLab går du til fanen Deploy (publisering), velger Webflow og kopierer koden. I Webflow går du til Site Settings (nettstedinnstillinger) > Custom Code (egendefinert kode), limer inn koden i delen Head Code, og deretter lagrer og publiserer du nettstedet ditt.

Trenger jeg en betalt Webflow-plan for å legge til en chatbot?

Nettstedet eller arbeidsområdet ditt må inkludere tilgang til egendefinert kode (custom code). En kvalifisert Workspace-plan kan også gi denne tilgangen - en betalt Site-plan er ikke den eneste måten.

Kan jeg legge til chatboten på en enkelt side i stedet for hele nettstedet?

Ja. I stedet for å bruke Site Settings (nettstedinnstillinger), åpner du siden i Webflow Designer, går til Page Settings (sideinnstillinger) og limer inn koden i delen Head Code for den spesifikke siden.

Slik legger du til chatboten på et Webflow-nettsted

Å legge til en ChatLab-chatbot på Webflow-nettstedet ditt lar besøkende samhandle med AI-assistenten din direkte på nettstedet. Denne veiledningen går gjennom trinnene for å hente innbyggingskoden din fra ChatLab og lime den inn i Webflow.

Før du starter

Før du starter, bør du opprette chatboten din og kontrollere at Webflow-nettstedet eller arbeidsområdet ditt har tilgang til tilpasset kode. Se Webflows krav til tilpasset kode. Du må også ha tillatelse til å redigere og publisere nettstedet.

Trinn 1 - Kopier innbyggingskoden fra ChatLab

Logg inn på ChatLab og velg chatboten du vil bygge inn
Klikk på fanen Deploy (publiser), og velg deretter Webflow fra plattformpanelet til høyre

Velg Widget for hodeinstallasjonen nedenfor. For en alltid synlig chat, velg Iframe og følg iframe-instruksjonene nedenfor. Se Hva er forskjellen mellom widget og Iframe? for en sammenligning
Klikk på Copy to clipboard (kopier til utklippstavle)

Trinn 2 - Legg til koden i Webflow

Hvis du legger til koden i Site Settings (nettstedsinnstillinger), plasseres chatboten på hver side av Webflow-nettstedet ditt.

Åpne prosjektet ditt i Webflow Dashboard
Gå til Site settings > Custom code
Lim inn den kopierte koden i feltet Head Code
Klikk på Save Changes (lagre endringer)
Publish (publiser) nettstedet ditt for at endringene skal tre i kraft

Legge til på bare én enkelt side

Hvis du vil ha chatboten på en bestemt side i stedet for på hele nettstedet:

Åpne siden i Webflow Designer
Klikk på tannhjulikonet for å åpne Page Settings (sideinnstillinger)
Rull ned til delen Custom Code
Lim inn koden i feltet Head Code
Lagre og publiser nettstedet ditt

Legge til en alltid synlig iframe

I Webflow Designer plasserer du et Code Embed-element der du vil ha chatboten, limer inn Iframe-kodesnutten fra ChatLab, og angir bredde og høyde tilpasset oppsettet ditt. Lagre og publiser nettstedet. En iframe hører hjemme i selve sideinnholdet, ikke i Head Code.

Verifisere installasjonen

Etter publisering åpner du Webflow-nettstedet ditt i en nettleser. Du skal se at chat-ikonet dukker opp i hjørnet av siden (for widget-modus) eller at chat-vinduet er innebygd på siden (for iframe-modus). Klikk på ikonet for å åpne chatten og send en testmelding for å bekrefte at alt fungerer.