Integrera AEM Sites och Adobe Analytics

Logga in på Experience Platform och skapa en taggegenskap (om du inte redan gjort det).

Kontrollera att en inledande tagg för JavaScript bibliotek har skapats och befordrats till taggen environment.

Kopiera JavaScript inbäddningskod från den taggmiljö där ditt bibliotek har publicerats.

Öppna en ny flik i webbläsaren och gå till WKND-platsen

Öppna webbläsartillägget Experience Platform Debugger

Navigera till Experience Platform-taggar > Konfiguration och under Inmatade inbäddningskoder ersätt den befintliga inbäddningskoden med din inbäddningskod som kopierats från steg 3.

Aktivera Konsolloggning och Lås felsökningsprogrammet på fliken WKND.

Navigera till WKND-plats.

Öppna webbläsarens utvecklarverktyg och gå till konsolen. Kör följande kommando:

adobeDataLayer.getState();

Ovanför kod returnerar det aktuella läget för Adobe-klientdatalagret.

Expandera svaret och inspektera posten page. Du bör se ett dataschema som följande:

page-2eee4f8914:
    @type: "wknd/components/page"
    dc:description: WKND is a collective of outdoors, music, crafts, adventure sports, and travel enthusiasts that want to share our experiences, connections, and expertise with the world.
    dc:title: "WKND Adventures and Travel"
    repo:modifyDate: "2020-08-31T21:02:21Z"
    repo:path: "/content/wknd/us/en.html"
    xdm:language: "en-US"
    xdm:tags: ["Attract"]
    xdm:template: "/conf/wknd/settings/wcm/templates/landing-page-template"

Om du vill skicka siddata till Adobe Analytics använder vi standardegenskaperna dc:title, xdm:language och xdm:template för datalagret.

Mer information finns i sidschemat från huvudkomponentens datamodeller.

Navigera till Experience Platform och till taggegenskapen som är integrerad med AEM.

Navigera till avsnittet Regler i gränssnittet för taggegenskaper och klicka sedan på Skapa ny regel.

Namnge regeln Sida inläst.

Klicka på Lägg till i underavsnittet Händelser för att öppna guiden Händelsekonfiguration.

För fältet Händelsetyp väljer du Egen kod.

Klicka på Öppna redigeraren i huvudpanelen och ange följande kodfragment:

var pageShownEventHandler = function(evt) {
   // defensive coding to avoid a null pointer exception
   if(evt.hasOwnProperty("eventInfo") && evt.eventInfo.hasOwnProperty("path")) {
      //trigger the Tag Rule and pass event
      console.log("cmp:show event: " + evt.eventInfo.path);
      var event = {
         //include the path of the component that triggered the event
         path: evt.eventInfo.path,
         //get the state of the component that triggered the event
         component: window.adobeDataLayer.getState(evt.eventInfo.path)
      };

      //Trigger the Tag Rule, passing in the new `event` object
      // the `event` obj can now be referenced by the reserved name `event` by other Tag data elements
      // i.e `event.component['someKey']`
      trigger(event);
   }
}

//set the namespace to avoid a potential race condition
window.adobeDataLayer = window.adobeDataLayer || [];
//push the event listener for cmp:show into the data layer
window.adobeDataLayer.push(function (dl) {
   //add event listener for `cmp:show` and callback to the `pageShownEventHandler` function
   dl.addEventListener("cmp:show", pageShownEventHandler);
});

Ovanstående kodfragment lägger till en händelseavlyssnare genom att överföra en funktion till datalagret. När händelsen cmp:show aktiveras anropas funktionen pageShownEventHandler. I den här funktionen läggs några säkerhetskontroller till och en ny event skapas med det senaste -läget för datalagretför komponenten som utlöste händelsen.

Slutligen anropas funktionen trigger(event). Funktionen trigger() är ett reserverat namn i taggegenskapen och den utlöser regeln. Objektet event skickas som en parameter som i sin tur visas med ett annat reserverat namn i taggegenskapen. Dataelement i taggegenskapen kan nu referera till olika egenskaper med kodfragment som event.component['someKey'].

Spara ändringarna.

Klicka på Lägg till under Åtgärder för att öppna guiden Åtgärdskonfiguration.

Välj Anpassad kod för fältet Åtgärdstyp.

Klicka på Öppna redigeraren i huvudpanelen och ange följande kodfragment:

console.log("Page Loaded ");
console.log("Page name: " + event.component['dc:title']);
console.log("Page type: " + event.component['@type']);
console.log("Page template: " + event.component['xdm:template']);

Objektet event skickas från metoden trigger() som anropas i den anpassade händelsen. Här är component den aktuella sidan som härleds från datalagret getState i den anpassade händelsen.

Spara ändringarna och kör en build i taggegenskapen för att befordra koden till den miljö som används på AEM.

