Évaluateurs

Un évaluateur est un code JavaScript personnalisé qui s’exécute sur la page et renvoie une valeur basée sur les données qui existent sur la page. Vous pouvez créer des évaluateurs à utiliser pour : 

• des conditions de ciblage personnalisées : par exemple, si l’âge d’un utilisateur figure dans votre couche de données, un évaluateur peut renvoyer cette information afin que vous puissiez cibler les expériences en fonction de l’âge de l’utilisateur.
• Valeurs variables dans les modèles : par exemple, si le nom d’un utilisateur figure sur la page, un évaluateur peut renvoyer le nom et l’utiliser dans un modèle. Cela vous permet de rendre le nom dans une variation et de créer une expérience utilisateur plus personnalisée. 
• Valeurs en temps réel dans les règles de filtrage personnalisées : par exemple, un évaluateur peut renvoyer la différence entre la valeur actuelle du panier et le seuil de livraison gratuite, et demander des produits dont le prix est supérieur à la valeur de l’évaluateur. 

Le code n’est exécuté que lorsqu’une expérience utilisant l’évaluateur est chargée sur une page. En général, cela se produit pendant le chargement de la page, à moins qu’un délai d’action ne soit appliqué à l’aide de déclencheurs. Les évaluateurs ont un délai d’attente de 4 secondes et renvoient la valeur false si le délai d’attente est atteint avant qu’un résultat ne soit renvoyé.

Création d’un évaluateur pour les sites web 

1. Rendez-vous dans Assets › Evaluators, puis cliquez sur Add New (Ajouter un nouveau).
   
2. Saisissez un nom et des notes (facultatif).
3. Définissez le type de valeur et les valeurs attendues. Celles-ci affecteront la manière dont les conditions construites sur l’évaluateur se comporteront : 
   • Value type (type de valeur) : spécifiez String ou Number. Si vous sélectionnez Number, les conditions de ciblage vous permettront de spécifier des valeurs supérieures ou inférieures. Si vous sélectionnez String, vous ne pourrez cibler que les valeurs qui contiennent la chaîne. 
   • Expected values (valeurs attendues, facultatif) : cette option limite les valeurs disponibles lorsque l’évaluateur est utilisé comme condition de ciblage. Les valeurs spécifiées sont ajoutées dans un menu déroulant. Par exemple, si votre évaluateur vérifie si l’utilisateur est connecté ou non, vous pouvez définir les valeurs attendues sur True ou False.
4. Utilisez l’aperçu pour voir comment la condition de ciblage se présentera et se comportera.
5. Cliquez sur Next et écrivez votre code JavaScript dans l’éditeur. Pour plus d’informations, reportez-vous à la section Writing Evaluator Code (écrire le code de l’évaluateur).
6. Cliquez sur Save (sauvegarder). Il faut jusqu’à 5 minutes pour que la création, la modification ou la suppression d’évaluateurs prenne effet.

Écrire du code d’évaluation

Le code évaluateur est un code JavaScript qui renvoie une valeur. Il peut s’agir d’un simple code qui récupère un texte à partir d’un élément de la page, ou d’un code qui prend n’importe quel élément de la page, le manipule et renvoie un résultat.

Il existe deux types d’évaluateurs :

• L’évaluateur ordinaire : il s’exécute immédiatement sur la page ; il est utilisé lorsqu’il n’y a rien d’asynchrone dans le processus d’obtention d’un résultat.
• Évaluateur asynchrone : il dépend d’un autre processus qui doit être exécuté sur la page pour fournir un résultat, tel qu’un élément DOM qui apparaît après le chargement de la page.

Pour éviter les cas où un évaluateur ne renvoie pas de valeur ou renvoie une valeur nulle parce qu’un élément n’existe pas encore sur la page, nous recommandons d’utiliser une promesse JavaScript. Cela garantit que l’évaluation des conditions de ciblage attend que l’évaluateur renvoie une valeur correcte. Dynamic Yield vous permet de le faire avec notre propre version de la bibliothèque q dans l’objet DYO (DYO.Q).

Exemples de code de l’évaluateur

DYO.Q(DYO.waitForElementAsync("", 1, 10, 100)).then(function(elements) {
  return parseInt(elements[0].textContent);
});

DYO.Q(DYO.waitForElementAsync("",1, 10, 100))
  .then(function() {
  return "True";  
  }
);

DYO.Q(DYO.waitForElementAsync("",1, 10, 100))
  .then(function(elements) {
  return parseFloat(elements[0].textContent.replace(/[^0-9\.]+/g,""));
  }, function() {
  return 0;
  });

//le nombre maximum de tentatives et la durée de l'intervalle peuvent être modifiés. Assurez-vous que vous accédez à la bonne position dans la couche de données. Dans cet exemple, il s'agit du premier index du tableau.
var MAX_RETRIES = 5;
var FALLBACK_VALUE = 0;
var INETRVAL_IN_MS = 100;

DYO.Q.Promise(function(resolve) {
  var retryCounter = 0;
  var interval = setInterval(function() {
  if (typeof dataLayer === 'object' && typeof dataLayer[0] === 'object') {
  clearInterval(interval);
  resolve(parseFloat(dataLayer[0].cartValue) || FALLBACK_VALUE);
  } else {
  retryCounter++;
  }

  if (retryCounter > MAX_RETRIES) {
  resolve(FALLBACK_VALUE);
  clearInterval(interval);
  }
  }, INETRVAL_IN_MS);
});

