Adobe Experience Manager ContextHub-Tool hinzufügen

Mit dem AEM ContextHub-Tool können Sie das Dynamic Tag Management mit dem Adobe Experience Manager (AEM) ContextHub (AEM-Version der Datenschicht) integrieren. Außerdem kann mithilfe des Tools DTM mit beliebigen Datenschichten integriert werden, selbst auf Websites, bei denen AEM nicht zum Einsatz kommt.

DTM-Kunden verwenden häufig Datenelemente, um sie den Datenschichten ihrer Websites zuzuordnen. Die Datenschicht kann beispielsweise Informationen enthalten, die besagen, dass ein User sich ein bestimmtes Produkt ansieht oder einen Artikel in den Warenkorb gelegt hat. DTM kann diese Informationen auf verschiedene Weisen in Regelbedingungen und Aktionen verwenden. Dazu gehört das Senden von Daten an Analytics zu Zwecken des Reportings oder an das Target zum Anzeigen benutzerspezifischer Inhalte für den User.

Das AEM ContextHub-Werkzeug löst viele Probleme im Zusammenhang mit Datenschichten. Einige Datenschichten werden nicht am Anfang der Seite geladen. Andere Datenschichten sind dynamisch oder asynchron und ändern sich häufig, wenn sich die Seite ändert. In der Vergangenheit war es aufgrund dieser beiden Probleme für DTM schwierig, Daten effektiv zu senden oder Aktionen auszulösen.

Mit dem AEM ContextHub-Werkzeug entfällt die Notwendigkeit, benutzerspezifischen Code zu schreiben, der häufig überprüft, ob sich die Datenschicht ändert, an einer anderen Stelle als dem Anfang der Seite lädt oder bei Seitenänderungen geändert wird.

Angenommen, ein Kunde platziert einen Artikel im Warenkorb und entfernt ihn dann wieder. Wenn die Seite nicht aktualisiert wird, wenn sich die Datenschicht ändert, erkennt DTM die Änderung nicht ohne einen benutzerdefinierten Code-Zusatz. Das AEM ContexHub-Werkzeug enthält eine Abfrage-Engine, die einmal pro Sekunde prüft, ob es Änderungen gibt.

Da DTM jetzt Datenelemente proaktiv über die Datenschicht ausfüllen kann, können User auch AEM ContextHub-Datenelemente zusammen mit zuvor veröffentlichten Bedingungen wie etwa dem Datenelementwert verwenden. Auf diese Weise können User beim Laden einer Seite Datenschichtwerte verwalten oder die Datenelementwert-Bedingung mit dem Ereignis dataelementchanged kombinieren, falls sich die Datenschicht aufgrund der Interaktion des Users geändert hat.

Wenn Sie dieses Werkzeug konfigurieren, können Sie die Standardeinstellung verwenden, um es mit dem AEM ContextHub zu integrieren, oder Sie können die Struktur so anpassen, dass sie mit jeder Website funktioniert.

  1. Klicken Sie auf <Name der Web-Eigenschaft> > Overview > Add a Tool > AEM ContextHub.

  2. Geben Sie einen beschreibenden Namen für das Werkzeug an.

    Dieser Name wird auf dem Overview Tab unter Installed Tools angezeigt.

  3. Klicken Sie auf Create Tool, um die Seite AEM ContextHub Settings anzuzeigen.

  4. Füllen Sie die Felder aus:

    Element Beschreibung
    Standardmäßige ContextHub-Datenschicht verwenden Verwenden Sie das AEM ContextHub-Format. Wenn diese Option aktiviert ist, verweist DTM für diese Integration auf das standardmäßige ContextHub-Schema. Sollten Sie am ContextHub-Schema Änderungen vorgenommen haben oder eine andere Datenschicht verwenden wollen, arbeiten Sie mit der personalisierten Option.
    ContextHub-Datenschicht personalisieren Verwenden Sie ein benutzerdefiniertes Format, das der Datenschichtstruktur einer beliebigen Website zugeordnet wird, auch wenn nicht AEM verwendet wird. Mit dieser Option können Sie Ihr Datenschichten-Schema bearbeiten. Standardmäßig wird das Bearbeitungsfenster mit der standardmäßigen ContextHub-Datenschicht gefüllt, in der Sie Änderungen vornehmen oder die Sie vollständig durch Ihren Code ersetzen können.
    Editor öffnen Wenn Sie die Option „ContextHub-Datenschicht anpassen“ wählen, können Sie den Editor verwenden, um Ihren benutzerdefinierten Code einzufügen.
    Anmerkung hinzufügen Fügen Sie Anmerkungen in Bezug auf diese Implementierung hinzu.
  5. Klicken Sie auf Save Changes.

