Verkauf & Kanäle

Web-Chat einbetten

In diesem Bereich machen Sie Ihren fertig konfigurierten Agenten für Ihre Kundschaft zugänglich – als Chat-Fenster auf Ihrer Website, als geteilten Link oder (für Technikaffine) per Programmierschnittstelle. Sie öffnen ihn im Dashboard über die linke Navigation unter "Operate" → "Embed" (das Code-Symbol). Hinweis: Dieser Tab ist als erweiterte Einstellung ("advanced") markiert – er erscheint also gegebenenfalls erst, wenn Sie die erweiterten Optionen einblenden.

Wichtig vorab: Alle hier gezeigten öffentlichen Seiten funktionieren nur, wenn der Agent aktiv geschaltet ist. Ist der Agent inaktiv (oder gelöscht), liefert die öffentliche Adresse die Meldung "agent_not_found" und das Chat-Fenster bleibt leer. Schalten Sie den Agenten also vor dem Einbetten scharf.

Die Seite "Einbetten & API" zeigt Ihnen drei Wege ("Drei Wege, diesen Agent für Ihre Nutzer zugänglich zu machen"). Jeder Block hat einen "Kopieren"-Knopf (wird nach dem Klick kurz zu "Kopiert"), beim ersten Block zusätzlich einen "Öffnen"-Knopf, der die Live-Vorschau in einem neuen Browser-Tab startet. Es gibt hier bewusst keine Eingabefelder zum Bearbeiten – Aussehen und Texte des Widgets steuern Sie an anderer Stelle (siehe unten).

Die drei Integrationswege

Schritt 1: Hosted Chat-Link (die fertige Chat-Seite)

Was es ist: Eine fertige, von Prezio gehostete Chat-Seite unter der Adresse …/embed/{Agent-ID}. Im Block "Hosted Chat-Link" steht die vollständige URL.
Wofür: Zum schnellen Teilen – per E-Mail-Signatur, in der Instagram-/Google-Bio, als QR-Code auf dem Tisch oder Flyer. Wie im Dashboard beschrieben: "Teilen Sie diese URL — jeder mit dem Link erhält das Chat-Widget."
Empfehlung: Klicken Sie zuerst auf "Öffnen" und schreiben Sie eine Testnachricht, bevor Sie den Link verteilen. So sehen Sie genau das, was Ihre Kundschaft sehen wird.

Schritt 2: Embed-Snippet (Chat-Fenster auf der eigenen Website)

Was es ist: Ein fertiger HTML-Schnipsel im Block "Embed-Snippet", der das Chat-Fenster als eingebetteten Rahmen (<iframe>) auf Ihrer Seite anzeigt.
So gehen Sie vor: Klicken Sie auf "Kopieren" und fügen Sie den Code an der gewünschten Stelle in Ihre Website ein (bzw. übergeben Sie ihn Ihrer Webagentur). Im Hilfetext steht: "In eine beliebige HTML-Seite einfügen, um das Chat-Widget einzubetten."
Die Voreinstellungen im Schnipsel:
Breite/Höhe: standardmäßig width="420" und height="640" (Pixel). Sie können diese Zahlen direkt im kopierten Code anpassen, z. B. für ein größeres Fenster.
Rahmen & Ecken: ohne sichtbaren Rahmen und mit leicht abgerundeten Ecken (border-radius:12px).
Berechtigungen: der Rahmen erlaubt Mikrofon und Zahlungen (allow="microphone; payment *") – relevant, falls künftig Sprach- oder Bezahlfunktionen im Fenster genutzt werden. Lassen Sie diese Angabe im Code stehen, auch wenn Sie sie aktuell nicht brauchen.
Empfehlung: Betten Sie das Fenster auf einer gut sichtbaren Unterseite ein (z. B. "Kontakt" oder "Termin"). Für ein klassisches, kleines Sprechblasen-Widget unten rechts ist 420 × 640 ein guter Startwert.

Schritt 3: API (programmatisch) – nur für Entwickler

