Website-Widget

• Was Kunden im Widget tun können: Chat, Voice, Screenshots und Dateien, in ihrer eigenen Sprache.
• 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.

Der KI-Support-Agent beantwortet jede Widget-Konversation aus deiner Wissensdatenbank. Bei angemeldeten Kunden nutzt er außerdem die Kontodaten, die dein Backend freigibt.

• In ihrer eigenen Sprache chatten: Der Agent antwortet in der Sprache, in der der Kunde schreibt.
• Talk (Voice): Kunden können mit dem Agenten sprechen. Die Sprache wird automatisch erkannt, und Voice antwortet in 40+ Sprachen laut; wo keine gesprochene Ausgabe unterstützt wird, geht das Gespräch als Text weiter. Voice-Minuten sind in den kostenpflichtigen Tarifen enthalten.
• Screenshots und Dateien senden: Bilder, Screenshots und Fotos sowie PDF-, DOC-, DOCX- und TXT-Dateien bis 8 MB. Bilder werden per Bilderkennung gelesen; PDF- und Word-Dokumente werden einschließlich Tabellen ausgewertet.
• Links einfügen: Der Agent liest die verlinkte Seite als Kontext für diese Konversation. Links von Kunden sind Kontext, nicht dein freigegebenes Wissen.
• Einen Menschen erreichen: Wenn der Agent eine Antwort nicht verifizieren kann, übergibt er die Konversation an dein Team, statt zu raten, und jedes Teammitglied kann sie im Posteingang übernehmen.

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

• Live-Vorschau von Home, Chat und Talk auf Desktop und Mobilgeräten.
• Design- und Verhaltenseinstellungen.
• Installationscode.

Passe das Widget an dein Produkt an, ohne CSS zu schreiben. Jede Änderung erscheint beim Bearbeiten direkt in der Live-Vorschau.

• Oberflächen: Home, Chat und Talk (Voice). Du legst fest, welche sich zuerst öffnet.
• Theme: hell oder dunkel.
• Farben: Header, Blasen von Assistent und Kunde, Chat-Hintergrund, Eingabefeld, Senden-Button, Launcher, Buttons und Schließen-Button.
• Typografie: 45 Google Fonts (serifenlos, mit Serifen und Monospace), getrennt einstellbar für Header, Nachrichten des Assistenten, Nachrichten des Kunden, Eingabefeld und Launcher, jeweils mit eigener Größe.
• Nachrichten: 6 Blasenformen, optional für beide Seiten, und eine Auswahl an Senden-Symbolen.
• Header: Name des Assistenten, Statuszeile und optional ein Avatar oder Logo.
• Launcher: 15 Symbole, optionaler Text (auf Mobilgeräten auf Wunsch nur das Symbol) und 13 Launcher-Animationen.
• Startbildschirm: Überschrift, eine kurze Zeile darüber, ein Haupt-Button, bis zu 3 Links, ein animierter Orb und Hintergrundstile wie Mesh, Halo, Strahlen, Leuchten, Sterne, Punkte, Körnung und Halbton, mit Reglern für Farbton, Intensität und Bewegung.
• Talk: Stimme, gesprochene Begrüßung und Orb-Textur.
• Texte und Verhalten: Begrüßungsnachricht, Platzhaltertext im Eingabefeld, Datei-Uploads an oder aus, Kompaktmodus, erlaubte Domains sowie erlaubte oder ausgeschlossene Seiten.

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).

• 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>.

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.

• Jede Widget-Konversation erscheint in Conversations, im selben Posteingang wie WhatsApp, Instagram und Telegram.
• Der KI-Support-Agent antwortet aus deiner Wissensdatenbank und bei angemeldeten Kunden aus freigegebenen Kontodaten, in der Sprache des Kunden.
• Jedes Teammitglied kann übernehmen und direkt antworten. Solange ein Teammitglied die Konversation betreut, bleibt die KI still; klicke auf Resume AI, um sie zurückzugeben.
• Im Widget sieht der Kunde "{name} joined the conversation", wenn ein Teammitglied antwortet, und "Assistant resumed", wenn die KI wieder antwortet.

• 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.