Implementeren met AMP

AMP is een open-source HTML-framework dat een eenvoudige manier biedt om snel en probleemloos webpagina's te maken.

Aangezien Adobe Analytics een JavaScript-bibliotheek gebruikt om een aanvraag voor een afbeelding te compileren en te verzenden, moet u de implementatie aanpassen om gegevens naar de Adobe te verzenden op pagina's die AMP gebruiken.

Bepalen welke methode Adobe Analytics op pagina's moet worden geïmplementeerd met AMP

Adobe heeft twee methoden gemaakt om Adobe Analytics op pagina's te implementeren met AMP. Beide gebruiken <amp-analytics> HTML-tag. Zie amp-analytics in de documentatie van AMP voor meer informatie.

In de volgende tabel worden deze twee methoden vergeleken:

Weeg de voor- en nadelen af, zodat u de beste implementatiemethode voor uw organisatie kunt kiezen.

Methode 1: De <amp-analytics> tag met de "adobeanalytics" template

De "adobeanalytics" het volgen malplaatje gebruikt <amp-analytics> HTML-tag om een aanvraag voor bijhouden rechtstreeks samen te stellen. U kunt raakverzoeken opgeven die moeten worden geactiveerd bij specifieke paginagebeurtenissen, zoals wanneer de pagina zichtbaar wordt of wanneer u op een klik klikt. Klik gebeurtenissen kunnen worden aangepast om op bepaalde element-id's of -klassen toe te passen door een kiezer op te geven. U kunt de sjabloon laden door type="adobeanalytics" op de tag amp-analytics.

In het volgende codevoorbeeld worden twee triggers gedefinieerd: pageLoad en click. De pageLoad activeert als het document zichtbaar wordt en de pageName variabele zoals gedefinieerd in de vars sectie. De tweede trigger click wordt geactiveerd wanneer op een knop wordt geklikt. De eVar1 variabele wordt ingesteld voor deze gebeurtenis met de waarde button clicked.

<amp-analytics type="adobeanalytics">
  <script type="application/json">
    {
      "requests": {
        "myClick": "${click}&v1=${eVar1}",
      },
      "vars": {
        "host": "example.data.adobedc.net",
        "reportSuites": "reportSuiteID1,reportSuiteID2",
        "pageName": "Adobe Analytics Using amp-analytics tag"
      },
      "triggers": {
        "pageLoad": {
          "on": "visible",
          "request": "pageview"
        },
        "click": {
          "on": "click",
          "selector": "button",
          "request": "myClick",
          "vars": {
            "eVar1": "button clicked"
          }
        }
      }
    }
  </script>
</amp-analytics>

De <amp-analytics> -tag ondersteunt variabelevervangingen, zodat AMP gegevenswaarden kan opgeven die het kent. Zie variabelen ondersteund in amp-analytics op GitHub voor meer informatie.

Adobe identificeert bezoekers die een ingebouwde functie van AMP gebruiken, en plaatst het koekje adobe_amp_id. Deze bezoeker-id is uniek voor elke andere id die door Adobe Analytics is ingesteld. Voor elke CDN waarvan een bezoeker inhoud ophaalt, wordt een andere unieke bezoeker geteld. Hierdoor kan het aantal unieke bezoekers stijgen. Het gebruik van een aparte rapportsuite voor AMP-pagina's wordt ten zeerste aanbevolen, omdat AMP unieke bezoekers identificeert. De Adobe Experience Cloud ID Service wordt niet ondersteund.

Deze oplossing vereist dat de volgende server u opgeeft in het dialoogvenster host de eigenschap komt overeen met de trackingserver op uw hoofdsite, zodat uw bestaande privacybeleidsbesturingselementen worden gerespecteerd. Anders maakt u een apart privacybeleid voor pagina's met AMP.

Methode 2: De <amp-analytics> tag met de "adobeanalytics_nativeConfig" template

De "adobeanalytics_nativeConfig" -tag is eenvoudiger te implementeren, omdat deze dezelfde coderingsmethode gebruikt die u op uw normale webpagina's gebruikt. Voeg het volgende toe aan uw amp-analytics tag:

