Configuration d’Adobe Target avec Platform Web SDK

Découvrez comment implémenter Adobe Target à l’aide du SDK web d’Adobe Experience Platform. Découvrez comment diffuser des expériences et comment transmettre des paramètres supplémentaires à Target.

Adobe Target est l’application Adobe Experience Cloud qui fournit tout ce dont vous avez besoin pour personnaliser l’expérience de vos clients afin de maximiser les recettes de vos sites web et mobiles, de vos applications et d’autres canaux numériques.

Objectifs d’apprentissage

À la fin de cette leçon, vous êtes capable d’effectuer les opérations suivantes avec une implémentation de SDK Web de Target :

Conditions préalables

Pour suivre les leçons de cette section, vous devez d’abord :

Ajouter la gestion du scintillement

Avant de commencer, déterminez si une solution supplémentaire de gestion du scintillement est requise en fonction de la manière dont la bibliothèque de balises est chargée.

Implémentation asynchrone

Lorsqu’une bibliothèque de balises se charge de manière asynchrone, le rendu de la page peut être terminé avant que Target ne remplace le contenu par défaut par du contenu personnalisé. Ce comportement peut entraîner un « scintillement », c’est-à-dire que le contenu par défaut s’affiche brièvement avant d’être remplacé par le contenu personnalisé. Pour éviter ce scintillement, Adobe recommande d’ajouter un fragment de code de masquage préalable spécial immédiatement avant le code intégré de balise asynchrone.

Ce fragment de code est déjà présent sur le site Luma, mais regardons de plus près ce qu’il fait :

<script>
  !function(e,a,n,t){var i=e.head;if(i){
  if (a) return;
  var o=e.createElement("style");
  o.id="alloy-prehiding",o.innerText=n,i.appendChild(o),setTimeout(function(){o.parentNode&&o.parentNode.removeChild(o)},t)}}
  (document, document.location.href.indexOf("adobe_authoring_enabled") !== -1, ".personalization-container { opacity: 0 !important }", 3000);
</script>

Le fragment de code de masquage préalable crée une balise de style dans l’en-tête de la page avec la définition CSS de votre choix. Cette balise de style est supprimée lorsqu’une réponse de Target est reçue ou que le délai d’expiration est atteint.

Le comportement de pré-masquage est contrôlé par deux configurations à la toute fin du fragment de code.

Le fragment de code de masquage préalable est également disponible dans les balises :

Implémentation synchrone

Adobe recommande d’implémenter les balises de manière asynchrone, comme illustré sur le site Luma. Cependant, si la bibliothèque de balises est chargée de manière synchrone, le fragment de code de masquage préalable n’est pas nécessaire. Au lieu de cela, le style de pré-masquage est spécifié dans les paramètres de l’extension Platform Web SDK.

Le style de pré-masquage pour les implémentations synchrones peut être configuré comme suit :

Pour en savoir plus sur la manière dont Platform Web SDK peut gérer le scintillement, vous pouvez vous reporter à la section du guide : gestion du scintillement pour les expériences personnalisées.

Configurer le flux de données

Target doit être activé dans la configuration du flux de données pour que les activités Target puissent être diffusées par Platform Web SDK.

Pour configurer Target dans le flux de données :

Jeton de propriété

Les clients Target Premium ont la possibilité de gérer les autorisations utilisateur avec les propriétés. Les propriétés de Target vous permettent d’établir des limites autour desquelles les utilisateurs et utilisatrices peuvent exécuter des activités Target. Reportez-vous à la section Autorisations d’Enterprise de la documentation de Target pour plus d’informations.

Pour configurer ou rechercher des jetons de propriété, accédez à Adobe Target > Administration > Propriétés. L’icône </> affiche le code d’implémentation. La valeur at_property est le jeton de propriété que vous utiliseriez dans votre flux de données.

Un seul jeton de propriété peut être spécifié par flux de données, mais les remplacements de jeton de propriété vous permettent de spécifier des jetons de propriété alternatifs pour remplacer le jeton de propriété principal défini dans le flux de données. Une mise à jour de l’action sendEvent est également nécessaire pour remplacer le flux de données.

Identifiant de l’environnement cible

Environnements dans Target vous aide à gérer la mise en œuvre à toutes les étapes de développement. Ce paramètre facultatif spécifie l’environnement Target que vous allez utiliser avec chaque flux de données.