Datenschichtverwaltung mit dem ContextHub-Werkzeug

Das ContextHub-Tool von AEM für Dynamic Tag Management (DTM) kann sowohl mit ContextHub-Implementierungen als auch mit Implementierungen des allgemeinen Daten-Layers verwendet werden. Das Daten-Layer-Schema von ContextHub wird im Tool standardmäßig geladen und bietet eine einfache Integration mit Adobe Experience Manager (AEM)-ContextHub-Speichern. Beispiele sowohl für die ContextHub-Standard-Implementierung als auch eine allgemeine benutzerdefinierte Daten-Layer-Implementierung sind enthalten.

Voraussetzungen

Für die Verwendung des ContextHub-Werkzeugs müssen die folgenden Voraussetzungen erfüllt sein:

  • Eine vorhandene ContextHub- oder JavaScript-Objektdatenschicht auf einer Website.
  • Ein JSON-Schema, das die auf der Website verwendete Datenschicht korrekt definiert.
  • Eine primäre DTM-Web-Eigenschaft, die auf der Website verwendet wird.

Komponenten des AEM ContextHub-Werkzeugs

Das AEM ContextHub-Werkzeug fügt DTM zwei Funktionen hinzu:

  • Die Definition der Datenschicht
  • Den AEM ContextHub-Datenschichttyp

Zusätzlich wurde ein neuer Ereignistyp hinzugefügt, um die Überwachung der Datenschicht zu erleichtern, der so genannte dataelementchanged. Dieser Ereignistyp kann unabhängig vom AEM ContextHub-Werkzeug verwendet werden.

Jeder funktionale Bereich entspricht einem Konfigurationsschritt, der in den beiden folgenden Beispielen beschrieben wird.

Datenelementüberwachung

Der neue dataelementchanged Ereignistyp überwacht alle Änderungen, die während einer Seitenansicht an einem bestimmten Datenelementwert auftreten. Bei Verwendung dieses Ereignistyps sind die folgenden Tatsachen zu beachten.

  1. Das Datenelement muss einem einfachen JavaScript-Wert zugeordnet sein. Komplexe Werte wie Arrays und Objekte, die in einem benutzerdefinierten Skript für Datenelemente zurückgegeben werden, funktionieren nicht ordnungsgemäß. Cookies, CSS-Selektoren und URL-Parameter führen ebenfalls zu unerwarteten Ergebnissen und funktionieren möglicherweise überhaupt nicht. Einfache Werte wie Zeichenfolgen und Ganzzahlen funktionieren einwandfrei.
  2. Gehen Sie bei der Anzahl der dataelementchanged Ereignistypen, auf die auf einer einzelnen Seite verwiesen wird, vorsichtig vor. Obwohl die Überwachung effizient ist, könnte eine große Anzahl von Auswertungen die Leistung der Seite beeinträchtigen.
  3. Der Ereignistyp dataelementchanged funktioniert nur innerhalb der aktuellen Seitenansicht, da es sich um ein DOM-basiertes Überwachungssystem handelt.
  4. Die Datenelementüberwachung fragt die Werte ab.

Beispiel für eine standardmäßige ContextHub-Datenschicht

Beispiel für die Verwendung des AEM ContextHub-Werkzeugs, das auf die standardmäßige ContextHub-Datenschicht innerhalb der Dynamic Tag Management Konfiguration verweist und diese verwendet.

Der ContextHub-Daten-Layer wird auf einer Adobe Experience Manager (AEM)-Test-Website geladen. ContextHub kann jedoch unabhängig von AEM verwendet werden. Wenden Sie sich an Ihren Adobe-Support-Mitarbeiter, wenn Sie ContextHub unabhängig von AEM verwenden möchten.

Auf alle ContextHub-Stores kann von der Browser-Konsole aus verwiesen werden.

Die DTM-Datenschichtüberwachung startet vor allen anderen DTM-Funktionen, so dass in den Beispielen die Datenschicht nicht über DTM bereitgestellt wird, obwohl dies möglich ist. Stattdessen hängen sie von der Server-generierten Datenschicht ab. Andernfalls kann es zu JavaScript-Warnungen kommen, da bestimmte Datenschichtwerte möglicherweise nicht verfügbar sind.

Datenschicht definieren

Der erste Schritt beim Konfigurieren des AEM ContextHub-Werkzeug besteht darin, es einer Web-Eigenschaft hinzuzufügen.

HINWEIS