try {
  (function() {
  var STRATEGY_ID_TO_CHECK = ;
  var MAX_PRODUCTS_TO_CHECK = ;
  if (!DYO.Q || !DYO.recommendationWidgetData) {
  return;
  }
  var deferred = DYO.Q.defer();
  DY.API('callback', function() {
  DYO.recommendationWidgetData(STRATEGY_ID_TO_CHECK, {maxProducts: MAX_PRODUCTS_TO_CHECK}, function(err, data) {
  if (data && data.slots && data.slots.length) {
  deferred.resolve(data.slots.length);
  } else {
  deferred.resolve(-1);
  }
  });
  });
  return deferred.promise;
  })();
} catch (e) {}

const THRESHOLD = 50; // Seuil du panier 
const CART_TOTAL_SELECTOR = '.js-cart-totals__total' // Sélecteur de panier par site

DYO.waitForElementAsync(CART_TOTAL_SELECTOR).then((elements) => {
  const cartValue = parseFloat(elements[0].textContent.replace(/[^\d.-]/g, ''));

  return Math.max(THRESHOLD - cartValue, 0);
});

const DEFAULT_VALUE = '';
const CSS_SELECTOR = '';

DYO.Q(DYO.waitForElementAsync(CSS_SELECTOR, 1, 100, 10))
  .then(function(elements) {
  var el = elements[0];

  return el.textContent;
  }, function() {
  return DEFAULT_VALUE;
  });

var DEFAULT_VALUE = 'Unisex';

var CSS_SELECTOR = '.customer-gender';

DYO.Q(DYO.waitForElementAsync(CSS_SELECTOR, 1, 100, 5))
  .then(function(elements) {
  var el = elements[0];

  return el.textContent;
  }, function() {
  return DEFAULT_VALUE;
  });

Rédaction d’évaluateurs pour les variables de modèle

Pour afficher la valeur de l’évaluateur à l’intérieur d’une variation (par opposition à son utilisation pour une condition de ciblage), l’évaluateur ne peut pas être asynchrone, et l’utilisation de la bibliothèque q et d’une promesse n’est pas prise en charge. Sa valeur doit être renvoyée immédiatement après le rendu de la variation. Par exemple, un évaluateur qui renvoie la langue de la page :

try{
  (function(){
  if (DY.recommendationContext && DY.recommendationContext.lng){
  return DY.recommendationContext.lng;
  }else{return 'NA';}
  })();
} catch(e) {}

Débogage des évaluateurs

Exécutez l’API suivante dans la console du navigateur pour vérifier la valeur renvoyée par un évaluateur. Remplacez « EVALUATOR_ID » par l’ID de l’évaluateur que vous déboguez (rendez-vous dans Assets › Evaluators pour voir les ID de tous vos évaluateurs).

DYO.Q(DYO.CoreUtils.safeEval(DYO.oevals[EVALUATOR_ID].code))
  .then(function(result) {
    console.log("Returned value from evaluator:", result);
  });

Ciblage basé sur les valeurs de l’évaluateur

Dès qu’un évaluateur est créé, il apparaît sous la condition Custom Evaluator (évaluateur personnalisé), dans la catégorie Where? (où ?). Une liste de tous les évaluateurs est disponible lors de la création de la condition. Selon le type de valeur défini pour l’évaluateur, vous pouvez sélectionner l’opérateur et les valeurs dans la condition. En savoir plus sur le ciblage des conditions.

Rendre la valeur de l’évaluateur dans un modèle

Il est parfois utile de rendre une valeur d’évaluateur dans un modèle. Par exemple, si le prénom de l’utilisateur existe sur la page et que vous souhaitez afficher un message personnel avec le prénom de l’utilisateur. Vous pouvez le faire en changeant le type de variable en Evaluator (évaluateur).

La variable est alors remplacée par la valeur de l’évaluateur. Vous pouvez également définir un texte de remplacement, au cas où l’évaluateur ne renverrait aucune donnée.

Notez que pour qu’une valeur d’évaluateur s’affiche dans un modèle, l’évaluateur ne peut pas s’exécuter de manière asynchrone. Consultez l’exemple de code plus haut dans cet article.

Consultez Création de modèles pour en savoir plus sur les variables et les modèles.

Filtrage des recommandations en fonction des valeurs des évaluateurs

Vous pouvez utiliser des évaluateurs comme valeurs de règle dans les filtres personnalisés de la stratégie pour obtenir des recommandations de produits basées sur des données dynamiques. Par exemple, vous pouvez définir un évaluateur pour demander des produits recommandés qui correspondent aux informations sur un utilisateur disponibles dans la session, telles que le sexe ou la position géographique.

Pour utiliser un évaluateur, sélectionnez Use real-time value (utiliser une valeur en temps réel) dans les paramètres de la règle. Tous les évaluateurs pertinents s’affichent dans un menu déroulant.

Pour plus d’informations sur les règles de stratégie, consultez Recommandation de règles de filtrage personnalisées.

Copie d’évaluateurs entre sites

Vous pouvez copier n’importe quel évaluateur sur un autre site du même compte Dynamic Yield. Survolez l’évaluateur, cliquez sur le bouton Copy et sélectionnez la destination.

Affichage des expériences affectées par chaque évaluateur

Dans la liste des évaluateurs, vous pouvez voir combien d’expériences et de stratégies utilisent chaque évaluateur comme condition de ciblage ou règle de filtrage personnalisée dans la colonne Used by (utilisé par). Cliquez sur le nombre pour effectuer une analyse descendante et voir chaque expérience ou stratégie qui utilise l’évaluateur. Il est important de vérifier ce point avant de modifier ou de supprimer un évaluateur, afin de s’assurer que vous êtes conscient de la façon dont la modification affectera votre site.