<amp-analytics type="adobeanalytics_nativeConfig">
  <script type="application/json">
    {
      "requests": {
        "base": "https://${host}",
        "iframeMessage": "${base}/stats.html?campaign=${queryParam(campaign)}&pageURL=${ampdocUrl}&ref=${documentReferrer}"
      },
      "vars": {
        "host": "example.data.adobedc.net"
      },
      "extraUrlParams": {
      "pageName": "Example AMP page",
      "v1": "eVar1 example value"
      }
    }
 </script>
</amp-analytics>

Een HTML-pagina die wordt gehost op uw webservers is ook vereist:

<html>
  <head>
    <title>Stats Example</title>
    <script language="JavaScript" type="text/javascript" src="VisitorAPI.js"></script>
    <script language="JavaScript" type="text/javascript" src="AppMeasurement.js"></script>
  </head>
  <body>
    <script>
      var v_orgId = "INSERT-ORG-ID-HERE";
      var s_account = "examplersid1,examplersid2";
      var s_trackingServer = "example.data.adobedc.net";
      var visitor = Visitor.getInstance(v_orgId);
      visitor.trackingServer = s_trackingServer;
      var s = s_gi(s_account);
      s.account = s_account;
      s.trackingServer = s_trackingServer;
      s.visitorNamespace = s_visitorNamespace;
      s.visitor = visitor;
      s.pageName = s.Util.getQueryParam("pageName");
      s.eVar1 = s.Util.getQueryParam("v1");
      s.campaign = s.Util.getQueryParam("campaign");
      s.pageURL = s.Util.getQueryParam("pageURL");
      s.referrer = s.Util.getQueryParam("ref");
      s.t();
    </script>
  </body>
</html>

Deze benadering verzendt gegevens naar een nutWeb-pagina door vraagkoordparameters die aan worden toegevoegd iframeMessage request parameter. Deze parameters van het vraagkoord kunnen worden genoemd wat u houdt, zolang uw stats.html pagina is geconfigureerd om gegevens van deze pagina te verzamelen.

De "adobeanalytics_nativeConfig" sjabloon voegt ook parameters van queryreeksen toe op basis van de variabelen in de extraUrlParams van de <amp-analytics> -tag. In het bovenstaande voorbeeld wordt pageName en v1 de parameters worden opgenomen.

Als een gebruiker deze methode gebruikt en op uw primaire site niet meer wil bijhouden, wordt het bijhouden van de gegevens bij al uw AMP's ook uitgeschakeld. Het gebruik van deze hulpprogrammapagina betekent ook dat AMP de Adobe Experience Cloud ID Service kan ondersteunen. Een afzonderlijke rapportsuite is niet vereist.

Koppelingen bijhouden en video bijhouden kunnen niet worden gebruikt met deze methode. De iframeMessage -tag in AMP kan slechts één keer per pagina worden geladen, zodat u geen andere afbeeldingsaanvragen kunt verzenden nadat het frame is geladen. Voor deze methode zijn ook meer verwerkingsbronnen nodig die de prestaties van het schuiven kunnen beïnvloeden. Deze methode heeft geen invloed op de laadtijd van de pagina, aangezien alle bronnen asynchroon worden geladen.

Veelgestelde vragen

Hoe kan ik AMP-bezoekers onderscheiden van anderen in mijn gegevens?

Voor alle AMP-pagina's JavaScript Version dimensie verzamelt een waarde die vergelijkbaar is met AMP vX.X. U kunt ook een aangepaste dimensie instellen op 'AMP', zodat u deze bezoekers kunt segmenteren.

Hoe verhoudt deze implementatiemethode zich tot Facebook Instant-artikelen?

Facebook Instant Articles biedt een vergelijkbare oplossing voor de "adobeanalytics_nativeConfig" methode. De stats.html -pagina voor deze methode kunt u gebruiken voor uw analytische behoeften voor AMP en FIA tegelijk. Voor meer informatie over het uitvoeren van het volgen op FIA, zie Facebook Instant Artikelen.