Konfigurieren der Web-In-App-Messaging-Unterstützung im Web SDK

In-App-Nachrichten sind Benachrichtigungen, die Sie an Benutzer in Ihrer Webanwendung senden können, um sie an bestimmte Zielpunkte weiterzuleiten.

Sie können diese Benachrichtigungen für verschiedene Zwecke verwenden, z. B. zur Förderung neuer Funktionen, zur Präsentation von Sonderangeboten oder zur Erleichterung des Onboarding von Benutzern.

Mithilfe von In-App-Nachrichten können Sie effektiv mit Ihrer Zielgruppe interagieren und diese auf wichtige Aspekte Ihrer Anwendung lenken.

IMPORTANT
Web-In-App-Nachrichten sind eine Funktion vom Typ Adobe Journey Optimizer, die das Web SDK verwendet, um personalisierte Inhalte bereitzustellen.
Detaillierte Anweisungen zum Konfigurieren Ihrer Web-In-App-Messaging-Kampagne finden Sie in der Adobe Journey Optimizer-Dokumentation.

Voraussetzungen prerequisites

Version der Web SDK-Tag-Erweiterung extension-version

Für die Web-In-App-Messaging-Funktion ist die neueste Version der Web SDK-Tag-Erweiterung erforderlich.

CSP für Web-In-App-Nachrichten konfigurieren csp

Wenn Sie Web In-App Messaging konfigurieren, müssen Sie die folgende Anweisung in Ihre CSP aufnehmen:

default-src  blob:;

Weitere Informationen zum Konfigurieren einer CSP finden Sie in der dedizierten Dokumentation.

Web-In-App-Nachrichten mithilfe der Web SDK-Tag-Erweiterung konfigurieren tag-extension

Auf der Konfigurationsseite 🔗 der Tag-Erweiterung für das Web SDK finden Sie die unten beschriebenen Einstellungen.

Nachdem Sie die Web SDK-Tag-Erweiterunginstalliert haben, führen Sie die folgenden Schritte aus, um die Erweiterung für Web In-App Messaging zu konfigurieren.

Aktivieren Sie im Abschnitt Personalization die Option Personalisierungsspeicher aktivieren . Mit dieser Option kann das Web SDK verfolgen, welche Erlebnisse der Benutzer beim Laden der Seite gesehen hat.

Bild, das die Speicheroption für die Personalisierung auf der Konfigurationsseite für die Tag-Erweiterung anzeigt.

Web In-App-Nachrichten unterstützen zwei Arten von Triggern:

In den folgenden Abschnitten erfahren Sie, wie Sie die Web SDK-Tag-Erweiterung entsprechend den gewünschten Triggern konfigurieren.

Konfigurationsschritte für den Trigger Daten an Platform senden send-data-platform

Wählen Sie die Tag-Eigenschaft aus, die Ihre Web SDK-Erweiterung enthält, und erstellen Sie eine neue Regel mit den folgenden Einstellungen:

  1. Erweiterung: Core

  2. Ereignistyp: Bibliothek geladen (Seitenanfang)

    Bild, das den Bildschirm zur Ereigniskonfiguration anzeigt.

  3. Wählen Sie Änderungen beibehalten aus, um die Ereigniskonfiguration zu speichern.

Als Nächstes müssen Sie der von Ihnen erstellten Regel eine Aktion hinzufügen.

  1. Wählen Sie im Abschnitt Actions die Option Hinzufügen aus.
    Bild, das den Bildschirm für die Bearbeitungsregel anzeigt.

  2. Verwenden Sie die folgenden Einstellungen für Aktion:

    • Erweiterung: Adobe Experience Platform Web SDK

    • Aktionstyp: Ereignis senden

      Bild, das den Bildschirm für die Aktionskonfiguration anzeigt.

  3. Aktivieren Sie rechts auf dem Bildschirm im Bereich Personalization die Option visuelle Personalisierungsentscheidungen rendern .
    Bild, das den Bildschirm zur Personalisierungskonfiguration anzeigt.

  4. Definieren Sie rechts im Bildschirm im Abschnitt Entscheidungskontext die Paare Schlüssel/Wert , die Sie in Ihrer Kampagnenkonfiguration verwendet haben, um sich für die In-App-Nachricht zu qualifizieren.
    Bild, das den Bildschirm zur Personalisierungskonfiguration anzeigt.

  5. Wählen Sie Änderungen beibehalten aus, um Ihre Konfiguration zu speichern.

Als Nächstes müssen Sie die neu erstellte Regel zur Tag-Property-Bibliothek hinzufügen. Gehen Sie dazu zu Veröffentlichungsfluss und wählen Sie die zuvor erstellte Regel aus.

Bild, das den Bibliotheksbildschirm anzeigt.

Nachdem Sie die Regel zur Bibliothek hinzugefügt haben, wählen Sie "Speichern und in Entwicklung erstellen".

Bild, das den Bildschirm zur Personalisierungskonfiguration anzeigt.

