{"id":1091,"date":"2020-05-21T23:49:58","date_gmt":"2020-05-21T21:49:58","guid":{"rendered":"https:\/\/taillet.fr\/blog\/?p=1091"},"modified":"2020-05-27T14:34:14","modified_gmt":"2020-05-27T12:34:14","slug":"valider-nimporte-quel-datalayer","status":"publish","type":"post","link":"https:\/\/taillet.fr\/blog\/collecte\/valider-nimporte-quel-datalayer\/","title":{"rendered":"Valider n’importe quel datalayer"},"content":{"rendered":"\n

Au cours de ma carri\u00e8re de webanalyste, j’ai r\u00e9alis\u00e9 des centaines d’impl\u00e9mentations. Certaines \u00e9taient plus difficiles que d’autres, la faute revenant g\u00e9n\u00e9ralement \u00e0 la multiplication des phases de recette.<\/p>\n\n\n\n

L’un de mes outils pr\u00e9f\u00e9r\u00e9s est sans conteste mon \u00ab\u00a0lecteur\u00a0\u00bb de datalayer, qui permet de mettre \u00e0 plat les informations contenues dans le datalayer, sans avoir \u00e0 cliquer comme un fou pour d\u00e9plier les objets imbriqu\u00e9s les uns dans les autres.<\/p>\n\n\n\n

\n
\n
\"Exemple
Le dataLayer de base, \u00e0 d\u00e9plier soi-m\u00eame #ikea<\/figcaption><\/figure><\/div>\n<\/div>\n\n\n\n
\n
\"Exemple
Le dataLayer plac\u00e9 dans un beau tableau facile \u00e0 lire<\/figcaption><\/figure><\/div>\n<\/div>\n<\/div>\n\n\n\n

L’outil en question consiste en un raccourci (script) plac\u00e9 sur la barre des t\u00e2ches du navigateur, qui vous permettra de lire le datalayer en un clic.<\/p>\n\n\n\n

Comment ajouter le script sur votre navigateur<\/h2>\n\n\n\n

Il vous suffit de cr\u00e9er un nouveau raccourci dans votre barre des t\u00e2ches et d’y coller le script :<\/p>\n\n\n\n

  1. Clic droit sur la barre des t\u00e2ches, puis \u00ab\u00a0Ajouter une page\u00a0\u00bb<\/li>
  2. Donner un nom \u00e0 ce raccourci et remplacer \u00ab\u00a0URL\u00a0\u00bb par le script lui-m\u00eame<\/li>
  3. Indiquer le datalayer \u00e0 tester au tout d\u00e9but du script (ex : dataLayer)<\/li><\/ol>\n\n\n\n

    Contenu du script<\/h2>\n\n\n\n

    Le script est pr\u00eat \u00e0 l’emploi pour tester un dataLayer Google Analytics. Si vous souhaitez tester un autre type de datalayer, vous n’avez qu’\u00e0 modifier le nom du datalayer dans les toutes premi\u00e8res lignes du code (dataLayer Google, tc_vars de Commanders Act ou encore un objet custom pour Adobe).<\/p>\n\n\n\n

    javascript:\n\/* Le nom du datalayer. Ici : dataLayer (celui de Google Analytics) *\/\nvar datalayer=dataLayer;\n\n\/* Script du lecteur de datalayer, par Nicolas Taillet *\/\nvar result={};function data(a){this.value=a}function readDatalayer(a,e){for(var t in e\/2>=0&&(e=\"\"),a)if(a.hasOwnProperty(t)&&\"push\"!==t&&\"_push\"!==t){var r=a[t];\"object\"!=typeof r&&\"\"!==r?e&&\"\"!==e?result[e+\".\"+t]=new data(r):result[t]=new data(r):readDatalayer(r,e&&\"\"!==e?e+\".\"+t:t)}}readDatalayer(datalayer);console.log(\"Lecteur de datalayer, par Nicolas Taillet | https:\/\/taillet.fr\/blog\/\");console.table(result);<\/pre>\n\n\n\n
    Utilisation du script<\/h2>\n\n\n\n
    Maintenant que le script est pr\u00eat, vous pouvez l’essayer sur la page que vous voulez.<\/p>\n\n\n\n
    Il suffit alors de :<\/p>\n\n\n\n
    1. Ouvrir la console de d\u00e9veloppement (F12)<\/li>
    2. Cliquer sur le raccourci<\/li>
    3. Lire les informations contenues dans le datalayer<\/li><\/ol>\n\n\n\n
      Exemples de sites… au hasard \ud83d\ude42<\/h2>\n\n\n\n
      Sur https:\/\/tagmanager.google.com<\/a><\/h3>\n\n\n\n
      \"\"
      dataLayer de Google<\/figcaption><\/figure>\n\n\n\n
      Sur https:\/\/www.commandersact.com\/fr\/solutions\/tagcommander\/<\/a><\/h3>\n\n\n\n
      \"\"
      tc_vars de Commanders Act<\/figcaption><\/figure>\n\n\n\n
      Sur https:\/\/tealium.com\/fr\/<\/a><\/h3>\n\n\n\n
      \"\"
      utag_data de Tealium<\/figcaption><\/figure>\n\n\n\n
      En r\u00e9sum\u00e9<\/h2>\n\n\n\n
      \"\"A partir de maintenant, vous devriez \u00eatre en mesure d’int\u00e9grer n’importe quel tag m\u00e9dia, f\u00e9licitations ! L’ajout de tags est une t\u00e2che tr\u00e8s courante chez les analystes web, mais met souvent en difficult\u00e9 les moins senior.
      Si vous ne vous sentez pas encore \u00e0 l’aise \u00e0 la suite la lecture de cet article, je vous encourage fortement \u00e0 vous former en JavaScript. Paul-K\u00e9vin pourrait vous soutenir que le JavaScript est inutile, mais GTM ne propose pas de tag tout pr\u00eat pour 100% des solutions \ud83d\ude09<\/p>\n","protected":false},"excerpt":{"rendered":"
      Au fur et \u00e0 mesure des ann\u00e9es, j’ai cr\u00e9\u00e9 de multiples outils qui me permettaient de gagner en efficacit\u00e9, tant sur la phase de collecte des informations que de leur validation. J’aimerais aujourd’hui vous partager un outil d’aide \u00e0 la lecture du datalayer.<\/p>\n","protected":false},"author":1,"featured_media":1131,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[15],"tags":[25,26],"_links":{"self":[{"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/posts\/1091"}],"collection":[{"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/comments?post=1091"}],"version-history":[{"count":50,"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/posts\/1091\/revisions"}],"predecessor-version":[{"id":1174,"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/posts\/1091\/revisions\/1174"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/media\/1131"}],"wp:attachment":[{"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/media?parent=1091"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/categories?post=1091"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/taillet.fr\/blog\/wp-json\/wp\/v2\/tags?post=1091"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}