Navigera till AEM webbplats och öppna utvecklarverktygen för att visa konsolen. Uppdatera sidan så ser du att konsolmeddelandena har loggats:

Navigera till Experience Platform och till taggegenskapen som är integrerad med AEM.

Navigera till avsnittet Dataelement och klicka på Skapa nytt dataelement.

Ange komponentresurstypen för fältet Namn.

Välj Anpassad kod för fältet Dataelementtyp.

Klicka på knappen Öppna redigeraren och ange följande i den anpassade kodredigeraren:

if(event && event.component && event.component.hasOwnProperty('@type')) {
    return event.component['@type'];
}

Spara ändringarna.

Klicka på knappen Lägg till dataelement

Ange Sidnamn för fältet Namn.

Välj Anpassad kod för fältet Dataelementtyp.

Klicka på knappen Öppna redigeraren och ange följande i den anpassade kodredigeraren:

if(event && event.component && event.component.hasOwnProperty('dc:title')) {
    return event.component['dc:title'];
}

Spara ändringarna.

Klicka på knappen Lägg till dataelement

Ange Sidmall för fältet Namn.

Välj Anpassad kod för fältet Dataelementtyp.

Klicka på knappen Öppna redigeraren och ange följande i den anpassade kodredigeraren:

if(event && event.component && event.component.hasOwnProperty('xdm:template')) {
    return event.component['xdm:template'];
}

Spara ändringarna.

Du bör nu ha tre dataelement som en del av din regel:

Navigera till Experience Platform och till taggegenskapen som är integrerad med AEM.

Gå till Tillägg > Katalog

Leta reda på tillägget Adobe Analytics och klicka på Installera

Under Bibliotekshantering > Rapportsviter anger du de ID:n för rapportsviten som du vill använda för varje taggmiljö.

Markera kryssrutan för att aktivera Använd Activity Map.

Under Allmänt > Spårningsserver anger du spårningsservern, till exempel tmd.sc.omtrdc.net. Ange din SSL-spårningsserver om din webbplats stöder https://

Klicka på Spara för att spara ändringarna.

Navigera till regeln Sidinläsning som skapades tidigare i gränssnittet för taggegenskaper.

Under Villkor klickar du på Lägg till för att öppna guiden Konfiguration av villkor.

Välj alternativet Värdejämförelse för fältet Villkorstyp.

Ange det första värdet i formulärfältet till %Component Resource Type%. Du kan använda dataelementikonen för att välja dataelementet Component Resource Type . Låt jämförelseobjektet vara Equals.

Ange det andra värdet som wknd/components/page.

Spara ändringarna.

Ta bort åtgärden Core - Custom Code (konsolprogramsatserna) i regeln för sidinläsning: Ta bort: Core - Custom Code:

Klicka på Lägg till under åtgärdsunderavsnittet för att lägga till en ny åtgärd.

Ange typen Tillägg till Adobe Analytics och ställ in Åtgärdstyp till Ange variabler

Markera en tillgänglig eVar på huvudpanelen och ange som värde för dataelementets sidmall. Använd ikonen för att välja elementet Sidmall.

Bläddra nedåt, under Ytterligare inställningar ange Sidnamn till dataelementet Sidnamn:

Spara ändringarna.

Lägg sedan till en extra åtgärd till höger om Adobe Analytics - Ange variabler genom att trycka på ikonen plus :

Ange typen Tillägg till Adobe Analytics och ställ in åtgärdstypen till Skicka Beacon. Eftersom den här åtgärden betraktas som en sidvy låter du standardspårningsinställningen vara s.t().

Spara ändringarna. Regeln Sidinläsning bör nu ha följande konfiguration:

• 1. Lyssna efter händelsen cmp:show.
• 2. Kontrollera att händelsen utlöstes av en sida.
• 3. Ange analysvariabler för Sidnamn och Sidmall
• 4. Skicka analyssidans vy

Spara alla ändringar och bygg ditt taggbibliotek och marknadsför till rätt miljö.

Öppna WKND-platsen i webbläsaren.

Klicka på felsökningsikonen för att öppna Experience Platform Debugger.

Kontrollera att felsökaren mappar taggegenskapen till din-utvecklingsmiljö, enligt beskrivningen ovan, och att Konsolloggning är markerad.

Öppna Analytics-menyn och kontrollera att rapportsviten är inställd på din-rapportsvit. Sidnamnet ska också fyllas i:

Bläddra nedåt och expandera Nätverksförfrågningar. Du bör kunna hitta uppsättningen evar för sidmallen:

Gå tillbaka till webbläsaren och öppna utvecklarkonsolen. Klicka igenom Carousel överst på sidan.

Observera följande i webbläsarkonsolen:

Detta beror på att Carousel utlöser en cmp:show-händelse , men på grund av vår kontroll av komponentresurstypen utlöses ingen händelse.

Navigera till en artikelsida som Western Australia. Lägg märke till att sidnamnet och malltypen ändras.