DocumentationExperience PlatformTutoriel du SDK web

Création de règles de balise

Last update: Sat Jun 01 2024 00:00:00 GMT+0000 (Coordinated Universal Time)

Créé pour :

  • Débutant
  • Intermédiaire
  • Développeur

Découvrez comment envoyer des événements à l’Edge Network Adobe Experience Platform avec votre objet XDM à l’aide de règles de balise. Une règle de balise est une combinaison d’événements, de conditions et d’actions qui indique à la propriété de balise de faire quelque chose. Avec le SDK Web Platform, les règles sont utilisées pour envoyer des événements à l’Edge Network Platform avec les données appropriées.

Objectifs d'apprentissage

À la fin de cette leçon, vous pouvez :

  • Utilisation d’une convention d’affectation de nom pour la gestion des règles dans les balises
  • Envoi d’un événement avec des champs XDM à l’aide des actions Mettre à jour la variable et Envoyer un événement
  • Empiler plusieurs jeux de champs XDM dans plusieurs règles
  • Mappage d’éléments de données de tableau individuels ou entiers à l’objet XDM
  • Publier une règle de balise dans une bibliothèque de développement

Conditions préalables

Vous connaissez bien les balises de collecte de données et la variable Site de démonstration Luma et avoir terminé les leçons précédentes du tutoriel :

Conventions de dénomination

Pour gérer les règles dans les balises, il est recommandé de respecter une convention d’affectation de nom standard. Ce tutoriel utilise une convention de dénomination en cinq parties :

  • [location] - [event] - [objectif] - [order]

où ;

  1. location est la ou les pages du site sur lesquelles la règle se déclenche.
  2. event est le déclencheur de la règle.
  3. objectif est l’action principale effectuée par la règle.
  4. order est l’ordre dans lequel la règle doit se déclencher par rapport aux autres règles.

Création de règles de balise

Dans les balises, les règles sont utilisées pour exécuter des actions (appels de déclenchement) sous diverses conditions. L’extension de balises SDK Web Platform comprend deux actions utilisées dans cette leçon :

  • Mettre à jour la variable mappe des éléments de données aux propriétés dans un objet XDM.
  • Envoyer un événement envoie l’objet XDM à l’Edge Network Experience Platform ;

Dans le reste de cette leçon, nous :

  1. Créez une règle avec la variable Mettre à jour la variable pour définir une "configuration globale" des champs XDM.

  2. Créez des règles supplémentaires avec la fonction Mettre à jour la variable action qui remplace notre "configuration globale" et qui contribue à des champs XDM supplémentaires sous certaines conditions (par exemple, l’ajout de détails de produit sur les pages de produit).

  3. Créez une autre règle avec la variable Envoyer un événement , qui enverra l’objet XDM complet à Adobe Experience Platform Edge Network.

Toutes ces règles seront séquencées correctement à l’aide de la variable "order".

Cette vidéo donne un aperçu du processus :

https://video.tv.adobe.com/v/3427710/?learn=on

Champs de configuration globaux

Pour créer une règle de balise pour les champs XDM globaux :

  1. Ouvrez la propriété de balise que vous utilisez pour ce tutoriel.

  2. Accédez à Règles dans la navigation de gauche

  3. Sélectionnez la variable Créer une règle button

    Création d’une règle

  4. Donnez à la règle le nom all pages - library loaded - set global variables - 1.

  5. Dans le Événements , sélectionnez Ajouter

    Attribuez un nom à la règle et ajoutez un événement

  6. Utilisez la variable Extension Core et sélectionnez Bibliothèque chargée (Haut de page) comme la propriété Type d’événement

  7. Sélectionner Avancé menu déroulant et entrée 1 comme la propriété Commande

    note note
    NOTE
    Plus le numéro de commande est bas, plus tôt il s’exécute. Par conséquent, nous donnons à notre "configuration globale" un numéro de commande faible.

  8. Sélectionner Conserver les modifications pour revenir à l’écran de la règle principale
    Sélectionner le déclencheur chargé de bibliothèque

  9. Dans le Actions , sélectionnez Ajouter

  10. Comme la variable Extension, sélectionnez SDK Web Adobe Experience Platform

  11. Comme la variable Type d’action, sélectionnez Mettre à jour la variable

  12. Comme la variable Élément de données, sélectionnez la variable xdm.variable.content que vous avez créé dans la variable Création d’éléments de données leçon

    Mettre à jour le schéma de variable

