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.
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.
- Halte das Widget minimal: einfache Farben, klarer Titel und eine kurze Begrüßung.
3. Das Widget auf deiner Website installieren
Standard-Installation (empfohlen).
- 1Kopiere das Widget-Skript aus Channels -> Widget -> Install code
- 2Füge es so zu deiner Website hinzu, dass es auf jeder Seite lädt.
- 3Bester Ort: innerhalb von <head>, vor </head>.
- 4Wenn <head> nicht verfügbar ist, platziere es vor </body> (funktioniert ebenfalls, lädt aber eventuell etwas langsamer).
- 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.
- 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.