Derzeit ist pro DTM-Web-Eigenschaft nur ein AEM ContextHub-Werkzeug zulässig.

  1. Klicken Sie auf <Name der Web-Eigenschaft> > Overview > Add a Tool > AEM ContextHub.

  2. Geben Sie einen beschreibenden Namen für das Werkzeug an.

  3. Klicken Sie auf Create Tool, um die Seite AEM ContextHub Settings anzuzeigen.

  4. Wählen Sie Use Default ContextHub Data Layer aus, um die standardmäßigen ContextHub-Stores zu verwenden.

    Oder

    Wählen Sie Customize ContextHub Data Layer zum Ändern des Schemas aus. Die benutzerdefinierte Option muss verwendet werden, wenn in der Implementierung eine nicht standardmäßige ContextHub-Datenschicht verwendet wird.

    Der standardmäßige Datenschichtstamm ermöglicht den Zugriff auf alle ContextHub-Stores. Aufgrund der Dynamik der ContextHub-Stores stehen mit dieser Datenschicht zusätzliche Funktionen zur Verfügung, die in der einfachen JavaScript-Objektreferenz, wie sie vom generischen Datenschichtansatz verwendet wird, nicht verfügbar sind.

  5. (Bedingt) Wenn Sie eine benutzerdefinierte Datenschicht verwenden möchten, klicken Sie auf Open Editor, um die Datenschichtdefinition für das Schema anzuzeigen. Wenn die benutzerdefinierte Datenschicht eine Änderung des ContextHub-Schemas ist, stellen Sie sicher, dass Sie „ContextHub“ in das Data Layer Root Feld hinzufügen.

    Das standardmäßige ContextHub-Schema wird im Editor ausgefüllt.

    1. Passen Sie das Schema nach Bedarf an das Schema der Datenschicht der Site an.
    2. Klicken Sie auf Save and Close, um das Schema zu speichern und den Editor zu schließen.
  6. Klicken Sie auf Save Changes.

Datenschicht-Datenelement erstellen

  1. Klicken Sie in der Web-Eigenschaft auf den Tab Rules und dann im linken Menü auf Data Elements.

  2. Klicken Sie auf Create New Data Element.

  3. Geben Sie einen Namen für das Datenelement an. Nennen Sie das Datenelement in diesem Beispiel „total_price“.

  4. Wählen Sie aus der Type Dropdown-Liste AEM ContextHub aus.

    Der Name des AEM ContextHub-Werkzeugs wird in der „Quelle“ eingetragen, in der aktuellen Version kann jedoch nur ein AEM ContextHub-Werkzeug definiert werden.

  5. Ordnen Sie das Datenelement der Datenschicht zu, indem Sie einen Pfad in der Objektauswahl auswählen.

    Wählen Sie in diesem Beispiel das Objekt cart.totalPriceFloat aus.

  6. Klicken Sie auf Save Data Element.

Erstellen Sie eine ereignisbasierte Regel, die den Ereignistyp zum Ändern des Datenelements verwendet

  1. Klicken Sie in der Web-Eigenschaft auf den Tab Rules und dann im linken Menü auf Event Based Rules.

  2. Klicken Sie auf Create New Rule.

  3. Geben Sie einen Namen für die Regel ein. Nennen Sie in diesem Beispiel die Regel „cart_total_update“.

  4. Erweitern Sie den Abschnitt „Bedingungen“.

  5. Wählen Sie aus der Event Type Dropdown-Liste dataelementchanged aus.

  6. Wählen Sie das Datenelement aus, das im vorherigen Abschnitt erstellt wurde (total_price).

  7. Wählen Sie unter Rule Conditions aus der Dropdown-Liste Data Element Value und klicken Sie dann auf Add Criteria.

  8. Wählen Sie das Datenelement aus, das im vorherigen Abschnitt erstellt wurde (total_price), und weisen Sie ihm einen Wert zu, der die Regel auslöst.

    In diesem Beispiel wird ein regulärer Ausdruck verwendet, um alles auszuwerten, das größer als oder gleich 50 ist: ^([5-9]\d|[1-9]\d{2,})$

    HINWEIS

    Wenn Datenelementwerte auf diese Weise als Bedingungen verwendet werden, ist es wichtig, dass die Datenelementeinstellungen bei der Zuordnung berücksichtigt werden. Wenn Sie beispielsweise die Option Force Lowercase Value in den Datenelementeinstellungen auswählen, wird der Wert vor der Auswertung in Kleinbuchstaben umgewandelt. Da JavaScript von der Groß-/Kleinschreibweise abhängig ist, ist „test“ nicht mit „Test“ identisch und die Bedingung würde nicht wie erwartet ausgelöst.

  9. Erweitern Sie den Abschnitt Javascript / Third Party Tags.

  10. Klicken Sie auf Add New Script.

  11. Fügen Sie nicht sequenzielles JavaScript hinzu, das eine Benachrichtigung bereitstellt, wenn die Regel ausgelöst wird. Benennen Sie die Regel „big_money_alert“ und fügen Sie dann ein Skript für einen Warnhinweis hinzu, das dem folgenden Beispiel ähnelt:

    alert('$' + _satellite.getVar(‘total_price’) + ‘ is big money!’);

  12. Klicken Sie auf Save Code und dann auf Save Rule.

