Genom att lägga till en ChatLab-chattbot på din Webflow-webbplats kan besökare interagera med din AI-assistent direkt på din sajt. Den här guiden går igenom stegen för att hämta din inbäddningskod från ChatLab och klistra in den i Webflow.
Innan du börjar
Innan du börjar ska du skapa din chattbot och kontrollera att din Webflow-webbplats eller workspace har stöd för anpassad kod. Se Webflows krav för anpassad kod. Du behöver också behörighet att redigera och publicera webbplatsen.
Steg 1 - Kopiera inbäddningskoden från ChatLab
- Logga in på ChatLab och välj den chattbot du vill bädda in
- Klicka på fliken Deploy (Publicera), och välj sedan Webflow i plattformspanelen till höger
- Välj Widget för installationen i sidhuvudet nedan. För en chatt som alltid är synlig väljer du Iframe och följer instruktionerna för iframe längre ner. Se Vad är skillnaden mellan widget och iframe? för en jämförelse
- Klicka på Copy to clipboard (Kopiera till urklipp)
Steg 2 - Lägg till koden i Webflow
Om du lägger till koden i Site Settings (Webbplatsinställningar) placeras chattbotten på varje sida på din Webflow-webbplats.
- Öppna ditt projekt i Webflow Dashboard
- Gå till Site settings > Custom code
- Klistra in den kopierade koden i sektionen Head Code
- Klicka på Save Changes (Spara ändringar)
- Välj Publish (Publicera) för din webbplats för att ändringarna ska börja gälla
Lägg endast till på en enskild sida
Om du vill ha chattbotten på en specifik sida i stället för hela webbplatsen:
- Öppna sidan i Webflow Designer
- Klicka på kugghjulsikonen för att öppna Page Settings (Sidinställningar)
- Rulla ner till sektionen Custom Code
- Klistra in koden i fältet Head Code
- Spara och publicera din webbplats
Lägg till en alltid synlig iframe
Placera ett Code Embed-element (Kodinbäddning) i Webflow Designer där du vill ha chattbotten, klistra in kodavsnittet för Iframe från ChatLab och ställ in bredd och höjd för din layout. Spara och publicera webbplatsen. En iframe hör hemma i sidans innehåll, inte i Head Code.
Verifiera installationen
När du har publicerat öppnar du din Webflow-webbplats i en webbläsare. Du bör se chattikonen dyka upp i hörnet av sidan (för widget-läget) eller chattfönstret inbäddat på sidan (för iframe-läget). Klicka på ikonen för att öppna chatten och skicka ett testmeddelande för att bekräfta att allt fungerar.