DocumentationExperience PlatformTutoriel du SDK web

Création de règles de balises

Last update: Mon May 05 2025 00:00:00 GMT+0000 (Coordinated Universal Time)
  • Rubriques :

Créé pour :

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

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

Objectifs d’apprentissage

À la fin de cette leçon, vous êtes capable de :

  • Utiliser une convention de nommage pour la gestion des règles dans les balises
  • Envoyer un événement avec des champs XDM à l’aide des actions Mettre à jour la variable et Envoyer l’événement
  • Empilement de plusieurs ensembles de champs XDM sur plusieurs règles
  • Mappez des éléments de données de tableau individuels ou entiers à l’objet XDM.
  • Publication d’une règle de balise dans une bibliothèque de développement

Conditions préalables

Vous connaissez les balises de la collecte de données et le site de démonstration Luma et avez 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 suivre une convention de dénomination standard. Ce tutoriel utilise une convention de nommage en cinq parties :

  • [location] - [event] - [purpose] - [order]

où ;

  1. emplacement 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 la principale action effectuée par la règle
  4. ordre est l’ordre dans lequel la règle doit se déclencher par rapport aux autres règles

Création de règles de balises

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 de Platform Web SDK comprend deux actions qui sont utilisées dans cette leçon :

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

Dans la suite de cette leçon, nous avons :

  1. Créez une règle avec l’action Mettre à jour la variable pour définir une « configuration globale » des champs XDM.

  2. Créez des règles supplémentaires avec l’action Mettre à jour la variable qui remplacent notre « configuration globale » et contribuent à d’autres champs XDM sous certaines conditions (par exemple, en ajoutant des détails de produit sur les pages de produit).

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

Toutes ces règles seront correctement séquencées à l’aide de l’option « order ».

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

video poster

https://video.tv.adobe.com/v/3454029/?learn=on&enablevpops&captions=fre_fr

Champs de configuration globale

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 le volet de navigation de gauche

  3. Sélectionnez le bouton Créer une règle

    Créer une règle

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

  5. Dans la section Événements, sélectionnez Ajouter

    Nommez la règle et ajoutez un événement

  6. Utilisez l’extension Core et sélectionnez Bibliothèque chargée (haut de page) comme Type d’événement

  7. Sélectionnez la liste déroulante Avancé et saisissez 1 comme 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 d’ordre faible.

  8. Sélectionnez Conserver les modifications pour revenir à l’écran principal des règles
    Sélectionner le déclencheur de bibliothèque chargé

  9. Dans la section Actions, sélectionnez Ajouter

  10. Sélectionnez Adobe Experience Platform Web SDK en tant qu’extension ​****

  11. Sélectionnez Type d’action, puis Mettre à jour la variable

  12. En tant que Élément de données, sélectionnez le xdm.variable.content que vous avez créé dans la leçon Créer des éléments de données

    Mettre à jour le schéma de variables

Mappez maintenant vos éléments de données au schéma utilisé par votre objet XDM. Vous pouvez mapper des propriétés individuelles ou des objets entiers. Dans cet exemple, vous mappez à des propriétés individuelles :

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

  2. Saisir la valeur web.webpagedetails.pageViews

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

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

  4. Mapper à l’élément de données identityMap.loginID

    Mettre à jour le mappage d’identité de variable

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

  5. Faites défiler jusqu’à atteindre l’objet web

  6. Sélectionner pour l’ouvrir

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

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

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

    Mettre à jour le contenu des variables

    note tip
    TIP
    Bien que ni eventType défini sur web.webpagedetails.pageViews ni web.webPageDetails.pageViews.value ne soient nécessaires pour qu’Adobe Analytics traite une balise en tant que page vue, il est utile de disposer d’une méthode standard pour indiquer une page vue pour d’autres applications en aval.

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

Champs de la page Produit

Commencez à présent à utiliser Mettre à jour la variable dans des règles séquencées supplémentaires pour enrichir l’objet XDM avant de l’envoyer à Platform Edge Network.

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 ont le même type d’événement, celle qui a le plus petit nombre 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électionnez Ajouter une règle

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

  3. Sélectionnez le symbole + sous Événement 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électionnez pour ouvrir Options avancées, puis saisissez 20. Cette valeur d’ordre garantit que la règle s’exécute après la all pages - library loaded - set global variables - 1 qui définit la configuration globale.

  7. Sélectionnez Conserver les modifications

    Règles XDM Analytics

  8. Sous Conditions, sélectionnez pour Ajouter

  9. Laissez Type logique sur Standard

  10. Laisser Extension comme Core

  11. Sélectionnez Type de condition comme Chemin sans chaîne de requête

  12. À droite, activez le bouton bascule Expression régulière

  13. Sous chemin égal à définissez /products/. Pour le site de démonstration Luma, cela garantit que la règle ne se déclenche que sur les pages de produits

  14. Sélectionnez Conserver les modifications

    Règles XDM Analytics

  15. Sous Actions sélectionnez Ajouter

  16. Sélectionner l’extension Adobe Experience Platform Web SDK

  17. Sélectionnez Type d’action comme Variable de mise à jour

  18. Sélectionnez xdm.variable.content comme Élément de données

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

  20. Ouvrez l’objet productViews et définissez value sur 1

    configurer la vue du produit

    note tip
    TIP
    La définition de commerce.productViews.value=1 dans XDM mappe automatiquement à l’événement prodView dans Analytics

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

    note note
    NOTE
    Comme cette règle présente un ordre supérieur, elle remplacera le jeu de 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 important.

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

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

  24. Sélectionnez Ajouter un élément

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

    note caution
    CAUTION
    Le productListItems est un type de données array. Il s’attend donc à ce que les données soient transmises sous la forme d’une collection d’éléments. En raison de la structure de couche de données du site de démonstration Luma et du fait qu’il n’est possible d’afficher qu’un seul produit à la fois sur le site Luma, vous ajoutez des éléments individuellement. Lors de l’implémentation de 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. Mapper des productListItems.item1.SKU à des %product.productInfo.sku%

    Variable d’objet XDM de SKU de produit

  27. Sélectionnez Conserver les modifications

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

