Dans Google Tag Manager, il y a une variable importante, la Regex Table ou en bon français, le tableau d’expression régulière. Importante au moins pour le marketing intimidé par le mot JavaScript. La présence de cette variable dans la caisse à outils GTM va vous permettre d’affiner la configuration des balises.
Peut-être avez-vous déjà utilisé la variable Lookup table ou Tableau de conversion et relevé la limite de la correspondance exacte entre la valeur entrante (input) et les valeurs de référence, notamment pour le traitement des URL, souvent très longues. Par exemple pour analyser dynamiquement la présence d’une information dans les URL , il fallait créer une variable JavaScript personnalisée.
function() {
var inputVariable = {{Page Path}};
var defaultVal = undefined;
var table = [
['^/recettes/.+', 'recette'],
['^/recherche/.+/bundle/recipe.*', 'recherche'],
['^/idees-recettes/recettes-.+', 'recette']
];
for (var i = 0, len = table.length; i < len; i += 1) {
var regex = new RegExp(table[i][0]);
if (regex.test(inputVariable)) {
return table[i][1];
}
}
return defaultVal;
}Mais ce genre de script semble obsolète depuis l’arrivé de la variable « Regex Table ». Si le tableau d’expressions régulières vous épargne du JavaScript, il vous demande de vous intéresser au Regex. Si nécessaire, lisez ou relisez l’article bien nommé : apprendre les expressions régulières (Regex) avec Google Analytics.
En résumé, une expression régulière (RegEx) est un motif ou pattern utilisé pour correspondre à certaines combinaisons de caractères au sein d’une chaîne de caractères. Par exemple en reprenant l’exemple dans la page sur les expressions régulières Wikipédia : l’ensemble de mots « ex-équo, ex-equo, ex-aequo et ex-æquo » peut être condensé en un seul motif « ex-(a?e|æ|é)quo ».
Voici un petit mémo sur la base du RegEx.
| Opérateurs | Déscription | Exemple | Match | Ne match pas |
| \ | La barre oblique inversée (backslash) permet d’échapper un caractère qui ne doit pas être considéré comme un opérateur RegEx. | webanalyste\.com\/formation | ||
| ^abc | L’accent circonflexe « ^ » en début d’expression signifie « commence par ». | ^\/formation\/ | /formation/ /formation/google-analytics | /formation /formation/google-tag-manager |
| abc$ | Le dollar « $ » en fin d’expression signifie « se termine par ». | ^\/$ | / | /formation |
| a|b | Le pipe (AtlGr + 6) signifie OU. A ou B. | facebook|twitter | facebook | |
| (abc) | Les parenthèses permettent de prioriser un traitement, de regrouper une sous-chaîne (avec capture que nous verrons plus bas, dans les paramètres avancés de la variable Table Regex. | google\-(tag\-manager|analytics) | google-tag-manager google-analytics | google-data-studio |
| [abc] | Les crochets permettent de lister des caractères autorisés, a ou b ou c. Similaire de a|b|c. | manag[eio]r | manager managor | managar |
| [^abc] | Les crochets avec débutant avec un circonflexe « ^ » permettent de lister des caractères non autorisés, pas a, pas b, pas c. | manag[^eio]r | managar | manager managor |
| [a-z] | Les crochets avec un tiret permettent de créer une liste de caractères autorisés. [a-z] est similaire de [abcdefghijklmonpqrstuvwxyz], idem pour [A-Z] pour une correspondance en majuscule. Dans les paramètres avancés de la variable table Regex, il y une option case insensitive. [0-9] est similaire de [0123456789] ou en plus court : \d. [a-z0-9] est similaire de [abcdefghijklmonpqrstuvwxyz0123456789] ou en plus court \w. | \/article\-[1-3][a-z][a-z]\/ | /article-1be/ /article-6yo/ | /article-4as/ /article-r2d2/ |
| [a-z]{3} | Les accolades permettent de préciser le nombre de répétitions du caractère précédant. [a-z]{3} = 3 lettres de a à z. [a-z]{1,3} = de 1 à 3 lettres de a à z. [a-z0-9]{,9} = 9 lettres ou chiffres maximum, de a à z et/ou chiffre de 0 à 9. [1-9]{2,} = 2 chiffres minimum de 1 à 9. | \/article\-\w{3}\/ | /article-1be/ /article-4as/ | / article-r2d2/ /article-6x/ |
| . | Le point « . » correspond à n’importe quel caractère. | .{4,10} | data_smart r2d2 | un 1 |
| * | L’astérisque « * » correspond à 0 ou plusieurs répétitions du caractère précédant – similaire de {0,}. | |||
| + | le signe plus « + » correspond à 1 ou plusieurs répétitions du caractère précédant – similaire de {1,}. | |||
| ? | Le point d’interrogation « ? » correspond à 0 ou 1 répétition du caractère précédant – similaire de {,1}. |
Maintenant que vous êtes outillé, avançons vers un exemple concret sur formations-analytics.com où la variable « Regex Table » sera très utile.
Comment utiliser la variable tableau d’expressions régulières GTM pour tracker les réseaux sociaux.
Le but est de tracker les 2 types d’interactions sociales sur le site, à savoir le « share » et le « join-us ». Je sais que l’URL cliquée me permet de distinguer les deux types d’interaction, en plus d’identifier le nom du réseau. La première intègre souvent une sémantique liée au partage, tandis que la seconde intègre les identifiants des pages sur les réseaux sociaux.
Voici l’approche.
- Faire l’inventaire des URL de référence des réseaux sociaux.
- Créer une variable « social action » de type « Table Regex » pour identifier l’action.
- Créer une variable « social name » de type « Table Regex » pour identifier le nom du réseau.
- Créer un déclencheur à partir de la variable « social action ».
- Utiliser le déclencheur pour activer une balise event Google Analytics pour reporter les variables à chaque interaction « social ».
Faire l’inventaire des URL de référence des réseaux sociaux.
Là, rien de bien compliqué, il suffit de faire clique droit sur chaque type de lien « social », puis de copier l’adresse du lien dans un fichier texte, comme Notepad++.
Voici les principales URL sortantes du site formations-analytics.com.
Liens "share" https://www.facebook.com/sharer/sharer.php?u=https://www.formations-analytics.com/ https://twitter.com/intent/tweet?source=webclient&original_referer=https://www.formations-analytics.com/&text=Collecter%20des%20donn%C3%A9es%20ecommerce%20concurrent%20avec%20Google%20Sheets%20et%20Data%20Studio&url=https://www.formations-analytics.com/&related=webanalyste&via=webanalyste https://plus.google.com/share?url=https://www.formations-analytics.com/ https://pinterest.com/pin/create/bookmarklet/?media=https://www.formations-analytics.com/wp-content/uploads/2017/08/srapping-ecommerce-google-sheet-data-studio-dashboard-visu.gif&url=https://www.formations-analytics.com/&title=Collecter%20des%20donn%C3%A9es%20ecommerce%20concurrent%20avec%20Google%20Sheets%20et%20Data%20Studio&description= https://www.viadeo.com/?url=https://www.formations-analytics.com/&title=Collecter%20des%20donn%C3%A9es%20ecommerce%20concurrent%20avec%20Google%20Sheets%20et%20Data%20Studio https://www.linkedin.com/shareArticle?mini=true&ro=true&trk=JuizSocialPostSharer&title=Collecter%20des%20donn%C3%A9es%20ecommerce%20concurrent%20avec%20Google%20Sheets%20et%20Data%20Studio&url=https://www.formations-analytics.com/ Liens "join-us" https://plus.google.com/111252622894219085928?rel=author http://fr.linkedin.com/in/fscandolera https://www.facebook.com/webanalyste/
Une fois qu’on a une vision globale des URL à considérer, on va les simplifier pour avoir une base distinctive facilement utilisable dans Google Tag Manager. Le but est de garder la substantifique moelle qui permette de distinguer un lien « social » des autres liens du site. On verra dans GTM, comment ajouter des critères distinctifs avec les expressions régulières.
Liens "share-it" facebook.com/sharer twitter.com/intent/tweet plus.google.com/share pinterest.com/pin/create viadeo.com/?url linkedin.com/shareArticle Liens "join-us" plus.google.com/111252622894219085928 linkedin.com/in/fscandolera twitter.com/webAnalyste facebook.com/webanalyste
Créer une variable « social action » de type Table Regex pour identifier le type d’interaction « social ».
La variable Table Regex (tableau d’expressions régulières) fonctionne comme la lookup table (Tableau de conversion). Elle compare la valeur d’une variable entrante avec celles que vous avez définies dans chaque ligne de la variable. L’avantage d’utiliser une expression régulière c’est de pouvoir analyser une correspondance relative et complexe. La variable Table Regex peut être très puissante dans le traitement de l’information en la combinant avec d’autres variables GTM.
La table regex de la variable « social action », testera les {{Click URL}} pour vérifier la correspondance avec l’une des URL simplifiées et regexées. Le traitement Regex se limite à échapper « \ » tous les caractères (point, slash, tiret, point d’interrogation…) qui de doivent pas être considéré comme des opérateurs Regex. Sans cela, la correspondance ne fonctionnera pas.
Liens « share-it »
- facebook\.com\/sharer
- twitter\.com\/intent\/tweet
- plus\.google\.com\/share
- pinterest\.com\/pin/create
- viadeo\.com/\?url
- linkedin\.com\/shareArticle
Liens « join-us »
- plus\.google\.com\/111252622894219085928
- linkedin\.com\/in\/fscandolera
- twitter\.com\/webAnalyste
- facebook\.com\/webanalyste
En regardant le visuel ci-dessus, vous souriez, vous pensez que ce n’est pas si compliqué que « CA », et vous avez raison. Sauf que « CA » peut être cruel. Pour qu’il y est une correspondance, il faut 2 valeurs, l’input et la ligne d’expression régulière. La seconde, on maîtrise, mais quand est-il de la première, « {{Click URL}} ». Une valeur qui correspond à l’URL de l’élément cliqué.
Dans mon cas, j’ai identifié deux cas particuliers :
- L’URL cliquée est directement disponible dans l’élément DOM cliqué et alimente la variable {{Click URL}}. Version simple.
- L’URL cliquée n’est directement disponible dans l’élément DOM cliqué et donc n’alimente pas la variable {{Click URL}}. Mais l’information est disponible au niveau du parent de l’élément DOM clické. Version complexe.
Pour gérer ces deux cas, je vais créer une variable JavaScript « Click URL enfant parent » qui renverra l’URL au moment du click {{Click URL}} si elle est disponible, sinon elle renverra l’URL contenue dans l’élément parent de l’élément cliqué.
function() {
return ({{Click URL}}) ? {{Click URL}} : {{Click Element}}.parentNode.href;
}Maintenant que je peux tester l’URL de l’élément enfant ou parent cliqué avec mes URL simplifiées, ma variable « social action » est terminée. Il ne me reste plus qu’à dupliquer cette variable pour créer la variable « social name ».
Créer une variable « social name » de type Table Regex pour identifier le nom du réseau social.
À partir de la copie de la variable « social action », changez le nom et réduisez les URL de référence jusqu’au nom de domaine pour identifier les noms des réseaux. Pour les valeurs output correspondantes, vous devriez vous en sortir tout seul.
- facebook\.com
- twitter\.com
- plus\.google\.com
- pinterest\.com
- viadeo\.com
- linkedin\.com
Vous pouvez également utiliser une expression régulière plus complexe pour extraire le nom de domaine du lien cliqué.
^https://.*(twitter|facebook|google|viadeo|linkedin)\.com.+
Pour cela, il faut activer l’option »
Par exemple, « campaign_(facebook)_(noel)_(201712) » $1 = « facebook », $2 = « noel » et $3 = « 201712 », en mode « extraction », je peux utiliser ces $n pour alimenter une valeur output en les concaténant par exemple, $3_$1 (= « 201712_facebook »).
Ou plus simplement mais moins personnalisable, créer une variable « URL » basé le sur le hostname de ma variable « Click URL enfant parent ».
Créer un déclencheur « click social » à partir de la variable « social action ».
Le gros du travail a été fait et créer ce déclencheur relève de la friandise.
Alors, quelle condition utiliser dans notre déclencheur pour activer la balise de l’event Google Analytics au moment d’un clic sur un lien Social ?
[accordions accordion_swatch= »swatch-blanc »]
[accordion title= »Réponse » state= »closed »]
{{social action}} :: match regex :: share|join\-us
[visuel trigger]
[/accordion]
[/accordions]
Configurer une balise event Google Analytics.
Créer une balise Google Analytics de type Event avec les paramètres suivants:
- Category : « social »
- Action : {{social name}}
- Label : {{social action}}
- value : 1
Utilisez notre déclencheur « clic social » et voilà, it’s done!