Was es ist: Ein curl-Beispiel, mit dem ein Programm direkt mit dem Agenten "spricht" (Block "API (programmatisch)").
Wofür: Nur relevant, wenn Sie oder Ihre Dienstleister den Chat in eine eigene App/Software einbinden möchten. Für die normale Website-Einbindung brauchen Sie diesen Block nicht.
Gut zu wissen: Wie im Hilfetext erklärt, liefert der Aufruf die Antwort plus eine conversation_id zurück; diese sollte man "für Folge-Calls wiederverwenden, um den Kontext zu erhalten". Eine Anmeldung/Authentifizierung ist für den öffentlichen Chat nicht nötig – "die Agent-ID reicht".

Wie das Chat-Fenster für Ihre Kundschaft aussieht

Das eingebettete Fenster zeigt:

Begrüßungsnachricht: die erste Nachricht des Agenten. Diese stammt aus dem Feld "Welcome message" / Begrüßungsnachricht in den Agent-Einstellungen (Voreinstellung: "Hello! How can I help you today?"). Passen Sie diese unbedingt an Ihre Sprache und Ihren Betrieb an – z. B. "Hallo! Wie kann ich Ihnen heute helfen?". Ist keine hinterlegt, zeigt das Fenster den Standard "Hallo! Wie kann ich Ihnen helfen?".
Name & Status: oben der Name des Agenten sowie ein grüner Punkt mit "Online".
Eingabefeld: Platzhalter "Nachricht eingeben…", Absenden per Enter (Zeilenumbruch mit Umschalt+Enter) oder über den Sende-Knopf.
Prezio-Hinweis: am unteren Rand ein dezenter "betrieben mit prezio"-Hinweis.

Die Antworten im Chat kommen aus derselben Wissensbasis und denselben Einstellungen wie auf allen anderen Kanälen. Bedenken Sie dabei die "Recall-First"-Logik der Wissenssuche: Findet sich kein perfekt passender Treffer (innerhalb des Schwellwerts kb_max_distance, Standard 0.5), nutzt der Agent trotzdem den besten Beinahe-Treffer (im Entscheidungsfluss gelb als "Recall-Fallback" markiert). Wenn Antworten im Web-Chat danebenliegen, prüfen Sie zuerst die Wissensbasis – verunreinigte, automatisch gecrawlte Seiten (Menü-/Footer-Textbausteine) verschlechtern die Trefferqualität; laden Sie in dem Fall sauberen Text neu hoch.

Öffentliche Buchungs- und Bestellseiten

Neben dem reinen Chat stehen – sofern Sie Buchungen bzw. Bestellungen aktiviert haben – eigene öffentliche Seiten bereit, die Sie ebenfalls verlinken oder als QR-Code verteilen können. Diese erscheinen nicht als Kopier-Block im Embed-Tab, haben aber feste Adressen:

Leistungskatalog (Services & Preise): unter …/services/{Agent-ID}. Eine schlanke, lesbare Übersicht Ihrer buchbaren Leistungen mit Dauer und Preis (überschrieben mit "Services & Preise", Untertitel "Wähle eine Leistung — und buche direkt online."). Ideal als Landing-Page, wenn jemand z. B. nach "Friseur XYZ Preise" googelt. Jede Zeile und der Knopf "Jetzt buchen" führen direkt in die Buchung.
Buchungs-Widget: unter …/embed/{Agent-ID}/book. Führt die Kundschaft Schritt für Schritt durch: 1. Leistung wählen (Name, Beschreibung, Dauer, Preis). 2. Uhrzeit wählen – freie Slots der nächsten 14 Tage, gruppiert nach Tag. Die Zeiten werden automatisch in der Zeitzone der Besucherin/des Besuchers angezeigt ("Zeitanzeige in Ihrer Zeitzone: …"). Gibt es keine freien Termine, kann sich die Person über "Auf Warteliste" eintragen (Name + E-Mail oder Telefon). 3. Ihre Daten – Name (Pflicht), E-Mail (Pflicht), Telefon und Notizen (beides optional). Bei hinterlegtem Aufnahmebogen ("Vor Ihrem Termin") werden zusätzlich Ihre Intake-Fragen abgefragt; mit * markierte Felder sind Pflicht. 4. Einwilligungen (DSGVO): Eine Marketing-Einwilligung ("…Termin-Erinnerungen und Angebote…") ist optional und standardmäßig nicht angehakt. Sammelt die gewählte Leistung besondere Datenkategorien (z. B. Gesundheitsdaten), erscheint zusätzlich eine gesonderte, verpflichtende Einwilligung nach Art. 9 DSGVO – ohne deren Häkchen lässt sich nicht abschließen. Ein Datenschutzhinweis ist immer sichtbar; ist keine eigene Datenschutzerklärung hinterlegt, wird auf die der Plattform zurückgegriffen (mit entsprechendem Hinweis). 5. Anzahlung (falls nötig): Verlangt die Leistung eine Anzahlung und ist Ihr Stripe-Konto bereit, folgt ein Bezahlschritt ("Anzahlung", "Bezahlen & Termin bestätigen"). Der Termin wird dann vorgemerkt, bis die Zahlung bestätigt ist. 6. Bestätigung: Erfolgsanzeige ("Termin gebucht") bzw. bei E-Mail-Verifizierung "Fast geschafft" mit dem Hinweis, dass der Bestätigungslink innerhalb von 30 Minuten geklickt werden muss (so lange bleibt der Termin reserviert).
Eigenes Branding: Diese öffentlichen Seiten tragen automatisch Ihren Namen, Ihr Logo und Ihre Markenfarben im Kopfbereich. Diese pflegen Sie nicht hier, sondern im Tab "Branding" (siehe entsprechendes Kapitel). Ist dort nichts gesetzt, wird der Agent-Name ohne Logo und ohne Farbtönung dargestellt.

