Pridanie chatbota ChatLab na váš web Webflow umožňuje návštevníkom komunikovať s vaším AI asistentom priamo na stránke. Tento návod vás prevedie krokmi na získanie kódu na vloženie (embed) zo služby ChatLab a jeho vloženie do Webflow.
Skôr ako začnete
Skôr ako začnete, vytvorte si chatbota a skontrolujte, či váš web alebo pracovný priestor vo Webflow zahŕňa prístup k vlastnému kódu (custom code). Pozrite si požiadavky Webflow na vlastný kód. Potrebujete tiež oprávnenie na úpravu a publikovanie webovej lokality.
Krok 1 - Skopírujte kód na vloženie z ChatLabu
- Prihláste sa do ChatLabu a vyberte chatbota, ktorého chcete vložiť
- Kliknite na kartu Deploy (Nasadenie) a potom na paneli platforiem vpravo vyberte Webflow
- Pre inštaláciu do hlavičky nižšie zvoľte Widget. Pre neustále viditeľný chat vyberte Iframe a postupujte podľa pokynov pre iframe nižšie. Porovnanie nájdete v článku Aký je rozdiel medzi widgetom a iframe?
- Kliknite na Copy to clipboard (Kopírovať do schránky)
Krok 2 - Pridajte kód do Webflow
Pridaním kódu v nastaveniach webu (Site Settings) umiestnite chatbota na každú stránku svojho webu vo Webflow.
- Otvorte svoj projekt v ovládacom paneli Webflow (Webflow Dashboard)
- Prejdite do Site settings > Custom code (Nastavenia webu > Vlastný kód)
- Vložte skopírovaný kód do sekcie Head Code (Kód v hlavičke)
- Kliknite na Save Changes (Uložiť zmeny)
- Kliknite na Publish (Publikovať), aby sa zmeny na webe prejavili
Pridanie iba na jednu stránku
Ak chcete chatbota umiestniť iba na konkrétnu stránku a nie na celý web:
- Otvorte stránku vo Webflow Designer
- Kliknutím na ikonu ozubeného kolieska otvorte nastavenia stránky (Page Settings)
- Prejdite nadol k sekcii Custom Code (Vlastný kód)
- Vložte kód do poľa Head Code (Kód v hlavičke)
- Uložte a publikujte svoj web
Pridanie trvalo viditeľného prvku iframe
Vo Webflow Designer umiestnite prvok Code Embed (Vložený kód) na miesto, kde chcete mať chatbota, vložte kód Iframe z ChatLabu a nastavte jeho šírku a výšku podľa rozloženia stránky. Uložte a publikujte web. Iframe patrí do obsahu stránky, nie do sekcie Head Code (Kód v hlavičke).
Overenie inštalácie
Po publikovaní otvorte svoj web Webflow v prehliadači. V rohu stránky by sa mala zobraziť ikona chatu (v režime widgetu) alebo okno chatu vložené priamo na stránke (v režime iframe). Kliknite na ikonu, otvorte chat a odošlite testovaciu správu, aby ste overili, že všetko správne funguje.