Champs 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éé précédemment effectue une boucle sur l’objet de couche de données digitalData.cart.cartEntries sur Luma et le traduit au format requis de l’objet productListItems du schéma XDM.

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

Format de tableau d’objets XDM

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

IMPORTANT
Notez la manière dont les variables numériques sont traduites, avec des valeurs de chaîne dans la couche de données telles que price et qty reformatées 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 l’étape configurer les schémas. Dans l’exemple, quantity utilise le type de données Integer.
Type de données de schéma XDM

Maintenant, mappons notre tableau à l’objet XDM :

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

  2. Sélectionnez le symbole + sous Événement 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électionnez pour ouvrir Options avancées, puis saisissez 20

  6. Sélectionnez Conserver les modifications

    Règles XDM Analytics

  7. Sous Conditions, sélectionnez pour Ajouter

  8. Laissez Type logique sur Standard

  9. Laisser Extensions comme Core

  10. Sélectionnez Type de condition comme Chemin sans chaîne de requête

  11. À droite, ne pas activer activez le bouton bascule Expression régulière

  12. Sous chemin égal à définissez /content/luma/us/en/user/cart.html. Pour le site de démonstration Luma, cela garantit que la règle ne se déclenche que sur la page du panier

  13. Sélectionnez Conserver les modifications

    Règles XDM Analytics

  14. Sous Actions sélectionnez Ajouter

  15. Sélectionner l’extension Adobe Experience Platform Web SDK

  16. Sélectionnez Type d’action comme Variable de mise à jour

  17. Sélectionnez xdm.variable.content comme Élément de données

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

  19. Ouvrez l’objet productListViews et définissez value sur 1

    configurer la vue du produit

    note tip
    TIP
    La définition de commerce.productListViews.value=1 dans XDM mappe automatiquement à l’événement scView dans Analytics

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

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

  22. Sélectionnez Fournir un tableau entier

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

  24. Sélectionnez Conserver les modifications

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

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

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 revient à définir scCheckout événement 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 revient à définir purchase événement dans Analytics

  4. commerce.order.purchaseID à l’élément de données cart.orderId

  5. Définissez commerce.order.currencyCode sur la valeur codée en dur USD

    Définition de purchaseID pour Analytics

    note tip
    TIP
    Cela revient à définir des variables s.purchaseID et s.currencyCode dans Analytics

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

  7. Sélectionnez Fournir un tableau entier

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

  9. Sélectionnez Conserver les modifications

  10. Sélectionnez Enregistrer

Lorsque vous avez terminé, vous devriez voir les règles suivantes créées.

Règles XDM Analytics

Règle d’événement d’envoi

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

  1. Sur la 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 la section Événements, sélectionnez Ajouter

  4. Utilisez l’extension Core et sélectionnez Library Loaded (Page Top) comme type d’événement.

  5. Sélectionnez la liste déroulante Avancé et saisissez 50 dans Ordre. Cela permet de s’assurer que cette règle se déclenche après toutes les autres règles que vous avez configurées (dont le Ordre était 1 ou 20).

  6. Sélectionnez Conserver les modifications pour revenir à l’écran principal des règles
    Sélectionner le déclencheur de bibliothèque chargé

  7. Dans la section Actions, sélectionnez Ajouter

  8. Sélectionnez Adobe Experience Platform Web SDK en tant qu’extension ​****

  9. Sélectionnez Type d’action, Envoyer l’événement

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

  11. Sélectionnez Conserver les modifications pour revenir à l’écran principal des règles

    Ajouter l’action Envoyer l’événement

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

    Enregistrer la règle

Publication des règles dans une bibliothèque

Publiez ensuite la règle dans votre environnement de développement afin de vérifier qu’elle fonctionne.

Pour créer une bibliothèque, procédez comme suit :

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

  2. Sélectionnez Ajouter une bibliothèque

    Sélectionnez Ajouter une bibliothèque

  3. Pour le Nom, saisissez Luma Web SDK Tutorial

  4. Pour le Environnement, sélectionnez Development

  5. Sélectionnez 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 JavaScript de base requis par toutes les propriétés de balise web.

  6. Sélectionnez Enregistrer et créer pour le développement

    Création et génération de la bibliothèque

La création de la bibliothèque peut prendre quelques minutes et, lorsqu’elle est terminée, un point vert s’affiche à gauche du nom de la bibliothèque :

Création terminée

Comme vous pouvez le voir dans l’écran Flux de publication, le processus de publication ne se limite pas au contenu de ce tutoriel. Ce tutoriel utilise uniquement une bibliothèque dans votre environnement de développement.

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

Suivant

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