Zum Inhalt

Karussell-Modul

Mit dem Karussell-Modul kann Ihr Bot Informationen in einem scrollbaren Kartenlayout darstellen. Karussells werden häufig verwendet, um Produkte, Dienstleistungen oder Optionen auf visuell ansprechende Weise anzuzeigen. Jede Karte kann einen Titel, eine Beschreibung, ein Bild und Schaltflächen enthalten.

Manueller Modus

  • FĂĽgen Sie die Karten einzeln im Editor hinzu.

  • Jede Karte kann Folgendes enthalten:

  • Titel + Beschreibung

  • Bild und Bild-URL (wird beim Klick auf das Bild geöffnet)

  • Mehrere Schaltflächen

    • URL-Schaltflächen – öffnen einen Link
    • Aktions-Schaltflächen – verhalten sich wie Schaltflächen in normalen Chat-Nachrichten (setzen den Dialogablauf fort)

carousel-1.jpg

Dynamischer Modus

Anstatt jede Karte manuell zu erstellen, ist es möglich, sie aus einem JSON-Array zu generieren, das in einer beliebigen $context-Variable gespeichert ist.

  • Jedes Objekt im JSON = eine Karte im Karussell.
  • Kartenkomponenten (Titel, Beschreibung, Bild, Link) können JSON-SchlĂĽsseln zugeordnet werden.
  • Verwenden Sie die Template-Syntax: {{ title }}, {{ description }} usw.

Beispiel-JSON

Schritte zur Nutzung des dynamischen Karussells:

  1. Speichern Sie Ihr JSON in einer $context-Variable (z. B. $cwProducts).
  2. Wählen Sie im Abschnitt JSON mit Karussell-Daten den $context aus.
  3. Ordnen Sie die JSON-Schlüssel mithilfe von {{ }}-Platzhaltern den Karussell-Komponenten (Titel, Beschreibung …) zu (z. B. {{ prodName }}).

carousel-2.jpg

Benutzerdefinierter HTML-Modus

Für eine fortgeschrittene Anpassung wechseln Sie von Basisinhalt zu HTML-Inhalt (kontaktieren Sie den Support, falls Sie diese Option in Ihrem Karussell-Modul nicht sehen). Dies schaltet einen vollständigen HTML-Editor frei, in dem Sie Ihre eigene Kartenvorlage definieren können.

<a href="{{link}}">{{name}}</a>

<p>{{description}}</p>

<a href="{{link}}">More</a>

Dies ermöglicht Ihnen:

  • Die CSS-Stile Ihrer Marke abzugleichen
  • Benutzerdefinierte Aktionen hinzuzufĂĽgen (z. B. eine Schaltfläche „In den Warenkorb")
  • Vollständig einzigartige Layouts zu erstellen

custom-carousel.jpg

Bewährtes Verfahren

Wann welcher Modus zu verwenden ist:

  • Manuell → Kleine, feste Kartensätze (wie FAQs oder Top-3-Links).
  • Dynamisch → Größere, datengesteuerte Karussells (z. B. Produktlisten, Suchergebnisse).
  • Benutzerdefiniertes HTML → Wenn Sie die volle Kontrolle ĂĽber Stil und Funktionalität benötigen.