Adobe recommande de définir l’identifiant d’environnement Target différemment pour chacun de vos flux de données de développement, d’évaluation et de production afin de simplifier le processus. Vous pouvez également organiser vos environnements dans l’interface Target à l’aide de la fonctionnalité hôtes.

Pour configurer ou rechercher des identifiants d’environnement, accédez à Adobe Target > Administration > Environnements.

Espace de noms de l’identifiant tiers cible

Ce paramètre facultatif vous permet de spécifier le symbole d’identité à utiliser pour l’identifiant tiers cible. Target ne prend en charge la synchronisation des profils que sur un seul espace de noms ou symbole d’identité. Pour plus d’informations, reportez-vous à la section Synchronisation des profils en temps réel pour mbox3rdPartyId du guide de Target.

Les symboles d’identité se trouvent dans la liste des identités sous Collecte de données > Client > Identités.

Pour les besoins de ce tutoriel sur l’utilisation du site Luma, utilisez le symbole d’identité lumaCrmId configuré lors de la leçon sur les identités.

Rendu des décisions de personnalisation visuelle

Les décisions de personnalisation visuelle se rapportent aux expériences créées dans le compositeur d’expérience visuelle d’Adobe Target. Tout d’abord, vous devez comprendre la terminologie utilisée dans les interfaces Target et des balises :

Mettez à jour l’action Envoyer l’événement

Les décisions de personnalisation visuelle de Target sont diffusées par Platform Web SDK, si Target est activé dans le flux de données. Toutefois, ils ne sont pas rendus automatiquement. Vous devez mettre à jour l’action Envoyer l’événement pour activer le rendu automatique.

Le paramètre Rendre les décisions de personnalisation visuelle fait que Platform Web SDK applique automatiquement toutes les modifications qui ont été spécifiées à l’aide du compositeur d’expérience visuelle de Target ou de la « mbox globale ».

Si vous préférez effectuer vous-même le rendu ou une action sur ces décisions à l’aide de code personnalisé, vous pouvez laisser le paramètre Rendre les décisions de personnalisation visuelle désactivé. Platform Web SDK est flexible et offre cette fonctionnalité pour vous donner un contrôle total. Vous pouvez consulter le guide pour plus d’informations sur le rendu manuel contenu personnalisé.

Configuration d’une activité Target avec le compositeur d’expérience visuelle

Maintenant que la partie implémentation de base est terminée, créez une activité de ciblage d’expérience (XT) dans Target pour vérifier que tout fonctionne correctement. Si vous avez besoin d’aide, vous pouvez consulter le tutoriel Target pour créer des activités de ciblage d’expérience.

Validation à l’aide du débogueur

Si vous configurez une activité, le contenu doit s’afficher sur la page. Cependant, même si aucune activité n’est active, vous pouvez également consulter l’appel réseau d’envoi d’événement pour confirmer que Target est correctement configuré.

Configurer et générer une portée de décision personnalisée

Les portées de décision personnalisées (anciennement appelées « mbox ») peuvent être utilisées pour diffuser du contenu HTML ou JSON de manière structurée à l’aide du compositeur d’expérience basé sur les formulaires Target. Le contenu diffusé à l’une de ces étendues personnalisées n’est pas rendu automatiquement par le SDK web de Platform. Il peut être rendu à l’aide d’une action dans les balises.

Ajoutez une portée à l’action Envoyer l’événement

Modifiez la règle de chargement de page pour ajouter une portée de décision personnalisée :

Traiter la réponse de Target

Maintenant que vous avez configuré Platform Web SDK pour demander du contenu pour la portée homepage-hero, vous devez utiliser la réponse. L’extension de balise SDK Web Platform fournit un événement Envoi d’événement terminé qui peut être utilisé pour déclencher immédiatement une nouvelle règle lorsqu’une réponse d’une action Envoi d’événement est reçue.

Configurer une activité Target avec le compositeur d’expérience d’après les formulaires

Maintenant que vous disposez d’une règle permettant de générer manuellement une portée de décision personnalisée, vous pouvez créer une autre activité de ciblage d’expérience (XT) dans Target. Utilisez cette fois le compositeur d’expérience d’après les formulaires.

Validation à l’aide du débogueur

Si vous avez activé votre activité, votre contenu doit s’afficher sur la page. Cependant, même si aucune activité n’est active, vous pouvez également consulter l’appel réseau Envoyer l’événement pour confirmer que Target demande du contenu pour vos portées personnalisées.

