Ensemble des articles pour le mot clé Google Tag Manager
nov
13

Tracking ecommerce Google Analytics avec Google Tag Manager et son dataLayer

Google a enfin sorti son outil de Tag management. Tout le monde est au courant. J’en ai donc profité pour faire quelques petits tests et je me suis rendu compte que peu de ressources étaient disponibles aujourd’hui concernant le tracking ecommerce et donc le tag transactionnel avec cet outil.

Avant de lire ce que je vais exposer rapidement, et surtout si vous ne savez pas ce qu’est Tag Manager, je vous invite à regarder cette petite vidéo d’introduction.

Depuis peu, lors de la configuration d’une balise de type Google Analytics, vous pouvez définir un type de suivi « Transaction ». Ce type de suivi correspond au tag ecommerce de Google analytics.

Durant mes recherches, je n’ai pas trouvé de code me permettant d’utiliser ce type de balise en utilisant le dataLayer (ou couche de donnée en français) de Google Tag Manager. J’ai trouvé beaucoup de ressources qui exposaient l’utilisation d’astuces et surtout de balises custom HTML. Or Google fournit tous les outils permettant l’utilisation du dataLayer pour gérer dynamiquement ce type de tracking.

Deux liens indispensables à la compréhension du code :

Une fois votre balise de type Google Analytics avec type de suivi « transaction » créée, vous pouvez définir une règle de déclenchement à lui appliquer afin qu’elle ne parte que sur la dernière page de votre tunnel d’achat. Prenons comme exemple la page /merci.php, voici la règle à définir :

Après avoir configuré tout cela, il ne vous suffira plus qu’à mettre le script suivant juste avant le script de votre conteneur. Ce code est un exemple à dynamiser à l’aide de vos chers collègues développeurs.

<script>
    dataLayer = [{
      'transactionId': '1234',
      'transactionDate': '13112012',
      'transactionType': 'Type 1',
      'transactionAffiliation': 'ACME Clothing',
      'transactionTotal': 25.60,
      'transactionShipping': 5.00,
      'transactionTax': 1.00,
      'transactionPaymentType': 'Paypal',
      'transactionCurrency': 'EUR',
      'transactionShippingMethod': 'Retrait magasin',
      'transactionPromoCode': '',
      'transactionProducts': [{
        'id': '12',
        'name': 'bottes rouge croco',
        'sku': '45622FRES',
        'category': 'chaussures > bottes',
        'price': 450.00,
        'quantity': 2
        },
        {
        'id': '14',
        'name': 'veste cuir noire',
        'sku': '456VESRTE',
        'category': 'vêtements > vestes',
        'price': 750.00,
        'quantity': 1
        }]
    }];
    
  </script>
									

Chaque produit du panier doit être un élément du tableau transactionProducts. Cela équivaut à l’exécution d’un _addItem par produit.

On remarque par rapport au code basique actuel que les variables city, state or province et country n’ont pas d’équivalent dans le dataLayer. Arrêtez-moi si je me trompe, mais il me semble que de toute façon ces variables ne sont actuellement pas personnalisables au niveau du tag transactionnel. Google analytics récupère automatiquement les propriétés pays / région / ville du visiteurs qu’il applique à la transaction. J’avais déjà fait quelques tests pour utiliser ces variables et y insérer d’autres données, sans succès.

Le contenu de la requête http sur la transaction :

City, country et region sont en undefined.

On remarque également que de nouvelles variables font leur apparition (et donc sûrement de nouvelles dimensions natives dans l’outil) : type de transaction, date de la transaction, type de paiement, mode de livraison, code promo.

Le contenu de la requête http sur un item :

Beaucoup de variables qui ont une valeur dans le dataLayer n’apparaissent pas encore aujourd’hui…

Tout cela me fait penser à tout ce que l’Universal Analytics pourrait apporter dans les prochains mois. Le Google Tag Manager est clairement fait pour la mise à disposition de nouvelles dimensions, qu’elles soient prédéfinies ou personnalisées.

Si vous avez des remarques, astuces ou conseils à partager, n’hésitez pas !

Google+