Avoir une configuration différente de votre CMP sur mobile et sur desktop peut présenter plusieurs intérêts, principalement liés à l’expérience utilisateur et à la conformité.
Les éléments qui différent d'un device à l'autre (taille de l'écran, navigation, accessibilité, temps de chargement, etc.) nous poussent à vous recommander la création de configurations distinctes par support afin d'améliorer:
- les taux de consentement
- l'ergonomie
- la conformité globale
Voici comment procéder :
Création de la variable personnalisée “Device Type”
Type de variable : Variable JavaScript personnalisée
Nom de la variable : Device Type
Code :
function() {
var width = window.innerWidth;
if (width <= 768) {
return 'mobile';
} else {
return 'desktop';
}
}
Création de deux déclencheurs conditionnels
Créer deux déclencheurs basés sur la variable Device Type :
Déclencheur Mobile
Type : Déclencheur personnalisé (condition)
Condition : Device Type égale mobile
Déclencheur Desktop
Type : Déclencheur personnalisé (condition)
Condition : Device Type égale desktop
Ces déclencheurs serviront ensuite pour différencier les balises CMP selon le device.
Création d’une deuxième configuration CMP
Dupliquer la configuration CMP existante.
Renommer la deuxième configuration (exemple : CMP - Mobile).
Modifier l’affichage du bouton “Continuer sans accepter” :
Sur Desktop : le bouton conserve son emplacement actuel.
Sur Mobile : le bouton doit être repositionné en haut à droite de la CMP (afin d’améliorer la visibilité et l’ergonomie).
Association des déclencheurs aux configurations CMP
Associer le déclencheur Mobile uniquement à la balise CMP - Mobile.
Associer le déclencheur Desktop uniquement à la balise CMP - Desktop.
Ainsi, en fonction du device, la bonne configuration de CMP s’affichera avec la bonne ergonomie.
Contrôler l’affichage CMP :
Desktop → bouton “Continuer sans accepter” au même emplacement.
Mobile → bouton repositionné en haut à droite.
Statistiques Mobile vs Desktop :
Mobile
Desktop