Envoyer les paramètres à Target

Dans cette section, vous allez transmettre des données spécifiques à Target et examiner de plus près la manière dont les données XDM sont mappées aux paramètres Target.

Paramètres de page (mbox) et XDM

Tous les champs XDM sont automatiquement transmis à Target en tant que paramètres de page ou mbox.

Certains de ces champs XDM sont mappés à des objets spéciaux dans le serveur principal de Target. Par exemple, web.webPageDetails.URL sera automatiquement disponible pour créer des conditions de ciblage basées sur des URL ou comme objet de page.url lors de la création de scripts de profil.

Vous pouvez également ajouter des paramètres de page à l’aide de l’objet de données.

Paramètres spéciaux et objet de données

Certains points de données pouvant être utiles à Target ne sont pas mappés à partir de l’objet XDM. Ces paramètres spécifiques à Target sont les suivants :

Ces paramètres doivent être envoyés dans l’objet data et non dans l’objet xdm. En outre, les paramètres de page (ou mbox) peuvent également être inclus dans l’objet data.

Pour renseigner l’objet de données, créez l’élément de données suivant, en réutilisant les éléments de données créés dans la leçon Création d’éléments de données :

Mettre à jour la règle de chargement de page

La transmission de données supplémentaires pour Target en dehors de l’objet XDM nécessite la mise à jour des règles applicables. Pour cet exemple, la seule modification que vous devez apporter est d’inclure le nouvel élément de données data.content dans la règle de chargement de page générique et la règle d’affichage de page de produit.

Division des requêtes Personalization et Analytics

La couche de données sur le site Luma est entièrement définie avant le code d’intégration des balises. Cela nous permet d’utiliser un seul appel pour récupérer du contenu personnalisé (à partir d’Adobe Target, par exemple) et envoyer des données d’analyse (à Adobe Analytics, par exemple).

Sur de nombreux sites web, cependant, la couche de données ne peut pas être chargée suffisamment tôt ou assez rapidement pour utiliser un seul appel pour les deux applications. Dans ces situations, vous pouvez utiliser deux actions Envoyer l’événement sur un seul chargement de page et utiliser la première pour la personnalisation et la seconde pour les analyses. Le fait de diviser les événements de cette manière permet à l’événement de personnalisation de se déclencher le plus tôt possible, tout en attendant que la couche de données se charge complètement avant d’envoyer l’événement Analytics. Ceci est similaire à de nombreuses implémentations de SDK antérieures au Web, où Adobe Target déclenchait l’target-global-mbox en haut de la page et Adobe Analytics déclenchait l’appel s.t() au bas de la page

Pour créer la requête de personnalisation sur le dessus, procédez comme suit :

Pour créer la requête Analytics-on-bottom :

Validation à l’aide du débogueur

Maintenant que les règles sont mises à jour, vous pouvez vérifier si les données sont correctement transmises à l’aide d’Adobe Debugger.

Validation dans l’interface de Target

Ensuite, vérifiez dans l’interface de Target que les données ont été reçues et qu’elles sont disponibles pour les audiences et les activités. Les données XDM sont automatiquement mappées aux paramètres Target personnalisés. Vous pouvez vérifier que les données XDM ont été reçues par Target et sont disponibles en créant une audience.

Vérifiez ensuite que l’attribut de profil de l’état de connexion a bien été transmis.

Si vous disposez de Target Premium, vous pouvez également vérifier que les données d’entité ont été correctement transmises et que les données de produit ont été écrites dans le catalogue de produits Recommendations.

Valider avec Assurance

En outre, vous pouvez utiliser Assurance le cas échéant pour confirmer que les requêtes de prise de décision Target obtiennent les données correctes et que toutes les transformations côté serveur se produisent correctement. Vous pouvez également confirmer que les informations de campagne et d’expérience sont contenues dans les appels Adobe Analytics, même lorsque la prise de décision Target et les appels Adobe Analytics sont envoyés séparément.

Cela confirme que les informations A4T qui étaient placées en file d’attente pour une transmission ultérieure lorsque nous avons effectué l’appel de prise de décision cible ont été correctement envoyées lorsque l’appel de suivi Analytics s’est déclenché ultérieurement sur la page.

Maintenant que vous avez terminé cette leçon, vous devriez disposer d’une implémentation fonctionnelle d’Adobe Target à l’aide de Platform Web SDK.

Suivant :