Zum Inhalt springen

Webflow-Integration

KI-Chatbot für deine Webflow-Website

Trainiere einen Agenten mit deinen Webflow-Seiten, CMS-Inhalten und Dokumenten und füge ihn mit einer Zeile im Footer-Code auf jeder Seite ein. Teste ihn im Playground, bevor du veröffentlichst.

Agent kostenlos erstellen

Zuletzt aktualisiert:

So funktioniert intoCHAT auf Webflow

In Webflow kannst du in den Site settings eigenen Code für die ganze Website hinterlegen. intoCHAT braucht dort ein einziges Script-Tag im Footer-Code, und die Chat-Bubble erscheint auf jeder veröffentlichten Seite. Der Agent antwortet aus den Inhalten, die du ihm gibst, etwa Webflow-Seiten, CMS-Einträgen, PDFs und Q&A-Paaren, und sagt, wenn er keine Antwort findet. Farben, Avatar und Begrüßung verwaltest du in intoCHAT: Du veröffentlichst einmal und kannst den Agenten jederzeit ändern.

intoCHAT auf Webflow installieren

  1. Agenten erstellen und trainieren

    Registriere dich bei intoCHAT, erstelle einen Agenten und gib im Tab Knowledge die Adresse deiner Webflow-Website ein. intoCHAT findet über Sitemap und Links bis zu 500 Seiten, und du wählst aus, welche dazugehören.

  2. Script-Tag kopieren

    Öffne den Tab Share und kopiere den Code unter Bubble Chat. Deine Agenten-ID ist schon enthalten.

  3. In den Footer code einfügen

    Öffne in Webflow die Site settings und dort den Tab Custom code. Füge das Script in das Feld Footer code ein, nicht in Head code, und klicke auf Save changes.

  4. Website veröffentlichen

    Eigener Code geht erst mit dem Veröffentlichen live. Veröffentliche die Website und öffne die Live-Adresse: Die Chat-Bubble erscheint unten in der Ecke, mit deinen Einstellungen aus Appearance.

Der Code für deinen Webflow-Footer

<script src="https://www.intochat.ai/api/embed.js" data-chatbot-id="YOUR_AGENT_ID"></script>

Füge ihn in Footer code ein, nicht in Head code. Das Script hängt die Chat-Bubble an den Body der Seite, sobald es läuft, deshalb muss es innerhalb des Body geladen werden.

Was der Agent auf deiner Webflow-Website macht

  • Liest Seiten und CMS-Inhalte

    intoCHAT findet Seiten über Sitemap und Links, auch CMS-Seiten wie Blogartikel. Du wählst die Seiten aus und kannst Pfade per Muster ausschließen.

  • Antwortet aus deinen Inhalten

    Antworten stammen aus deinen Quellen, gefunden per semantischer und Stichwortsuche. Eingebaute Regeln halten den Agenten bei deinen Inhalten, wehren Prompt-Injection ab und lassen ihn sagen, wenn er etwas nicht weiß.

  • Macht Besucher zu Leads

    Frag im Chat nach E-Mail-Adresse oder Telefonnummer, manuell, nach Regeln oder wenn die KI es für passend hält. Jeder neue Lead kommt per E-Mail, und alle Leads lassen sich als CSV exportieren.

  • Ruft deine eigenen APIs auf

    Mit eigenen API-Aktionen fragt der Agent während des Chats deine HTTP-Endpunkte ab, mit Bearer-Token, Basic Auth oder API-Key. Bis zu 25 Aktionen pro Agent.

  • Passt zu deinem Design

    Stimme Farben, Avatar, Launcher-Icon, Hinweistext und Position auf dein Webflow-Design ab oder übernimm Logo und Farben von deiner Website-Adresse.

Häufige Fragen

Welchen Webflow-Plan brauche ich?

Webflow erlaubt eigenen Code für die ganze Website, wenn die Website einen aktiven Site-Plan hat oder zu einem Core-, Growth-, Agency- oder Freelancer-Workspace gehört. intoCHAT hat einen eigenen kostenlosen Plan mit 25 Nachrichten pro Monat, du kannst den Agenten also zuerst ausprobieren.

Macht intoCHAT meine Webflow-Website langsamer?

Das Script ist eine einzelne Datei, die am Ende des Seiten-Body lädt, also nach deinen Inhalten. Das Chatfenster läuft in einem eigenen iframe von intoCHAT, sein Code bleibt also vom Code deiner Website getrennt.

Warum sehe ich die Chat-Bubble nicht?

Eigener Code geht erst mit dem Veröffentlichen live, veröffentliche also nach dem Speichern und prüfe die Live-Adresse. Achte darauf, dass das Script in Footer code steht und nicht in Head code, denn es braucht beim Start einen vorhandenen Body. Vergleiche außerdem die Agenten-ID im Code mit der im Tab Share.

Kann ich den Chat nur auf einzelnen Seiten zeigen?

Ja. Lass den Footer code der ganzen Website leer und öffne die Page settings jeder Seite, auf der der Chat erscheinen soll. Füge das Script unter Custom code in den Abschnitt Before </body> tag ein, speichere und veröffentliche.

Kennt der Agent neue CMS-Einträge automatisch?

Erst, wenn du sie hinzufügst. intoCHAT synchronisiert Quellen nicht automatisch, füge neue CMS-Seiten nach dem Veröffentlichen also im Tab Knowledge hinzu oder trainiere geänderte Seiten neu.

Muss ich Webflow neu veröffentlichen, wenn ich den Agenten ändere?

Nein. Das Script enthält nur deine Agenten-ID. Farben, Position, Begrüßung und Wissen lädt es bei jedem Seitenaufruf von intoCHAT, Änderungen erscheinen also ohne neue Veröffentlichung.

Sieh, wie er mit deiner Website antwortet

Gib die Adresse deiner Website ein und chatte mit einem Agenten, der aus deinen Seiten gebaut wird. Das dauert etwa eine Minute.

Agent kostenlos erstellen

Kostenloser Plan, keine Kreditkarte nötig.