Deskwerk· Werkstatt
DEEN

Demos

Kontaktseite mit Live-Chat: Formular für später, Chat für sofort

Werkstück ausprobieren →

Kontaktformulare versprechen «wir melden uns». Der Chat antwortet sofort. Beides schliesst sich nicht aus: Das Formular für Dossiers und Anhänge, der Chat für alles, was schnell gehen soll.

Das Widget als Grid-Element

Im Embedded Mode ist das Widget ein Element wie jedes andere. Auf einer Kontaktseite heisst das: zweispaltiges Grid, links das Formular, rechts der Container fürs Widget.

zE('messenger', 'render', {
  mode: 'embedded',
  widget: { targetElement: '#kontakt-chat' },
});

Brand-Look mit vier Zeilen

Nicht gesetzte Theme-Werte fallen auf die Standardwerte zurück. Für den Look der Trägerseite reicht ein Teil-Theme:

zE('messenger:set', 'customization', {
  theme: {
    primary: '#1d4ed8',
    onPrimary: '#ffffff',
    action: '#1d4ed8',
    onAction: '#ffffff',
  },
});

Im Werkstück trägt das Widget bewusst das Blau der fiktiven «Muster AG» statt Deskwerk-Gelb: Das Widget passt sich der Seite an, nicht umgekehrt. Wie die komplette Farbpalette funktioniert, zeigt der Bauplan zur Theme-Werkbank.

Kontext nicht vergessen

Eine Zeile, und jede Chat-Anfrage der Kontaktseite ist als solche markiert:

zE('messenger:set', 'conversationTags', ['kontaktseite']);

Damit kann das Routing Chat-Anfragen von der Kontaktseite anders behandeln als solche aus dem Hilfe-Center, und die Auswertung weiss, welcher Einstiegspunkt wie viel bringt.

Der nächste Ausbauschritt

Der Chat ist nur so gut wie das, was antwortet. Auf einer echten Kontaktseite gehört ein AI Agent dahinter, der die häufigsten Anliegen gleich selbst löst: Öffnungszeiten, Bestellstatus, Adressänderung. Das ist Konfigurationsarbeit in der Instanz, nicht im Widget: das Handwerk hinter den 70 % autonom gelösten Anfragen aus dem Referenzprojekt.

← Zurück zur Demo