Chatbot einrichten

Website-Einbindung

Binden Sie den Chatbot mit einem Script-Tag ein und legen Sie fest, wo er laufen darf.

Script einfügen

Einrichtung › Website-Einbindung

Kopieren Sie den Einbettungscode aus dem Dashboard und fügen Sie ihn direkt vor dem schließenden </body>-Tag ein. Fügen Sie ihn auf jeder Seite ein, auf der der Chatbot erscheinen soll, oder einmal in einer Vorlage, die alle Seiten nutzen. Das Attribut defer sorgt dafür, dass Ihre Seite nicht langsamer lädt.

HTML

<script defer src="https://cdn.swai.chat/chatbot-public/frontend/loader.js?chatbotId=YOUR_CHATBOT_ID"></script>

Die Einbindung auf einer Live-Website erfordert einen kostenpflichtigen Plan. Testen Sie während der Testphase mit der Vorschau im Dashboard.

Wo Sie den Code einfügen

WordPress: Mit einem Plugin für Header- und Footer-Scripts oder über die Custom-Code-Einstellung Ihres Themes.
Webflow: Site settings › Custom code › Footer code, danach veröffentlichen.
Shopify: Onlineshop › Themes › Code bearbeiten › theme.liquid, vor </body>.
Wix: Einstellungen › Benutzerdefinierter Code › Code hinzufügen, Platzierung «Body – Ende» auf allen Seiten.
HTML: Fügen Sie ihn in Ihre Seitenvorlage vor </body> ein.

Verwenden Sie immer einen Custom-Code-, Embed- oder HTML-Block. Textblöcke in Website-Baukästen entfernen Scripts.

Anzeigemodi

Mit dem Parameter mode wählen Sie, wie der Chatbot erscheint. Jeden Modus können Sie mit den Vorschau-Schaltflächen im Dashboard ausprobieren.

bubble (Standard): Eine Chat-Schaltfläche in der unteren Ecke, die das Chatfenster öffnet. Die richtige Wahl für die meisten Websites.
floating: Ein Eingabefeld unten auf der Seite, das Besucher einlädt, direkt eine Frage zu stellen.
embedded: Der Chat füllt seinen Container, etwa für eine eigene Hilfe- oder Chat-Seite. Achten Sie darauf, dass der Container eine Höhe hat.

Parameter

Hängen Sie Parameter mit & an die Script-URL an:

HTML

<script defer src="https://cdn.swai.chat/chatbot-public/frontend/loader.js?chatbotId=YOUR_CHATBOT_ID&mode=floating"></script>

chatbotId: Pflicht. Die ID Ihres Chatbots, im kopierten Einbettungscode bereits ausgefüllt.
mode: bubble, floating oder embedded. Standard: bubble.
openOnLoad: true öffnet den Chat beim Laden der Seite. Gilt für die Modi bubble und floating, im Modus embedded hat es keine Wirkung. Schließt ein Besucher den Chat, bleibt er in diesem Browser-Tab geschlossen und öffnet sich in einem neuen Tab oder einer neuen Browser-Sitzung automatisch wieder. Standard: aus.

Domain-Einschränkung

Tragen Sie unter Domain-Einschränkungen die Adresse der Website ein, auf der der Chatbot läuft, zum Beispiel https://www.example.com. Der Chatbot funktioniert dann nur dort. So können andere Websites ihn nicht mit Ihrem Einbettungscode einbinden und Ihr Nachrichtenkontingent aufbrauchen.

Die Domain-Einschränkung schützt vor dem Einbinden auf anderen Websites, ist aber keine Zugriffskontrolle. Sie prüft die Website-Adresse, die der Browser bei jeder Anfrage mitsendet, und ein Skript ausserhalb eines Browsers kann diese Adresse fälschen. Behandeln Sie den Chatbot und seine Wissensdatenbank deshalb nicht als vertraulich.

Die Domain muss übereinstimmen: www.example.com und example.com gelten als dieselbe Domain, jede andere Subdomain wie shop.example.com dagegen als eigene Domain.