> ## Documentation Index
> Fetch the complete documentation index at: https://revolai.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
# Trigger
> Erstellen Sie automatisierte Popups, Overlays und Benachrichtigungsleisten basierend auf Besucherverhaltensregeln
## Ueberblick
Der Trigger-Tab ermoeglicht es Ihnen, automatisierte Aktionen zu erstellen, die basierend auf dem Besucherverhalten ausgeloest werden. Wenn ein Besucher bestimmte Bedingungen erfuellt — Verweildauer, Scrolltiefe, UTM-Quelle, Geraetetyp und mehr — zeigt der Trigger ein modales Popup, eine Toast-Benachrichtigung an oder leitet zu einer URL weiter. Trigger sind eine leistungsstarke Moeglichkeit, Besucher zum richtigen Zeitpunkt zu erreichen, ohne Programmierung.
## Triggerliste
Die Triggertabelle zeigt alle definierten Trigger mit wichtigen Metriken:
| Spalte | Beschreibung |
| ---------------- | --------------------------------------------------------------------------------------------------------- |
| **Name** | Triggername |
| **Typ** | Aktionstyp — Modal (zentriertes Popup), Toast (Eckenbenachrichtigung) oder Weiterleitung (URL-Navigation) |
| **Bedingungen** | Zusammenfassung der Ausloesebedingungen |
| **Ausloesungen** | Gesamtanzahl der Aktivierungen |
| **Status** | Aktiv oder inaktiv |
| **Aktionen** | Trigger bearbeiten oder loeschen |
***
## Einen Trigger erstellen
Klicken Sie auf **Trigger erstellen**, um den Trigger-Editor zu oeffnen. Der Editor hat zwei Tabs: **Inhalt** fuer visuellen Inhalt und **Einstellungen** fuer Verhaltensregeln.
***
## Inhalt-Tab
Der Inhalt-Tab ist ein visueller Block-Editor, in dem Sie den Inhalt des Triggers aufbauen. Jeder Trigger besteht aus **Inhaltsbloecken**, die Sie hinzufuegen, anordnen und gestalten.
### Bloecke hinzufuegen
Klicken Sie auf die Schaltflaeche **+ Block hinzufuegen**, um die Blockauswahl zu oeffnen. Verfuegbare Blocktypen:
| Block | Beschreibung |
| ------------------ | --------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Bild** | Fuegen Sie ein Bild hinzu — laden Sie eine Datei hoch oder fuegen Sie eine URL ein. Ideal fuer Produktfotos, Banner oder Icons. |
| **Ueberschrift** | Grosser Text fuer Titel und Schlagzeilen. Unterstuetzt Textausrichtung (links oder zentriert). |
| **Text** | Fliesstext mit Formatierung. Verwenden Sie ihn fuer Beschreibungen, Angebote oder Anleitungen. |
| **Funktionsliste** | Eine Aufzaehlungsliste mit Haekchen-Symbolen — ideal zum Auflisten von Vorteilen, Funktionen oder enthaltenen Elementen. |
| **Eingabefeld** | Ein einzeiliges Texteingabefeld zur Datenerfassung (Name, E-Mail, Telefon). |
| **Textbereich** | Ein mehrzeiliger Textbereich fuer laengere Antworten (Nachrichten, Feedback). |
| **Schaltflaeche** | Eine klickbare Schaltflaeche mit anpassbarem Text, Farbe und Aktion (Link, Schliessen oder Formulardaten senden). |
| **Aktionscode** | Ein gestalteter Aktionscode-Block mit Kopierschaltflaeche. Besucher klicken, um den Code in ihre Zwischenablage zu kopieren. |
| **QR-Code** | Bettet einen Kampagnen-QR-Code direkt in den Trigger ein. Besucher scannen ihn auf ihrem Telefon, um auf dem Mobilgeraet fortzufahren — mit vollstaendiger Kampagnenzuordnung. Siehe [Kampagnen — QR-Code](/widget/campaigns#qr-code) fuer Details. |
| **Trennlinie** | Eine horizontale Linie zur visuellen Trennung von Abschnitten. |
### Blockeinstellungen
Jeder Blocktyp hat eigene bearbeitbare Eigenschaften. Klicken Sie auf einen Block, um ihn auszuwaehlen und zu konfigurieren:
**Bild:**
| Einstellung | Beschreibung |
| -------------- | ------------------------------------ |
| **URL** | Bildquell-URL |
| **Alt-Text** | Alternativtext fuer Barrierefreiheit |
| **Randradius** | Eckenrundung in Pixeln (Standard: 0) |
**Ueberschrift:**
| Einstellung | Beschreibung |
| --------------- | ------------------------------- |
| **Text** | Ueberschrifteninhalt |
| **Ausrichtung** | Links (Standard) oder Zentriert |
**Text:**
| Einstellung | Beschreibung |
| --------------- | ------------------------------------------------------------------------------ |
| **HTML-Inhalt** | Formatierter Text — unterstuetzt ``, ``, ``, ``, Listen und `
` |
**Funktionsliste:**
| Einstellung | Beschreibung |
| ------------ | -------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Elemente** | Dynamische Liste von Funktionen. Jedes Element hat ein Symbol (Emoji), einen Titel und einen Beschreibungstext. Klicken Sie auf "Element hinzufuegen", um weitere hinzuzufuegen. |
**Eingabefeld:**
| Einstellung | Beschreibung |
| ---------------- | ---------------------------------------------------- |
| **Schluessel** | Formularfeldname (z.B. `email`, `phone`) |
| **Typ** | Text, E-Mail, Telefon oder Nummer |
| **Label** | Feldbeschriftung ueber dem Eingabefeld |
| **Platzhalter** | Hinweistext innerhalb des Feldes |
| **Erforderlich** | Ob das Feld vor dem Absenden ausgefuellt werden muss |
**Textbereich:**
| Einstellung | Beschreibung |
| ---------------- | ------------------------------------------------ |
| **Schluessel** | Formularfeldname |
| **Zeilen** | Anzahl sichtbarer Textzeilen (1–10, Standard: 3) |
| **Label** | Feldbeschriftung |
| **Platzhalter** | Hinweistext |
| **Erforderlich** | Ob das Feld ausgefuellt werden muss |
**Schaltflaeche:**
| Einstellung | Beschreibung |
| ---------------- | --------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Beschriftung** | Schaltflaechentext |
| **Variante** | Primaer (ausgefuellte Akzentfarbe), Sekundaer (heller Farbton) oder Umriss (transparent mit Rand) |
| **Aktion** | Schliessen (Trigger verwerfen), Link oeffnen (zu URL navigieren), Formular absenden (Formulardaten senden) oder Wert kopieren (Text in Zwischenablage kopieren) |
| **Wert** | URL fuer Links oder Text fuer Kopieraktion |
**Aktionscode:**
| Einstellung | Beschreibung |
| ----------- | -------------------------------------- |
| **Code** | Der Aktionscode-Text (z.B. `SPRING20`) |
| **Label** | Optionales Label ueber dem Code |
**QR-Code:**
| Einstellung | Beschreibung |
| ------------ | ------------------------------------------------------------------------------------------ |
| **QR-Daten** | URL oder Text zum Codieren. Verwenden Sie die Schaltflaeche "QR erstellen" zum Generieren. |
| **Groesse** | QR-Code-Groesse in Pixeln (Standard: 160) |
**Trennlinie:**
Keine Einstellungen — rendert eine horizontale Trennlinie.
### Trigger-Stil
Der Trigger-Container hat globale Stileinstellungen, die auf das gesamte Popup/Toast angewendet werden:
| Einstellung | Beschreibung |
| -------------------- | --------------------------------------------------------------------------------------------------------------------------- |
| **Hintergrundfarbe** | Container-Hintergrund (Standard: `#ffffff`) |
| **Textfarbe** | Standard-Textfarbe fuer alle Bloecke (Standard: `#1a1a1a`) |
| **Akzentfarbe** | Farbe fuer Schaltflaechen, Funktionssymbole und Aktionscode-Kopierschaltflaeche (Standard: `#4680ff`) |
| **Randradius** | Eckenrundung des gesamten Triggers in Pixeln (Standard: 16) |
| **Position** | Fuer Toast-Trigger: oben rechts, oben links, unten rechts oder unten links. Fuer Modals: zentriert mit dunklem Hintergrund. |
### Inhaltsbeispiele
* **Ueberschrift**: "Erhalten Sie 10% Rabatt auf Ihre erste Bestellung"
* **Text**: "Abonnieren Sie unseren Newsletter und erhalten Sie einen exklusiven Rabattcode."
* **Eingabefeld**: E-Mail
* **Schaltflaeche**: "Meinen Rabatt erhalten" (Absende-Aktion)
* **Aktionscode**: Wird nach Formulareinreichung angezeigt
* **Bild**: Produktfoto
* **Ueberschrift**: "Warten Sie! Verpassen Sie das nicht."
* **Text**: "Kostenloser Versand bei Bestellungen ueber 50 EUR — nur heute."
* **Schaltflaeche**: "Jetzt einkaufen" (Link zum Shop)
* **Schaltflaeche**: "Nein danke" (Schliessen-Aktion)
* **Ueberschrift**: "Auf dem Telefon fortfahren"
* **Text**: "Scannen Sie den QR-Code, um auf dem Mobilgeraet mit unserem KI-Agenten zu chatten."
* **QR-Code**: Kampagnen-QR-Code mit UTM-Tracking
* **Text**: "Oder klicken Sie auf die Chat-Schaltflaeche unten."
* **Bild**: Funktions-Screenshot
* **Ueberschrift**: "Neu: KI-gestuetzte Empfehlungen"
* **Funktionsliste**: 3-4 wichtige Vorteile
* **Schaltflaeche**: "Mehr erfahren" (Link zur Funktionsseite)
* **Trennlinie**
* **Text**: Kleingedruckter Haftungsausschluss
***
## Einstellungen-Tab
Der Einstellungen-Tab steuert **wann**, **wie oft** und **wem** der Trigger angezeigt wird.
### Bedingungen
Bedingungen definieren die Regeln, die erfuellt sein muessen, damit der Trigger ausgeloest wird. Sie koennen mehrere Bedingungen hinzufuegen und den Logikmodus waehlen: **UND** (alle Bedingungen muessen wahr sein) oder **ODER** (eine Bedingung genuegt), damit der Trigger aktiviert wird.
| Bedingung | Operator | Beschreibung |
| ------------------------------ | ----------------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Verweildauer (Sekunden)** | `>=`, `<=`, `=` | Ausloesen, nachdem der Besucher X Sekunden auf der aktuellen Seite verbracht hat. Beispiel: Ein Popup nach 30 Sekunden Lesen anzeigen. |
| **Besuchte Seiten** | `>=`, `<=`, `=` | Ausloesen, nachdem der Besucher X Seiten in der Sitzung angesehen hat. Beispiel: Ein Angebot nach 3+ Seiten anzeigen. |
| **Scrolltiefe (%)** | `>=`, `<=`, `=` | Ausloesen, wenn der Besucher einen Prozentsatz der Seite ueberschritten hat. Beispiel: Einen CTA nach 70% Scroll anzeigen. |
| **UTM-Quelle** | `=`, `contains` | Nur fuer Besucher aus einer bestimmten Traffic-Quelle ausloesen. Beispiel: Ein Sonderangebot nur fuer `google`-Besucher anzeigen. |
| **UTM-Medium** | `=`, `contains` | Nur fuer ein bestimmtes Marketing-Medium ausloesen. Beispiel: Nur fuer `cpc`-Traffic (bezahlt) ausloesen. |
| **UTM-Kampagne** | `=`, `contains` | Nur fuer Besucher aus einer bestimmten Kampagne ausloesen. Beispiel: Ein saisonales Banner nur fuer die `summer-sale`-Kampagne anzeigen. |
| **Empfehlungs-ID** | `=`, `!=` | Basierend auf dem `rvl_ref`-Parameter ausloesen. Beispiel: Eine Partner-Willkommensnachricht fuer eine bestimmte Empfehlung anzeigen. |
| **Referrer enthaelt** | `contains` | Basierend auf der verweisenden URL ausloesen. Beispiel: Einen Wettbewerbsvergleich fuer Besucher anzeigen, die von der Website eines Wettbewerbers kommen. |
| **Seiten-URL** | `=`, `contains`, `starts_with`, `matches` | Nur auf bestimmten Seiten ausloesen. Verwenden Sie `matches` fuer Regex-Muster. Beispiel: Ein Preis-Popup nur auf `/pricing` anzeigen. |
| **Geraetetyp** | `=` | Nur auf Desktop, Mobil oder Tablet ausloesen. Beispiel: Ein Mobile-App-Download-Banner nur auf Mobilgeraeten anzeigen. |
| **Ereignis ausgeloest** | `=` | Nach einem bestimmten Tracking-Ereignis ausloesen. Beispiel: Ein Cross-Sell-Popup nach dem `add_to_cart`-Ereignis anzeigen. |
| **Wochentag (0=So)** | `=`, `in` | Nur an bestimmten Tagen ausloesen. Beispiel: Wochenendangebote am Samstag (6) und Sonntag (0) anzeigen. |
| **Stundenbereich \[von, bis]** | `between` | Nur waehrend bestimmter Stunden ausloesen. Beispiel: "Rufen Sie uns jetzt an" nur waehrend der Geschaeftszeiten 9-18 Uhr anzeigen. |
### Bedingungsbeispiele
Ein Newsletter-Popup fuer Besucher anzeigen, die aktiv lesen:
| Bedingung | Operator | Wert |
| ------------ | -------- | --------- |
| Verweildauer | `>=` | `30` |
| Scrolltiefe | `>=` | `50` |
| Geraetetyp | `=` | `desktop` |
Einen Sonderrabatt fuer Google Ads-Besucher auf der Preisseite anzeigen:
| Bedingung | Operator | Wert |
| ---------- | ---------- | ---------- |
| UTM-Quelle | `=` | `google` |
| UTM-Medium | `=` | `cpc` |
| Seiten-URL | `contains` | `/pricing` |
Eine Erinnerung nach einem Warenkorb-Ereignis mit Zeitverzoegerung anzeigen:
| Bedingung | Operator | Wert |
| ------------------- | -------- | ------------- |
| Ereignis ausgeloest | `=` | `add_to_cart` |
| Verweildauer | `>=` | `60` |
| Besuchte Seiten | `>=` | `2` |
Eine "Rufen Sie uns an"-Leiste nur waehrend der Arbeitszeiten an Werktagen anzeigen:
| Bedingung | Operator | Wert |
| -------------- | --------- | ----------------- |
| Stundenbereich | `between` | `[9, 18]` |
| Wochentag | `in` | `[1, 2, 3, 4, 5]` |
| Geraetetyp | `=` | `desktop` |
### Haeufigkeit
Steuert, wie oft der Trigger demselben Besucher angezeigt wird:
| Option | Beschreibung |
| -------------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Einmal pro Sitzung** | Einmal waehrend der aktuellen Browser-Tab-Sitzung anzeigen. Der Trigger wird auch nach Seitenneuladung oder Navigation nicht erneut angezeigt — nur das Schliessen des Tabs setzt ihn zurueck. |
| **Einmal pro Tag** | Einmal pro Kalendertag anzeigen. Der Besucher sieht ihn erst morgen wieder, unabhaengig davon, wie viele Sitzungen er heute hat. |
| **Einmal pro Besucher (jemals)** | Nur einmal anzeigen — jemals. Sobald ein Besucher diesen Trigger gesehen hat, wird er nie wieder angezeigt (ueber Browser-Token verfolgt). Ideal fuer einmalige Ankuendigungen. |
| **Bei jedem Besuch** | Bei jeder Sitzung anzeigen. Der Trigger wird jedes Mal ausgeloest, wenn die Bedingungen erfuellt sind, unabhaengig davon, wie oft der Besucher ihn schon gesehen hat. Sparsam verwenden. |
Fuer die meisten Anwendungsfaelle ist **Einmal pro Sitzung** oder **Einmal pro Besucher** die richtige Wahl. "Bei jedem Besuch" kann stoerend sein — verwenden Sie es nur fuer kritische, zeitkritische Informationen wie Wartungshinweise oder dringende Aktionen.
### Zeitplan
Optional den Trigger auf einen bestimmten Datums- und Zeitbereich beschraenken:
| Feld | Beschreibung |
| ------------ | --------------------------------------------------------------------------------------------------------------------------------------------------- |
| **Start um** | Datum und Uhrzeit, ab wann der Trigger aktiv wird. Vor diesem Zeitpunkt wird der Trigger nicht ausgeloest, auch wenn die Bedingungen erfuellt sind. |
| **Ende um** | Datum und Uhrzeit, wann der Trigger stoppt. Nach diesem Zeitpunkt wird der Trigger automatisch deaktiviert. |
Beide Felder sind optional:
* **Nur Start** — der Trigger wird am Startdatum aktiviert und laeuft unbegrenzt
* **Nur Ende** — der Trigger laeuft sofort und stoppt am Enddatum
* **Beides** — der Trigger laeuft nur waehrend des angegebenen Zeitfensters
* **Keines** — der Trigger laeuft, solange er aktiviert ist
**Anwendungsfaelle fuer Zeitplanung:**
| Szenario | Start | Ende |
| -------------------------- | ---------------- | ---------------- |
| Black-Friday-Verkaufspopup | 29. Nov, 00:00 | 2. Dez, 23:59 |
| Neujahrs-Aktionsbanner | 25. Dez, 00:00 | 5. Jan, 23:59 |
| Produktstart-Ankuendigung | 15. Maerz, 10:00 | 22. Maerz, 23:59 |
| Wartungshinweis | — | 1. Apr, 06:00 |
***
## Wie Trigger funktionieren
Wenn das Tracker-Skript auf Ihrer Website geladen wird, ruft es die aktiven Trigger-Definitionen ab und wertet sie im Hintergrund aus:
Der Tracker ruft aktive Trigger-Definitionen vom Server ab. Der Server filtert nach Zeitplan (Start-/Enddaten) und aktivem Status, bevor er sie an den Client sendet.
Alle 2 Sekunden prueft der Tracker die Haeufigkeitseinstellung jedes Triggers. Wenn der Besucher den Trigger bereits gesehen hat (basierend auf localStorage oder sessionStorage), wird der Trigger uebersprungen.
Fuer Trigger, die die Haeufigkeitspruefung bestehen, wertet der Tracker alle Bedingungen aus — Verweildauer, Scrolltiefe, UTM-Parameter, Geraetetyp, ausgeloeste Ereignisse und mehr. Bedingungen verwenden je nach Konfiguration UND- oder ODER-Logik.
Der Trigger-Inhalt (Modal oder Toast) wird auf der Seite innerhalb eines Shadow DOM mit dem konfigurierten Styling und Animation gerendert. Die Aktivierung wird als `trigger_shown`-Ereignis aufgezeichnet. Bei Weiterleitungs-Triggern wird der Besucher zur Ziel-URL navigiert.
Der Besucher kann mit dem Trigger interagieren — Schaltflaechen klicken, Felder ausfuellen, Aktionscodes kopieren, QR-Codes scannen oder ihn schliessen. Jede Interaktion wird als separates Ereignis verfolgt (`trigger_clicked`, `trigger_dismissed`, `trigger_promo_copied`).
Trigger werden in ihrem eigenen **Shadow DOM**-Container gerendert, sodass ihre Stile vollstaendig von Ihrer Website isoliert sind. Keine CSS-Konflikte.
***
## Integration von Triggern und Ereignissen
Trigger erstellen automatisch Tracking-Ereignisse. Jede Trigger-Aktivierung wird als `trigger_shown`-Ereignis mit der Trigger-ID und dem Aktionstyp aufgezeichnet. Sie koennen:
* Trigger-Aktivitaet im **Trigger-Aktivitaet**-Diagramm auf dem Dashboard sehen
* Trigger-Aktivierungen in der **Kampagnen-Performance**-Tabelle anzeigen
* Die Bedingung `event_fired` verwenden, um Trigger zu verketten — z.B. Trigger B nur anzeigen, nachdem Trigger A gesehen wurde
* Mit [Benutzerdefinierten Ereignissen](/widget/events#custom-events-api) fuer komplexe Ablaeufe kombinieren
Verwenden Sie die Bedingung **Ereignis ausgeloest**, um mehrstufige Sequenzen zu erstellen. Beispiel: Trigger 1 zeigt einen Teaser nach 10 Sekunden. Trigger 2 zeigt das vollstaendige Angebot nur, wenn der Besucher auf die Schaltflaeche von Trigger 1 geklickt hat (als benutzerdefiniertes Ereignis verfolgt).