Zu Content springen
Deutsch
  • Es gibt keine Vorschläge, da das Suchfeld leer ist.

Interaktion zwischen Webseite und Chat-Widget erweitern

Webseiten-Anfragen direkt an das Chat-Widget übergeben, um kontextbezogene Unterhaltungen zu starten

Um Nutzer:innen auf der Webseite gezielt bei ihrem Anliegen abzuholen, kann das Chat-Widget direkt mit vordefinierten Informationen starten. Eingaben in Suchfelder, die Auswahl von Buttons oder Formularanfragen auf der Webseite werden als Kontext an den KI-Chatbot übergeben. Auf diese Weise beginnt die Unterhaltung im Widget nahtlos mit dem entsprechendem Thema. Das spart Zeit und gestaltet den Gesprächsverlauf für Nutzer:innen deutlich effizienter.

  1. Vorbereitung im Hub
  2. Technische Umsetzung auf der Webseite
  3. Anwendungsbeispiele


1. Vorbereitung im Hub

Bevor die Übergabe auf der Webseite eingerichtet werden kann, müssen die entsprechenden Ziele im Hub definiert sein:

  • Intents: Zu Intents gehören Themen und Agenten, die beim Start des Widgets ausgelöst werden sollen. Diese müssen im Hub vorab angelegt und veröffentlicht sein. Wie Themen definiert und angelegt werden, ist in diesem Artikel beschrieben. Informationen zum Anlegen von KI-Agenten sind in diesem Artikel beschrieben.
  • Formulare: Falls ein Formular gestartet werden soll, muss dieses im Hub unter dem Menüpunkt Formulare erstellt und der technische Name (ID) notiert sein. Was Formulare sind und wie sie erstellt werden, ist in diesem Artikel beschrieben.

Der technische Name des Intents oder Formulars ist das wichtigste Element für die Übergabe. Er muss exakt so kopiert werden, wie er im Hub hinterlegt ist. Der technische Name lässt sich im Hub beim öffnen des redaktionellen Themas oder des Formulars in der URL ablesen.

Formular: Alles was sich zwischen dem zweiten Schrägstrich "/" und "?" (dem Fragezeichen) befindet.

Thema: Alles was sich zwischen dem zweiten Schrägstrich "/" und "?" (dem Fragezeichen) befindet.


2. Technische Umsetzung auf der Webseite

Für die Anbindung ist eine kurze Code-Anpassung auf der Webseite erforderlich. Folgenden Informationen sind an die technische Abteilung oder die verantwortliche Person für die Webseiten-Betreuung weiterzuleiten:

  • Die Funktion: Es wird die startWith()-Funktion der moinAI JavaScript-API verwendet.
  • Die Dokumentation: Eine detaillierte technische Beschreibung inklusive Code-Beispielen findet sich unter API-Dokumentation.
  • Übergabe: Es können wahlweise Text (z. B. ein Suchbegriff), Formulare oder Intents übergeben werden.

3. Anwendungsbeispiele

  • Suchleiste: Nutzer:innen geben einen Begriff in die Suche der Webseite ein. Beim Absenden öffnet sich das Chat-Widget und der KI-Chatbot beantwortet direkt die passende Frage zum Suchbegriff.
  • Angebot-Button: Über einen Button "Angebot anfordern" auf der Webseite wird das Chat-Widget direkt geöffnet und das entsprechende Kontaktformular geladen, ohne dass Nutzer:innen manuell nach dem Formular suchen müssen.

Live-Demo

Du möchtest sehen, wie sich die Übergabe für deine Nutzer:innen anfühlt?

Klicke auf den folgenden Link, um das Chat-Widget zu öffnen. Durch den Klick wird die Funktion moinAI.startWith({ form: 'faq_support__bernahme' }) aufgerufen und startet direkt unser Support-Intent im Widget, ohne dass du den Chat manuell navigieren musst:

🚀 Live-Demo: Formular direkt im Chat öffnen

Hinweis für die Einrichtung: In diesem Beispiel übergibt der Button die technische Formular-ID faq_support__bernahme. Dieselbe Logik kann für beliebige Buttons, Link-Klicks oder Interaktionen auf der eigenen Webseite genutzt werden.