Lead-Erfassung über den Web-Chat

Jeder Kontakt über das Web-Chat-Fenster kann – je nach Einstellung – automatisch als Lead in Ihrem CRM landen. Im CRM-Modus (auto_create_on_contact) wird jeder Kontakt auf allen Kanälen zum Lead – also auch Web-Chat, SMS, WhatsApp und E-Mail (Telefonanrufe erzeugen ohnehin immer einen Lead). Ist dieser Modus aus, entsteht ein Lead nur, wenn der Agent es selbst für sinnvoll hält (capture_lead). Das ist relevant, wenn Sie den Hosted-Link breit streuen und nicht von jeder Testnachricht einen Lead erhalten möchten.

Tipps & Stolpersteine

Agent zuerst aktiv schalten. Der häufigste Fehler: Link/Snippet wird verteilt, der Agent ist aber inaktiv → das Fenster zeigt nichts. Vor dem Verteilen über "Öffnen" testen.
Begrüßungsnachricht anpassen. Die Voreinstellung ist Englisch ("Hello! How can I help you today?"). Stellen Sie sie in den Agent-Einstellungen auf Ihre Sprache und Tonalität um – sie ist das Erste, was Ihre Kundschaft liest.
Branding gehört in den "Branding"-Tab, nicht hierher. Aussehen (Logo, Farben, Name) der öffentlichen Seiten steuern Sie dort; der Embed-Tab liefert nur die Adressen/Snippets.
Größe im Snippet selbst ändern. Standard ist 420 × 640 Pixel. Passt das nicht in Ihr Layout, ändern Sie die Zahlen width/height direkt im kopierten Code – dafür gibt es im Dashboard kein eigenes Feld.
allow="microphone; payment *" nicht entfernen. Auch wenn Sie heute kein Voice/Payment im Widget nutzen – das Entfernen kann spätere Funktionen blockieren.
API-Block ist optional. Wer kein eigenes System anbindet, ignoriert den curl-Block gefahrlos.
Schlechte Chat-Antworten? Erst die Wissensbasis prüfen. Dank "Recall-Fallback" antwortet der Agent auch bei schwachen Treffern. Verschwommene oder falsche Antworten deuten meist auf unsaubere/gecrawlte Inhalte hin – sauberen Text neu hochladen und im KI-Debug-Bereich den Retrieval-Test mit der dort empfohlenen Schwelle (Ein-Klick-Speichern) nutzen.
Budget im Blick behalten. Jeder Web-Chat verursacht Modellkosten. Über das Tagesbudget pro Agent (daily_budget_usd) stoppen Sie die Ausgaben automatisch, falls ein öffentlicher Link unerwartet viel Verkehr bekommt.
Zeitzonen im Buchungs-Widget. Die angezeigten Termine richten sich nach der Browser-Zeitzone der buchenden Person, nicht nach Ihrer – kommunizieren Sie bei internationaler Kundschaft ggf. die Zeitzone des Betriebs zusätzlich.