Der Konfigurationsprozess ist jetzt abgeschlossen und Ihre Nachricht kann Ihren Benutzern angezeigt werden.

Konfigurationsschritte für die Verwendung von manuellen Triggern manual-trigger

Wählen Sie die Tag-Eigenschaft aus, die Ihre Web SDK-Erweiterung enthält, und erstellen Sie eine neue Regel mit den folgenden Einstellungen:

  1. Erweiterung: Core

  2. Ereignistyp: Klick

  3. Legen Sie den Trigger für ein bestimmtes Element auf der Seite fest, den Sie durch einen CSS-Selektor Ihrer Wahl identifizieren.

    Bild, das den Bildschirm zur Ereigniskonfiguration anzeigt.

Als Nächstes müssen Sie der von Ihnen erstellten Regel eine Aktion hinzufügen.

  1. Wählen Sie im Abschnitt Actions die Option Hinzufügen aus.
    Bild, das den Bildschirm für die Bearbeitungsregel anzeigt.

  2. Verwenden Sie die folgenden Einstellungen für Aktion:

    • Erweiterung: Adobe Experience Platform Web SDK

    • Aktionstyp: Regelsätze auswerten

      Bild, das den Bildschirm für die Aktionskonfiguration anzeigt.

  3. Aktivieren Sie rechts im Bildschirm die Option Entscheidungen zur visuellen Personalisierung rendern .
    Bild, das den Bildschirm zur Personalisierungskonfiguration anzeigt.

  4. Definieren Sie rechts im Bildschirm im Abschnitt Entscheidungskontext die Paare Schlüssel/Wert , die Sie in Ihrer Kampagnenkonfiguration verwendet haben, um sich für die In-App-Nachricht zu qualifizieren.
    Bild, das den Bildschirm zur Personalisierungskonfiguration anzeigt.

  5. Wählen Sie Änderungen beibehalten aus, um Ihre Konfiguration zu speichern.

Als Nächstes müssen Sie die neu erstellte Regel zur Tag-Property-Bibliothek hinzufügen. Gehen Sie dazu zu Veröffentlichungsfluss und wählen Sie die zuvor erstellte Regel aus.

Bild, das den Bibliotheksbildschirm anzeigt.

Nachdem Sie die Regel zur Bibliothek hinzugefügt haben, wählen Sie "Speichern und in Entwicklung erstellen".

Bild, das den Bildschirm zur Personalisierungskonfiguration anzeigt.

Der Konfigurationsprozess ist jetzt abgeschlossen und Ihre Nachricht kann Ihren Benutzern angezeigt werden.

Web-In-App-Nachrichten mithilfe der Web SDK JavaScript-Bibliothek konfigurieren js-library

Alternativ zur Verwendung der Web SDK-Tag-Erweiterung können Sie auch Web-In-App-Nachrichten direkt über die Web SDK JavaScript-Bibliothek konfigurieren.

Sie können Web-In-App-Nachrichten aus Adobe Journey Optimizer auf zwei Arten anzeigen.

Methode 1: Personalisierungsinhalt automatisch abrufen automatic

Damit das Web SDK den Personalisierungsinhalt beim Laden der Seite automatisch abruft, verwenden Sie den Befehl "sendEvent", wie im folgenden Beispiel gezeigt.

  alloy("sendEvent", {
      renderDecisions: true,
      personalization: {
          surfaces: ['#welcome']
      }
  });

Methode 2: Personalisierungsinhalt basierend auf der Benutzeraktion manuell abrufen manual

Um den Personalisierungsinhalt erst dann anzuzeigen, wenn der Benutzer eine bestimmte Aktion ausgeführt hat, verwenden Sie den Befehl evaluateRulesets , wie im Beispiel unten dargestellt.

In diesem Beispiel wird der Personalisierungsinhalt angezeigt, wenn ein Benutzer auf die Schaltfläche Jetzt kaufen auf Ihrer Website klickt.

 alloy("evaluateRulesets", {
     renderDecisions: true,
     personalization: {
         decisionContext: {
             "userAction": "buy_now"
         }
     }
 });

Konfigurieren des Personalisierungsspeichers personalization-storage

Sie können Benutzern über die Konfigurationsoption personalizationStorageEnabled festlegen, ob In-App-Nachrichten für eine bestimmte Anzahl von Malen oder jedes Mal, wenn sie eine Seite besuchen, angezeigt werden sollen.

Legen Sie in der Web SDK configuration die personalizationStorageEnabled -Option entsprechend Ihren Anforderungen fest:

  • personalizationStorageEnabled: true Trigger der In-App-Nachricht mit der Häufigkeit, die Sie in der Adobe Journey Optimizer-Kampagne definiert haben.
  • personalizationStorageEnabled: false Trigger der In-App-Nachricht bei jedem Seitenladevorgang.
recommendation-more-help
ad108910-6329-42f1-aa1d-5920a2b13636