Developers » AS2 tagging » JavaScript » Fonctionnalités avancées » Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)
Avant-propos
Les pages au format Accelerated Mobile Pages (AMP) sont optimisées pour le chargement sur mobile. AT Internet est intégré nativement au projet, ce qui vous permet d’utiliser un marquage adapté via la balise dédiée <amp-analytics>
.
Pré-requis
Afin de faire fonctionner correctement ce composant, soyez attentifs aux points suivants :
- Intégration de l’extension amp-analytics en amont d’AMP
- Utilisation du serveur de collecte (log) sécurisé
Marquage standard
Certains paramètres doivent être renseignés pour permettre le bon envoi des informations.
Tout d’abord, les paramètres de base :
"vars": { "site": "YOURSITEID", "log": "YOURSSLLOG", "domain": ".YOURDOMAINLOG", "title": "pageChapter::pageTitle", "level2": "10" }
Paramètre | Définition |
---|---|
vars.site | Numéro de site |
vars.log | Serveur de collecte sécurisé (SSL) obligatoirement |
vars.domain | Domaine de collecte |
vars.title | Libellé de la page chargée (avec chapitrage) |
vars.level2 | Niveau 2 de la page chargée |
vars.pixelPath | Chemin du pixel du hit (par défaut hit.xiti ). Valable uniquement avec le CDDC. |
Requests disponibles
Nous proposons deux types de requests à appeler dans vos triggers, l’une permet de marquer le chargement de la page, la seconde permet de marquer un clic réalisé sur la page.
pageview
La request « pageview » permet d’envoyer une information de page vue. Voici un exemple d’appel :
"defaultPageview": { "on": "visible", "request": "pageview" }
Aucun paramètre n’est à renseigner ici. Les informations de page doivent être renseignées dans les variables de base du marqueur.
click
La request « click » permet d’envoyer une information de clic. Voici un exemple d’appel :
"links": { "on": "click", "selector": "a", "request": "click", "vars": { "label": "clickChapter::clickLabel", "level2Click": "12", "type": "a" } }
Trois paramètres sont disponibles pour ce marquage :
Paramètre | Définition |
---|---|
vars.label | Libellé du clic (avec chapitrage) |
vars.level2Click | Niveau 2 du clic |
vars.type | Type de clic. Valeurs possibles : – a : clic d’action – n : clic de navigation – s : clic de sortie – t : clic de téléchargement |
Marqueur complet
Voici un exemple de marqueur complet, permettant de mesurer le chargement de la page, ainsi que l’ensemble des clics présents sur la page.
<amp-analytics type="atinternet" id="atinternet"> <script type="application/json"> { "vars": { "site": "YOURSITEID", "log": "YOURSSLLOG", "domain": ".YOURDOMAINLOG", "title": "pageChapter::pageTitle", "level2": "10" }, "triggers": { "defaultPageview": { "on": "visible", "request": "pageview" }, "links": { "on": "click", "selector": "a", "request": "click", "vars": { "label": "clickChapter::clickLabel", "level2Click": "12", "type": "a" } } } } </script> </amp-analytics>
Marquage d’informations spécifiques
Afin de marquer certaines informations non intégrées par défaut, il est possible de définir des paramètres supplémentaires, nommés extraUrlParams
.
Ceux-ci peuvent être utilisés sur l’ensemble des triggers disponibles. Les extraUrlParams
au niveau des triggers sont prioritaires sur ceux renseignés à la racine.
Exemples
Indicateurs personnalisés
<amp-analytics type="atinternet" id="atinternet"> <script type="application/json"> { "vars": { "site": "YOURSITEID", "log": "YOURSSLLOG", "domain": ".YOURDOMAINLOG", "title": "pageChapter::pageTitle", "level2": "10" }, "triggers": { "defaultPageview": { "on": "visible", "request": "pageview", "extraUrlParams": { "x1": 25, "x2": "[Text]", "f1": "[Label]" } }, "links": { "on": "click", "selector": "a", "request": "click", "vars": { "label": "clickChapter::clickLabel", "level2Click": "12", "type": "a" } } } } </script> </amp-analytics>
Ce code générera un hit de page avec les informations suivantes :
- L’indicateur de site 1 avec la valeur « 25 » (
x1=25
) - L’indicateur de site 2 avec la valeur « Text » (
x2=[Text]
) - L’indicateur de page 1 avec la valeur « Label » (
f1=[Label]
)
Visiteurs identifiés
<amp-analytics type="atinternet" id="atinternet"> <script type="application/json"> { "vars": { "site": "YOURSITEID", "log": "YOURSSLLOG", "domain": ".YOURDOMAINLOG", "title": "pageChapter::pageTitle", "level2": "10" }, "triggers": { "defaultPageview": { "on": "visible", "request": "pageview", "extraUrlParams": { "an": 5588964, "ac": 2 } }, "links": { "on": "click", "selector": "a", "request": "click", "vars": { "label": "clickChapter::clickLabel", "level2Click": "12", "type": "a" } } } } </script> </amp-analytics>
Ce code ajoutera au hit de page l’information de visiteur identifié suivante :
- Identifiant du visiteur « 5588964 » (
an=5588964
) - Catégorie du visiteur « 2 » (
ac=2
)
Custom object
<amp-analytics type="atinternet" id="atinternet"> <script type="application/json"> { "vars": { "site": "YOURSITEID", "log": "YOURSSLLOG", "domain": ".YOURDOMAINLOG", "title": "pageChapter::pageTitle", "level2": "10" }, "triggers": { "defaultPageview": { "on": "visible", "request": "pageview", "extraUrlParams": { "stc": "{\"articleId\":\"123456\"}" } }, "links": { "on": "click", "selector": "a", "request": "click", "vars": { "label": "clickChapter::clickLabel", "level2Click": "12", "type": "a" } } } } </script> </amp-analytics>
Ce code ajoutera au hit de page le custom object suivant :
{
"articleId": "123456"
}