Zum Inhalt springen
intoCHAT

Framer-Integration

KI-Chatbot für deine Framer-Website

Trainiere einen Agenten mit deinen Framer-Seiten und Dokumenten und binde ihn mit einem Script unter Custom Code auf der ganzen Website ein. Er fügt sich in dein Design ein und antwortet aus deinen eigenen Inhalten.

Agent kostenlos erstellen

Zuletzt aktualisiert:

So funktioniert intoCHAT auf Framer

In Framer kannst du über die Custom-Code-Einstellungen Scripts für die ganze Website hinzufügen. intoCHAT braucht dort ein einziges Script-Tag am Ende des Body, und eine Chat-Bubble erscheint in der Ecke jeder veröffentlichten Seite. Der Agent antwortet aus dem, was du ihm gibst, etwa deinen Framer-Seiten, PDFs und Q&A-Paaren, und sagt, wenn er etwas nicht weiß. Das Aussehen des Chats gestaltest du in intoCHAT, Farben, Avatar oder Begrüßung änderst du also, ohne Framer neu zu veröffentlichen.

intoCHAT auf Framer installieren

  1. Agenten erstellen und trainieren

    Registriere dich bei intoCHAT, erstelle einen Agenten und gib im Tab Knowledge die Adresse deiner Framer-Website ein. intoCHAT findet bis zu 500 Seiten, rendert JavaScript vor dem Lesen und lässt dich auswählen, 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. Script unter Custom Code hinzufügen

    Öffne in Framer die Project Settings und wähle den Tab Custom Code. Klicke auf Add Script, gib einen Namen wie intoCHAT ein und füge den Code ein.

  4. Position und Häufigkeit festlegen

    Platziere das Script am Ende des Body, lass es auf allen Seiten aktiv und stelle es auf Once statt auf jeden Seitenbesuch.

  5. Veröffentlichen und live prüfen

    Framer lädt eigenen Code nicht in der Canvas-Vorschau. Veröffentliche die Website und öffne die Live-Seite: Die Chat-Bubble erscheint unten in der Ecke, mit deinen Einstellungen aus Appearance.

Der Code für Custom Code in Framer

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

Platziere ihn am Ende des Body, nicht im Head, und lass ihn einmal laufen. Das Script hängt die Chat-Bubble an den Body, sobald es läuft, der Body muss also existieren, und jeder weitere Durchlauf würde eine zweite Bubble hinzufügen.

Was der Agent auf deiner Framer-Website macht

  • Liest deine Framer-Seiten

    intoCHAT findet Seiten über Sitemap und Links und rendert JavaScript vor dem Lesen, sieht deine Inhalte also so wie Besucher. Pfade, die nicht hineingehören, schließt du per Muster aus.

  • Testen vor dem Veröffentlichen

    Probiere den Agenten im Playground mit temporären Chats aus, verfeinere Anweisungen und Quellen und binde ihn erst ein, wenn die Antworten stimmen.

  • Sammelt Leads

    Frag im Chat nach E-Mail-Adresse oder Telefonnummer, nach Regeln wie einer bestimmten Anzahl von Nachrichten oder Stichwörtern, oder lass die KI entscheiden. Neue Leads kommen per E-Mail.

  • Passt zu deinem Design

    Lege Farben für Bubble, Kopfzeile und Nachrichten, Avatar, Launcher-Icon, Hinweistext und Position fest oder übernimm Logo und Farben von deiner Website-Adresse.

  • Antwortet in der Sprache des Besuchers

    Der Agent antwortet in der Sprache, in der Besucher schreiben, ein Agent reicht also für alle Sprachversionen deiner Website.

  • Löst Aktionen auf deiner Seite aus

    Registriere JavaScript-Funktionen mit window.IntoChatActions.register, und der Agent kann sie während des Chats aufrufen, zum Beispiel um ein Formular auf deiner Seite zu öffnen.

Häufige Fragen

Warum sehe ich den Chat nicht in der Framer-Canvas?

Framer lädt eigenen Code nicht in der Canvas-Vorschau. Veröffentliche deine Website und öffne die Live-Seite im Browser, dann erscheint die Chat-Bubble unten in der Ecke.

Macht intoCHAT meine Framer-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 soll das Script nur einmal laufen?

Das Script fügt bei jedem Durchlauf eine Chat-Bubble hinzu. Läuft es nur einmal, sehen Besucher genau eine Bubble, auch wenn sie zwischen Seiten wechseln. Die Position am Ende des Body sorgt außerdem dafür, dass der Body beim Start schon existiert.

Liest der Agent meine Framer-CMS-Seiten?

Ja, wenn sie in deiner Sitemap stehen oder verlinkt sind und du sie im Tab Knowledge auswählst. Quellen synchronisieren sich nicht von selbst, füge neue CMS-Seiten also hinzu oder trainiere geänderte neu, wenn du Updates veröffentlichst.

Kann der Agent Besuchern in anderen Sprachen antworten?

Ja. Der Agent antwortet in der Sprache, in der Besucher schreiben, mit demselben Wissen. Hat deine Framer-Website weitere Sprachversionen, füge auch diese Seiten hinzu, damit der Agent die übersetzten Formulierungen nutzen kann.

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

Nein. Das Script enthält nur deine Agenten-ID. Farben, Position, Begrüßung, Vorschlagsfragen 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.