OneTwoAgent

Website-Widget

Mit dem OneTwoAgent-Widget können Kund:innen dir direkt von deiner Website auf Desktop und Mobil schreiben, während alle Chats im Conversations-Postfach landen.

KI-Website-Chat-WidgetLead-Erfassung aus Website-ChatNo-Code-Webchat-SetupKundenkommunikation auf deiner Website

Was dieser Artikel abdeckt

  • Wie du Design und Verhalten des Widgets anpasst.
  • Wie du das Widget auf deiner Website installierst.
  • Wie du Sicherheitseinstellungen wie erlaubte Domains und ausgeschlossene Seiten anwendest.

1. Widget-Einstellungen öffnen

Gehe zu Channels -> Widget. Wenn das Widget noch nicht aktiviert ist, aktiviere es zuerst.

  • Widget-Vorschau.
  • Anpassungseinstellungen.
  • Installationscode.

2. Das Widget-Design anpassen

Du kannst das Widget an fast jeden Website-Stil anpassen.

  • Widget-Farben: Button-Farbe, Hintergrund, Textfarben und Akzentfarbe.
  • Typografie: Schriftfamilie oder Stil-Presets sowie Schriftgröße, sofern verfügbar.
  • Icon und Markenelemente: Launcher-Icon, Unternehmensname im Header sowie optionaler Untertitel oder kurze Begrüßung.
  • Position und Layout: unten rechts oder unten links, Abstand zu den Bildschirmrändern und Verhalten auf Mobilgeräten.
  • Verhalten: Auto-Open vs. nur per Klick, Sichtbarkeit der Begrüßung, alle Seiten oder ausgewählte Seiten.
Hinweise
  • Halte das Widget minimal: einfache Farben, klarer Titel und eine kurze Begrüßung.

3. Das Widget auf deiner Website installieren

Standard-Installation (empfohlen).

  1. 1Kopiere das Widget-Skript aus Channels -> Widget -> Install code
  2. 2Füge es so zu deiner Website hinzu, dass es auf jeder Seite lädt.
  3. 3Bester Ort: innerhalb von <head>, vor </head>.
  4. 4Wenn <head> nicht verfügbar ist, platziere es vor </body> (funktioniert ebenfalls, lädt aber eventuell etwas langsamer).
Hinweise
  • Nach Installation und Veröffentlichung sollte das Widget auf deiner Live-Seite erscheinen.

4. Auf gängigen Plattformen installieren

  • Shopify: Online Store>Themes>Edit code -> layout/theme.liquid -> vor </head> einfügen -> Save
  • Wix Option A: Settings -> Custom Code -> Add New Tool -> Code einfügen -> Load on all pages -> in Head platzieren -> Save und veröffentlichen.
  • Wix Option B: Füge das Skript über den globalen Site-Scripts-/Plugin-Bereich hinzu und stelle sicher, dass es auf allen Seiten lädt.
  • Webflow: Project Settings>Custom Code>in Head Code einfügen -> Save und veröffentlichen.
  • WordPress: Nutze ein Header-Scripts-Plugin (Header-Bereich) oder füge es in header.php vor </head> ein.
  • Custom-coded Sites: Platziere das Skript im globalen HTML-Template innerhalb von <head> oder vor </body>.

Oder sende das an deinen Entwickler

6. Sicherheits- und Steuerungseinstellungen

Empfohlene Einstellungen für ein sichereres und saubereres Verhalten.

  • Erlaubte Domains: verhindern, dass Widget-Code auf fremden Websites wiederverwendet wird.
  • Beispiel-Domains: yourdomain.com, www.yourdomain.com, shop.yourdomain.com.
  • Ausgeschlossene Seiten: blende das Widget dort aus, wo es nicht relevant ist.
  • Häufige Ausschlüsse: checkout, Bestellbestätigung, account/login, Datenschutz- und technische Seiten.
  • Pfadbeispiele: /checkout, /account, /thank-you.
Hinweise
  • Starte einfach: aktiviere das Widget überall und schließe erst dann nur die Seiten aus, die du wirklich nicht möchtest.

7. Wie Widget-Chats in OneTwoAgent funktionieren

  • Wenn ein Kunde im Widget eine Nachricht sendet, erscheint eine neue Konversation in Conversations.
  • Du kannst jederzeit manuell antworten.
  • Wenn Auto Sales aktiviert ist, kann der Assistent automatisch mit deinem Setup und Katalog antworten.

Fehlerbehebung

  • Widget wird nicht angezeigt: bestätige, dass das Skript auf der Live-Seite liegt (nicht nur in der Vorschau), veröffentliche die Änderungen und prüfe erlaubte Domains, falls aktiviert.
  • Widget erscheint nur auf manchen Seiten: prüfe ausgeschlossene Seitenregeln und bestätige, dass das Skript global installiert ist.
  • Nachrichten kommen nicht an: prüfe, ob das richtige OneTwoAgent-Business-Konto verwendet wird, und stelle sicher, dass das Widget in Channels -> Widget aktiviert ist.

Verwandte Anleitungen

Mach mit den nächsten Einrichtungsschritten rund um Kanäle, Buchungen, Terminplanung oder Automatisierung weiter.

Häufige Fragen

Kann ich das Widget ohne vollständige Custom-Integration installieren?

Ja. Das normale Setup besteht aus einem einzelnen Widget-Skript auf deiner Website sowie Design- und Verhaltenseinstellungen im Dashboard.

Funktioniert das Widget auf Mobilgeräten genauso wie auf Desktop?

Ja. Das Widget ist für Desktop- und Mobil-Besucher gedacht, und die Gespräche erscheinen im selben Posteingang.

Brauchst du Hilfe?

support@onetwoagent.com