Maintenant, faites correspondre votre éléments de données à la fonction schema utilisé par votre objet XDM. Vous pouvez mapper des propriétés individuelles ou des objets entiers. Dans cet exemple, vous mappez les propriétés individuelles :

  1. Recherchez le champ eventType et sélectionnez-le

  2. Saisissez la valeur web.webpagedetails.pageViews

    note tip
    TIP
    Pour comprendre les valeurs à renseigner dans la variable eventType , vous devez accéder à la page de schéma et sélectionner la variable eventType pour afficher les valeurs suggérées sur le rail de droite. Vous pouvez également saisir une nouvelle valeur, si nécessaire.
    eventType valeurs suggérées sur la page schémas

  3. Recherchez ensuite le identityMap dans le schéma et sélectionnez-le.

  4. Associer à la variable identityMap.loginID élément de données

    Mise à jour du mappage d’identité de variable

    note tip
    TIP
    Les champs XDM ne seront pas inclus dans la requête réseau si l’élément de données est nul. Par conséquent, lorsque l’utilisateur n’est pas authentifié et que la variable identityMap.loginID l’élément de données est nul, la variable identityMap ne sera pas envoyé. C'est pourquoi nous pouvons le définir dans notre "configuration globale".

  5. Faites défiler l’écran vers le bas jusqu’à ce que vous atteigniez le web objet

  6. Sélectionner pour l’ouvrir

  7. Mappez les éléments de données suivants aux web Variables XDM

    • web.webPageDetials.name to %page.pageInfo.pageName%
    • web.webPageDetials.server to %page.pageInfo.server%
    • web.webPageDetials.siteSection to %page.pageInfo.hierarchie1%

  8. Définissez web.webPageDetials.pageViews.value sur 1.

    Mettre à jour le contenu des variables

    note tip
    TIP
    Tant que eventType défini sur web.webpagedetails.pageViews nor web.webPageDetails.pageViews.value Si Adobe Analytics doit traiter une balise en tant que page vue, il est utile d’avoir une méthode standard pour indiquer une page vue pour d’autres applications en aval.

  9. Sélectionner Conserver les modifications puis Enregistrer la règle dans l’écran suivant pour terminer la création de la règle

Champs de page de produit

Maintenant, commencez à utiliser Mettre à jour la variable dans d’autres règles séquencées pour enrichir l’objet XDM avant de l’envoyer à Edge Network de plateforme.

TIP
L’ordre des règles détermine la règle qui s’exécute en premier lorsqu’un événement est déclenché. Si deux règles possèdent le même type d’événement, celle dont le nombre est le plus faible s’exécute en premier.

Commencez par effectuer le suivi des consultations de produit sur la page des détails du produit de Luma :

  1. Sélectionner Ajouter une règle

  2. Nommez-le ecommerce - library loaded - set product details variables - 20

  3. Sélectionnez la variable + symbole Sous Événement pour ajouter un nouveau déclencheur

  4. Sous Extension, sélectionnez Core

  5. Sous Type d’événement, sélectionnez Bibliothèque chargée (Haut de page)

  6. Sélectionner pour ouvrir Options avancées, saisissez 20. Cette valeur de commande garantit l’exécution de la règle. after la valeur all pages - library loaded - set global variables - 1 qui définit la configuration globale.

  7. Sélectionner Conserver les modifications

    Règles XDM Analytics

  8. Sous Conditions, sélectionnez sur Ajouter

  9. Laisser Type de logique as Normal

  10. Laisser Extension as Core

  11. Sélectionner Type de condition as Chemin sans chaîne de requête

  12. Sur la droite, activez l’option Regex basculer

  13. Sous path est égal à set /products/. Pour le site de démonstration Luma, la règle se déclenche uniquement sur les pages de produits.

  14. Sélectionner Conserver les modifications

    Règles XDM Analytics

  15. Sous Actions select Ajouter

  16. Sélectionner SDK Web Adobe Experience Platform extension

  17. Sélectionner Type d’action as Mettre à jour la variable

  18. Sélectionner xdm.variable.content comme la propriété Élément de données

  19. Faites défiler l’écran vers le bas jusqu’à commerce objet

  20. Ouvrez le productViews objet et définition value to 1

    Configuration de la vue de produit

    note tip
    TIP
    La définition de commerce.productViews.value=1 dans XDM correspond automatiquement à la variable prodView dans Analytics

  21. Faites défiler jusqu’à eventType et définissez-le sur commerce.productViews

    note note
    NOTE
    Cette règle ayant un ordre plus élevé, elle remplace la variable eventType défini dans la règle "configuration globale". eventType ne peut contenir qu’une seule valeur et nous vous recommandons de la définir avec l’événement le plus précieux.

  22. Faites défiler l’écran jusqu’à et sélectionnez productListItems tableau

  23. Sélectionner Fournir des éléments individuels

  24. Sélectionner Ajouter un élément

    Définition de l’événement d’affichage de produit

    note caution
    CAUTION
    La variable productListItems est un array type de données afin qu’il s’attende à ce que les données entrent dans une collection d’éléments. En raison de la structure de couche de données du site de démonstration Luma et parce qu’il est possible d’afficher un seul produit à la fois sur le site Luma, vous ajoutez des éléments individuellement. Lors de l’implémentation sur votre propre site web, en fonction de la structure de votre couche de données, vous pouvez fournir un tableau entier.

  25. Sélectionner pour ouvrir Élément 1

  26. Carte productListItems.item1.SKU to %product.productInfo.sku%

    Variable d’objet XDM SKU du produit

  27. Sélectionner Conserver les modifications

  28. Sélectionner Enregistrer pour enregistrer la règle