Validieren der -Implementierung

Überprüfen Sie die Implementierung auf der DTM-aktivierten Website, auf der die oben genannte Web-Eigenschaft ausgeführt wird.

  • Überprüfen Sie in der Developer Console, ob die Datenschicht vorhanden ist (ContextHub).

  • Ändern Sie das überwachte Datenschichtobjekt in einen Wert, der NICHT der oben genannten Bedingung entspricht: ContextHub.setItem('/store/cart/totalPriceFloat','5');

  • Ändern Sie das überwachte Datenschichtobjekt in einen Wert, der der oben genannten Bedingung entspricht: ContextHub.setItem('/store/cart/totalPriceFloat','52');

  • In der Beispielimplementierung sollte ein Dialog mit einem Warnhinweis geöffnet werden:

Wenn das DTM-Debugging aktiviert ist, sollte die fehlgeschlagene Bewertung in der Konsole angezeigt werden.

Beispiel für eine benutzerdefinierte Datenschicht

Beispiel für die Verwendung des AEM ContextHub-Werkzeugs, das auf eine benutzerdefinierte, Nicht-ContextHub-Datenschicht innerhalb der Dynamic Tag Management Konfiguration verweist und diese verwendet.

Die Beispieldatenschicht (_dl) wird als JavaScript-Objektdefinition im Abschnitt <head/> der Seite auf die Test-Web-Seite geladen, bevor auf den DTM-Einbettungs-Code verwiesen wird.

<head> 
    <script> 
        window._dl = { 
            page: { 
                name: 'homepage', 
                quantity: 1, 
                friend: 'No one' } 
        } 
    </script> 
    <script src="//assets.adobedtm.com/satelliteLib-*.js"></script> 
</head> 

Die DTM-Datenschichtüberwachung (siehe unten) startet vor allen anderen DTM-Funktionen, so dass in den Beispielen die Datenschicht nicht über DTM bereitgestellt wird. Andernfalls kann es zu JavaScript-Warnungen kommen, da bestimmte Datenschichtwerte möglicherweise nicht verfügbar sind.

Die Datenschicht definieren

Der erste Schritt beim Konfigurieren des AEM ContextHub-Werkzeug besteht darin, es einer Web-Eigenschaft hinzuzufügen.

HINWEIS

Derzeit ist pro DTM-Web-Eigenschaft nur ein AEM ContextHub-Werkzeug zulässig.

  1. Klicken Sie auf <Name der Webeigenschaft> > Overview > Add a Tool > AEM ContextHub.

  2. Geben Sie einen beschreibenden Namen für das Werkzeug an.

  3. Klicken Sie auf Create Tool, um die Seite AEM ContextHub Settings anzuzeigen.

  4. Wählen Sie Customize ContextHub Data Layer zum Ändern des Schemas aus.

    Für Nicht-ContextHub-Datenschichten muss dem Data Layer Root Feld ein JavaScript-Stammobjektname hinzugefügt werden. Die Definition _dl wird in den allgemeinen Beispielen in diesem Abschnitt verwendet.

  5. Klicken Sie auf Open Editor, um die Datenschichtdefinition des Schemas anzuzeigen.

    Standardmäßig wird das standardmäßige ContextHub-Schema im Editor ausgefüllt.

  6. Löschen Sie das standardmäßige Schema und fügen Sie das Schema der Site-Datenschicht ein.

    In den allgemeinen Beispielen wird das folgende Schema verwendet, das kein ContextHub-Schema ist:

    { 
      "$schema": "https://json-schema.org/draft-04/schema#", 
      "type": "object", 
      "properties": { 
        "page": { 
          "type": "object", 
          "properties": { 
            "name": { 
              "type": "string" 
            }, 
            "quantity": { 
              "type": "number" 
            }, 
            "friend": { 
              "type": "string" 
            } 
          }, 
          "required": [ 
            "name", 
            "quantity", 
            "friend" 
          ] 
        } 
       }, 
      "required": [ 
        "page" 
      ] 
    } 
    
  7. Klicken Sie auf Save and Close, um das Schema zu speichern und den Editor zu schließen, und klicken Sie dann auf Save Changes.

