Mettre en place le tracking Google Analytics d’une page AMP

Sommaire

Partager sur :

Les pages mobiles accélérées (AMP) permettent à votre site web de s’afficher instantanément sur les appareils mobiles, ce qui améliore l’expérience des utilisateurs et améliore le classement dans les résultats de recherche Google. Toutefois, par défaut, les AMP ne prennent pas en charge Javascript et par conséquent, vous ne pouvez pas utiliser analytics.js sur ces pages. Une balise Analytics différente est fournie spécifiquement pour les AMP. Dans cet article, nous allons apprendre à implémenter Google Analytics pour une page mobile accélérée, soit via Google Tag Manager, soit en plaçant l’extrait de code directement sur vos pages. Il est important de noter que Universal Analytics (analytics.js, UA-XXXXX-Y) n’est plus pris en charge et que Google Analytics 4 (GA4) est désormais la norme recommandée pour le suivi, y compris sur AMP. L’utilisation d’un identifiant de propriété GA4 (format G-XXXXXXXXXX) est donc à privilégier. La configuration peut nécessiter des ajustements spécifiques pour distinguer les pages AMP des pages non-AMP, par exemple via des paramètres personnalisés ou des dimensions personnalisées dans GA4.

Configuration de Google Analytics pour AMP via GTM

Pour intégrer Google Tag Manager (GTM) dans les pages mobiles accélérées (AMP), vous devez créer un nouveau conteneur dédié aux AMP.

Formulaire d'ajout de compte, Google Tag Manager

Une fois le conteneur créé, il est maintenant temps de coller le code ci-dessous à la fin de la balise <head> dans vos AMP :

<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

Ensuite, au début de la balise <body>, insérez l’élément portant votre ID de conteneur GTM.

<!-- Google Tag Manager -->
<amp-analytics config="https://www.googletagmanager.com/amp.json?id=GTM-XXXXX&gtm.url=SOURCE_URL" data-credentials="include"></amp-analytics></amp-analytics>

L’ID de conteneur GTM-XXXXX doit être remplacé par un ID de conteneur réel que vous possédez dans l’extrait de code ci-dessus et le reste du document. Désormais, vous pouvez accéder à votre GTM et ajouter un identifiant de propriété Google Analytics pour pouvoir être activé sur toutes les pages mobiles accélérées.

Installation de Google Analytics sur AMP (codé en dur)

Cette approche est assez similaire de l’approche GTM dans laquelle vous devrez ajouter AMP Analytics dans votre balise « head » :

<script async custom-element="amp-analytics"
    src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>

Ensuite, dans la balise « body », collez cet extrait qui inclut votre ID de propriété Google Analytics :

<amp-analytics type="googleanalytics">
<script type="application/json">
{
  "vars": {
    "account": "UA-XXXXX-Y"
  },
  "triggers": {
    "trackPageview": {
      "on": "visible",
      "request": "pageview"
    }
  }
}
</script>
</amp-analytics>

Dans l’extrait de code ci-dessus et dans le reste du document, l’ID de propriété UA-XXXXX-Y doit être remplacé par l’identifiant de propriété que vous possédez.

Comparaison de AMP et de non-AMP dans la même propriété

Si vous avez décidé de continuer à utiliser la même propriété web pour vos pages mobiles accélérées, vous pouvez examiner les performances de vos AMP par rapport aux pages non-AMP au travers de groupes ou de segments de contenu.

1- Regroupement de contenu

Le regroupement de contenu vous permet de regrouper le contenu dans une structure logique qui reflète votre façon de penser à travers votre site. Par exemple, vous pouvez voir le nombre cumulé de pages vues de tous les AMP par rapport aux non-AMP. Pour créer un groupe de contenu, cliquez sur Admin et accédez au regroupement de contenu sous votre vue (note : cette fonctionnalité était disponible dans Universal Analytics, mais dans Google Analytics 4, il est recommandé d’utiliser des dimensions personnalisées ou des événements pour distinguer les pages AMP des pages non-AMP).

Menu des paramètres du site web affiché.

Vous avez très probablement structuré toutes vos AMP pour que l’attribut / amp / soit au début ou à la fin de vos URL. Cela nous aidera à attribuer du contenu via un ensemble de règles et à regrouper toutes les pages contenues dans / amp / dans un groupe de contenu. Pour ouvrir l’éditeur de règles, cliquez sur Grouper à l’aide des définitions de règles, puis définissez-le sur « Page contient / amp /.«

Configuration regroupement de contenu Google Analytics

Ensuite, vous devrez créer une autre définition pour les Non-AMP en créant une nouvelle règle : «La page ne contient pas / amp /».

Interface de règles pour AMP et non-AMP.

Une fois que vous avez enregistré votre regroupement de contenu, vous pourrez examiner les performances de votre groupe via une dimension principale ou secondaire.

Tableau de statistiques Google Analytics

2- Segments

Les segments sont des sous-ensembles de vos données d’analyse qui vous permettent d’isoler et d’examiner différents ensembles de données séparément. Dans Google Analytics 4, la création de segments dynamiques ou l’utilisation de comparaisons personnalisées dans l’interface d’exploration est privilégiée pour distinguer les AMP des Non-AMP.

Configuration de filtres pour sessions non-AMP dans Analytics.

Une fois que vous avez enregistré et appliqué vos segments, tous vos rapports d’analyse seront mis à jour pour inclure les segments que vous avez sélectionnés.