Champs du panier

Vous pouvez mapper un tableau entier à un objet XDM, à condition que le tableau corresponde au format du schéma XDM. L’élément de données de code personnalisé cart.productInfo vous avez créé des boucles précédentes à l’aide de la fonction digitalData.cart.cartEntries objet de couche de données sur Luma et le convertit au format requis de l’objet productListItems du schéma XDM.

Pour illustrer cela, reportez-vous à la comparaison ci-dessous de la couche de données du site Luma (à gauche) avec l’élément de données traduit (à droite) :

Format de tableau d’objet XDM

Comparez l’élément de données à la variable productListItems structure (indice, il doit correspondre).

IMPORTANT
Notez comment les variables numériques sont traduites, avec des valeurs de chaîne dans la couche de données, telles que price et qty reformaté en nombres dans l’élément de données. Ces exigences de format sont importantes pour l’intégrité des données dans Platform et sont déterminées lors de la configuration des schémas étape . Dans l’exemple : quantity utilise la variable Entier type de données.
Type de données de schéma XDM

Mappons maintenant notre tableau à l’objet XDM :

  1. Créez une règle nommée ecommerce - library loaded - set shopping cart variables - 20

  2. Sélectionnez la variable + symbole Sous Événement pour ajouter un nouveau déclencheur

  3. Sous Extension, sélectionnez Core

  4. Sous Type d’événement, sélectionnez Bibliothèque chargée (Haut de page)

  5. Sélectionner pour ouvrir Options avancées, saisissez 20

  6. Sélectionner Conserver les modifications

    Règles XDM Analytics

  7. Sous Conditions, sélectionnez sur Ajouter

  8. Laisser Type de logique as Normal

  9. Laisser Extensions as Core

  10. Sélectionner Type de condition as Chemin sans chaîne de requête

  11. À droite, ne pas activez la variable Regex basculer

  12. Sous path est égal à set /content/luma/us/en/user/cart.html. Pour le site de démonstration Luma, la règle se déclenche uniquement sur la page de panier.

  13. Sélectionner Conserver les modifications

    Règles XDM Analytics

  14. Sous Actions select Ajouter

  15. Sélectionner SDK Web Adobe Experience Platform extension

  16. Sélectionner Type d’action as Mettre à jour la variable

  17. Sélectionner xdm.variable.content comme la propriété Élément de données

  18. Faites défiler l’écran vers le bas jusqu’à commerce et sélectionnez pour l’ouvrir.

  19. Ouvrez le productListViews objet et définition value to 1

    Configuration de la vue de produit

    note tip
    TIP
    La définition de commerce.productListViews.value=1 dans XDM correspond automatiquement à la variable scView dans Analytics

  20. Sélectionner eventType et définissez sur commerce.productListViews

  21. Faites défiler l’écran jusqu’à et sélectionnez productListItems tableau

  22. Sélectionner Fournir un tableau entier

  23. Associer à cart.productInfo élément de données

  24. Sélectionner Conserver les modifications

  25. Sélectionner Enregistrer pour enregistrer la règle

Créez deux autres règles pour le passage en caisse et l’achat suivant le même modèle avec les différences suivantes :