Ein Datenschichtdatenelement erstellen

  1. Klicken Sie in der Web-Eigenschaft auf den Tab Rules und dann im linken Menü auf Data Elements.

  2. Klicken Sie auf Create New Data Element.

  3. Geben Sie einen Namen für das Datenelement an. Nennen Sie in diesem Beispiel das Datenelement „my_friend“.

  4. Wählen Sie aus der Type Dropdown-Liste AEM ContextHub.

    Der Name des AEM ContextHub-Werkzeugs wird in der „Quelle“ eingetragen, in der aktuellen Version kann jedoch nur ein AEM ContextHub-Werkzeug definiert werden.

  5. Ordnen Sie das Datenelement der Datenschicht zu, indem Sie einen Pfad in der Objektauswahl auswählen.

    Wählen Sie in diesem Beispiel das Objekt page.friend aus.

  6. Klicken Sie auf Save Data Element.

Erstellen Sie eine ereignisbasierte Regel, die den Ereignistyp zum Ändern des Datenelements verwendet

  1. Klicken Sie in der Web-Eigenschaft auf den Tab Rules und dann im linken Menü auf Event Based Rules.

  2. Klicken Sie auf Create New Rule.

  3. Geben Sie einen Namen für die Regel ein. Nennen Sie in diesem Beispiel die Regel „find_a_friend“.

  4. Erweitern Sie den Abschnitt „Bedingungen“.

  5. Wählen Sie aus der Event Type Dropdown-Liste dataelementchanged aus.

  6. Wählen Sie das Datenelement aus, das im vorherigen Abschnitt erstellt wurde (my_friend).

  7. Wählen Sie unter Rule Conditions aus der Dropdown-Liste Data Element Value und klicken Sie dann auf Add Criteria.

  8. Wählen Sie das Datenelement aus, das im vorherigen Abschnitt erstellt wurde (my_friend), und weisen Sie ihm einen Wert zu, der die Regel auslöst.

    Verwenden Sie in diesem Beispiel „Carl“ als Wert.

    HINWEIS

    Wenn Datenelementwerte auf diese Weise als Bedingungen verwendet werden, ist es wichtig, dass die Datenelementeinstellungen bei der Zuordnung berücksichtigt werden. Wenn Sie beispielsweise die Option Force Lowercase Value in den Datenelementeinstellungen auswählen, wird der Wert vor der Auswertung in Kleinbuchstaben konvertiert. Da JavaScript von der Groß-/Kleinschreibweise abhängig ist, ist „test“ nicht mit „Test“ identisch und die Bedingung würde nicht wie erwartet ausgelöst.

  9. Erweitern Sie den Abschnitt Javascript / Third Party Tags.

  10. Klicken Sie auf Add New Script.

  11. Fügen Sie nicht sequenzielles JavaScript hinzu, das eine Benachrichtigung bereitstellt, wenn die Regel ausgelöst wird. Nennen Sie die Regel „found_my_friend“ und fügen Sie dann ein Skript für einen Warnhinweis hinzu, das dem folgenden Beispiel ähnelt:

    alert(_satellite.getVar(‘my_friend’) + ‘ is my friend.’);

  12. Klicken Sie auf Save Code und dann auf Save Rule.

Validieren der -Implementierung

Überprüfen Sie die Implementierung auf der DTM-aktivierten Website, auf der die oben genannte Web-Eigenschaft ausgeführt wird.

  • Überprüfen Sie in der Developer-Konsole, ob die Datenschicht (_dl) vorhanden ist.

  • Ändern Sie das überwachte Datenschichtobjekt in den Wert, der in der obigen Bedingung (_dl.page.friend = ‘Carl’) festgelegt wurde.

    • Bei der Beispielimplementierung sollte ein Dialog mit einem Warnhinweis geöffnet werden:

  • Ändern Sie das Objekt in einen anderen Wert (_dl.page.friend = ‘Bob’), und es sollte kein Warnhinweis angezeigt werden.

    HINWEIS

    Wenn das DTM-Debugging aktiviert ist, sollte die fehlgeschlagene Bewertung in der Konsole angezeigt werden.

  • Ändern Sie das Objekt, indem Sie den Wert des Treffers mit Kleinbuchstaben schreiben (_dl.page.friend = ‘carl’), und es sollte kein Warnhinweis angezeigt werden.

  • Ändern Sie das Objekt, indem Sie für den Wert des Treffers die korrekte Groß-/Kleinschreibung verwenden (_dl.page.friend = ‘Carl’), und der Warnhinweis sollte wieder angezeigt werden.

Auf dieser Seite