Executer un script GTM uniquement sur mobile ou desktop

Exécuter un script GTM uniquement sur mobile ou desktop

Il peut arriver que vous souhaitiez charger un pixel ou exécuter un script sur desktop uniquement. Ce guide vous montrera comment le faire en utilisant Google Tag Manager.

Par défaut, Google Tag Manager ne vous permet pas d’utiliser le type d’appareil comme variable. Nous allons utiliser une solution de contournement en créant une variable JavaScript personnalisée qui exécute un script en fonction de la résolution de l’écran qui affiche la page.

Étape 1 : Créer une nouvelle variable

Connectez-vous à Google Tag Manager et cliquez sur Variables dans le menu de droite.

select variables from the menu on the left

Sous Variables définies par l’utilisateur, cliquez sur le bouton bleu Nouveau.

under user-defined variables click the blue new button on the right

Passez la souris sur la boîte de configuration des variables et cliquez sur l’icône du crayon qui apparaît en haut à droite.

hover and click pencil icon

Sélectionnez JavaScript personnalisé dans le menu.

select custom javascript from the menu on the right

Coller le code suivant dans la boite de JS personnalisé :

function()
{
/// the minimum width for each device we're able to detect, from big to small
var deviceMinWidths = {
'desktop': 769,
'tablet': 321,
'mobile': 0       
}

/// find the device type
for(var device in deviceMinWidths)
{
if(window.screen.width >= deviceMinWidths[device])
{
return device;
}
}   
}

ATTENTION :  Cette fonction utilise JavaScript pour obtenir la largeur actuelle de votre navigateur (en pixels) et la traduire en une chaîne de texte facile à lire. Si vous souhaitez appliquer cette fonction à votre propre site Web, veillez à indiquer les points d’arrêt réactifs utilisés par votre site. Par exemple, bien que nous utilisions 520 pixels ou moins pour signifier “mobile”, votre site Web peut s’arrêter pour le mobile à 450px, 600px, ou n’importe quoi entre les deux.

pasted code

Nommer cette variable Screen Resolution et cliquer sur le bouton Enregistrer en haut à droite

click save

Étape 2 : Créer un nouveau Déclencheur

Cliquer sur Déclencheur, dans le menu de gauche

select triggers from the menu on the left

Puis cliquer sur le bouton NOUVEAU en haut à droite.

Ensuite, cliquez sur l’icône du crayon lorsque vous survolez la boite de configuration du déclencheur. Ensuite, sélectionnez Page Vue.

click pencil icon

select page view

Cliquer sur Certaines Pages Vues , puis configurer la condition comme suit : Screen Resolution contient desktop.

screen resolution contains desktop

Nommer votre déclencheur Desktop Only. 

desktop only

Étape 3 : ajouter le déclencheur à la balise souhaitée

Cliquer sur Balise dans le menu de gauche

click tags from the menu on  the left

Cliquer sur le nom de la balise que vous souhaitez lancer uniquement sur Desktop (par exemple ici, Hotjar) :

Une fois dans la fenêtre d’édition des balises, dans la partie basse Déclenchement, cliquer sur le crayon :

click the pencil icon under triggering

Cliquer sur l’icone + .

plus button

Choisissez dans la liste Desktop Only créé précédemment

desktop only trigger

Sauver la balise :

save on the right

Étape 4 : Envoyer et Publier

Cliquer sur le bouton Envoyer en haut à droite de l’interface GTM.

submit in top right

Donner un nom et une description à votre push.

Appuyer sur PUBLIER.

click publish in the top right

 

 

 

Laisser un commentaire