Nom de la règle: ecommerce - library loaded - set checkout variables - 20

  1. Condition: /content/luma/us/en/user/checkout.html

  2. Définissez eventType sur commerce.checkouts.

  3. Définissez commerce.checkout.value sur 1.

    note tip
    TIP
    Cela équivaut à définir scCheckout dans Analytics

Nom de la règle: ecommerce - library loaded - set purchase variables - 20

  1. Condition: /content/luma/us/en/user/checkout/order/thank-you.html

  2. Définissez eventType sur commerce.purchases.

  3. Définissez commerce.purchases.value sur 1.

    note tip
    TIP
    Cela équivaut à définir purchase dans Analytics

  4. Définir commerce.order.purchaseID à la fonction cart.orderId élément de données

  5. Définir commerce.order.currencyCode à la valeur codée en dur USD

    Définition de purchaseID pour Analytics

    note tip
    TIP
    Cela équivaut à définir s.purchaseID et s.currencyCode dans Analytics

  6. Faites défiler l’écran jusqu’à et sélectionnez productListItems tableau

  7. Sélectionner Fournir un tableau entier

  8. Associer à cart.productInfo.purchase élément de données

  9. Sélectionner Conserver les modifications

  10. Sélectionner Enregistrer

Lorsque vous avez terminé, les règles suivantes doivent être créées.

Règles XDM Analytics

Envoyer la règle d’événement

Maintenant que vous avez défini les variables, vous pouvez créer la règle pour envoyer l’objet XDM complet à l’Edge Network Platform avec le Envoyer un événement action.

  1. À droite, sélectionnez Ajouter une règle pour créer une autre règle

  2. Donnez à la règle le nom all pages - library loaded - send event - 50.

  3. Dans le Événements , sélectionnez Ajouter

  4. Utilisez la variable Extension Core et sélectionnez Library Loaded (Page Top) comme la propriété Type d’événement

  5. Sélectionner Avancé menu déroulant et entrée 50 in Commande. Cette règle se déclenche après toutes les autres règles que vous avez configurées (qui avaient 1 ou 20 comme Commande).

  6. Sélectionner Conserver les modifications pour revenir à l’écran de la règle principale
    Sélectionner le déclencheur chargé de bibliothèque

  7. Dans le Actions , sélectionnez Ajouter

  8. Comme la variable Extension, sélectionnez SDK Web Adobe Experience Platform

  9. Comme la variable Type d’action, sélectionnez Envoyer un événement

  10. Comme la variable XDM, sélectionnez la variable xdm.variable.content élément de données créé dans la leçon précédente

  11. Sélectionner Conserver les modifications pour revenir à l’écran de la règle principale

    Ajout de l’action Envoyer l’événement

  12. Sélectionner Enregistrer pour enregistrer la règle

    Enregistrer la règle

Publication des règles dans une bibliothèque

Ensuite, publiez la règle dans votre environnement de développement afin que vous puissiez vérifier qu’elle fonctionne.

Pour créer une bibliothèque :

  1. Accédez à Flux de publication dans la navigation de gauche

  2. Sélectionner Ajouter une bibliothèque

    Sélectionner Ajouter une bibliothèque

  3. Pour le Nom, saisissez Luma Web SDK Tutorial

  4. Pour le Environnement, sélectionnez Development

  5. Sélectionner Ajouter toutes les ressources modifiées

    note note
    NOTE
    Vous devriez voir tous les composants de balise créés dans les leçons précédentes. L’extension Core contient le code JavaScript de base requis par toutes les propriétés de balise Web.

  6. Sélectionner Enregistrement et création pour le développement

    Création et création de la bibliothèque

La création de la bibliothèque peut prendre quelques minutes. Une fois l’opération terminée, un point vert s’affiche à gauche du nom de la bibliothèque :

Build complete

Comme vous pouvez le voir sur la Flux de publication le processus de publication, qui dépasse le cadre de ce tutoriel, comporte beaucoup d’autres éléments. Ce tutoriel utilise une seule bibliothèque dans votre environnement de développement.

Vous êtes maintenant prêt à valider les données de la requête à l’aide de l’Adobe Experience Platform Debugger .

Suivant

NOTE
Merci d’avoir consacré du temps à l’apprentissage du SDK Web Adobe Experience Platform. Si vous avez des questions, souhaitez partager des commentaires généraux ou avez des suggestions sur le contenu futur, partagez-les à ce sujet. Article de discussion de la communauté Experience League
recommendation-more-help
8cbc0fd8-ca1d-433b-9c3d-bc3f113347d4