Tout ce que vous devez savoir à propos de la configuration du suivi des conversions

Les gestionnaires de balises remplacent les balises statiques par des balises dynamiques plus faciles à implémenter et mettre à jour. La balise dynamique est un conteneur, un petit extrait de code qui vous permet d’insérer des balises dynamiquement sur votre site web. Vous pouvez penser à la balise conteneur comme une enveloppe regroupant plusieurs autres types de balises.

Le suivi des conversions fonctionne avec tous les principaux systèmes de gestion de balises. Voici la liste à jour des gestionnaires de balises testés et pris en charge (et des liens vers des instructions d’utilisation) :

• Google Tag Manager
• Qubit Opentag
• Tealium
• Ensighten
• Signal
• Adobe Dynamic Tag Manager
• Adobe Launch

Le suivi des conversions est conçu pour fonctionner avec toutes les principales plateformes de site web. Voici la liste à jour des plateformes testées et prises en charge pour vous permettre d’installer des balises de suivi des conversions (et des liens vers des instructions d’utilisation) :

• BigCommerce
• Shopify
• WordPress.com
• Wix

Les sites web d’application monopage (SPA) sont requis pour utiliser le code de suivi de balise de suivi des conversions JavaScript. Les événements de SPA sont déclenchés à l’aide de la même syntaxe que pour les événements personnalisés, avec l’action « page_view » et au paramètre requis « page_path » (« page_title » est facultatif). Le paramètre « page_path » doit commencer par une barre oblique, « / ». Exemple :

window.uetq = window.uetq || []; 
window.uetq.push('event', 'page_view', { 'page_path': '/spa_page' }); 

Voici trois méthodes pour déclencher des événements de SPA. Nous vous recommandons d’avoir recours à la première méthode. Pour chaque option, nous avons un exemple de page web que vous pouvez consulter pour voir le code approprié en action.

• Modification de contenu : Déclenchez un événement de SPA à chaque fois que votre application charge du contenu dynamique. Dans ce cas, l’URL réelle est envoyée automatiquement dans un événement pageLoad (chargement de page) standard au premier chargement. Vous pouvez utiliser cette URL dans vos objectifs de destination, et tous les événements personnalisés déclenchés sur cette première page y seront associés. Chaque événement de SPA génère un événement pageLoad avec l’URL du SPA, qui n’a pas besoin d’être un chemin à charger. Vous pouvez aussi faire référence à ces URL dans vos objectifs. Les événements personnalisés déclenchés après un événement de SPA seront uniquement associés au chargement de page SPA (en d’autres termes, pas l’URL d’origine).
  • Pour voir ce code en action, consultez notre exemple de page web « Modification de contenu ».
• Toutes les pages : Déclenchez un événement de SPA sur toutes les pages, y compris le chargement initial. Ce scénario est identique au précédent, à l’exception du fait que l’événement pageLoad automatique n’est pas utilisé. Comme il est encore déclenché, il est important d’organiser vos événements de sorte que l’événement de SPA se déclenche avant tout autre événement personnalisé. S’ils sont déclenchés dans le désordre, certains ou tous peuvent être associés à l’événement pageLoad automatique (et à l’URL d’origine), et non à l’événement pageLoad de SPA (et à l’URL du SPA, dont page_path).
  • Pour voir ce code en action, consultez notre exemple de page web « Toutes les pages ».
• Toutes les pages, automatique désactivé : Déclenchez un événement de SPA sur toutes les pages et désactivez le chargement de page automatique. Ceci est obtenu en ajoutant « disableAutoPageView: true » aux paramètres d’initialisation. (Remarque : ne modifiez pas directement l’extrait de code à désactiver). Cette opération est identique au scénario précédent, mais supprime la condition selon laquelle l’événement de SPA doit être déclenché en premier lors du chargement de page initial. Cependant, les événements de SPA suivants doivent toujours être déclenchés avant tout événement personnalisé auquel ils sont associés (ou ils seront attribués à l’événement de SPA précédent).
  • Pour voir ce code en action, consultez notre exemple de page web « Toutes les pages, automatique désactivé ».

Une fois que vous avez créé un objectif de conversion d’événement personnalisé ou une liste de remarketing avec des événements personnalisés (voir Comment suivre les événements personnalisés avec le suivi des conversions), vous devez ajouter le code JavaScript d’événement personnalisé au code de suivi de votre balise de suivi des conversions. Supposons que l’événement personnalisé que vous souhaitez suivre sur votre page web est personnes sélectionnant un bouton « Télécharger maintenant » sur l’une de vos pages web.

Pour voir un exemple de code de suivi d’une balise de suivi des conversions d’événement personnalisé installé dans le corps d’une page web, visitez cette page web (en anglais uniquement), cliquez avec le bouton droit dans la page web, puis sélectionnez Afficher la source ou Afficher le code source de la page en fonction de votre navigateur. Sur cette page, vous pouvez également voir certains boutons. Une sélection de chacun des boutons déclenche un événement personnalisé. Si vous utilisez un outil de surveillance tiers tel que Fiddler, vous pouvez voir la requête HTTP générée pour bat.bing.com pour signaler chaque événement personnalisé.

Pour des exemples d’événements de commerce électronique personnalisés, consultez Exemples d’événements personnalisés pour les clients du commerce électronique.

Une fois que vous avez créé un objectif de conversion de revenu variable (voir Comment signaler le revenu variable avec le suivi de conversion), vous devez modifier le code de suivi des conversions pour le prendre en charge.

Découvrez comment transmettre le revenu variable pour un objectif de type URL de destination dans les pages PHP. Dans l’exemple ci-dessous, une valeur dynamique pour le revenu variable est lue à partir d’une fonction JavaScript. Vous pouvez tout aussi facilement envoyer une valeur statique ou lire la valeur à partir d’une variable JavaScript ou l’élément HTML.

Pour ajouter le code aux pages PHP à l’aide de l’éditeur de votre page web, consultez l’exemple de code de suivi de la balise de suivi des conversions ci-dessous :

<script>

   (function(w,d,t,r,u){var f,n,i;w[u]=w[u]||[] ,f=function(){var o={ti:"TAG_ID_HERE"}; o.q=w[u],w[u]=new UET(o),w[u].push("pageLoad")} ,n=d.createElement(t),n.src=r,n.async=1,n.onload=n .onreadystatechange=function() {var s=this.readyState;s &&s!=="loaded"&& s!=="complete"||(f(),n.onload=n. onreadystatechange=null)},i= d.getElementsByTagName(t)[0],i. parentNode.insertBefore(n,i)})(window,document,"script"," //bat.bing.com/bat.js","uetq");

</script>



<script>
   function GetRevenueValue()
	  {
		 return 6;
	  }

</script>  

	  
<script>

   window.uetq = window.uetq || [];
   window.uetq.push('event', '', {'revenue_value': GetRevenueValue(), 'currency': 'Replace_with_Currency_Code'});
  
</script>
		 

Avancé : Exemples de code pour les objectif de conversion d’événement

À présent que vous connaissez le code à ajouter à la fin du code de suivi de la balise de suivi des conversions pour les objectifs de conversion d’URL de destination, en voici d’autres que vous pouvez essayer :

Objectif de conversion d’événement

Vous devez ajouter un code différent pour signaler le revenu variable pour un objectif de conversion d’événement. Si vous utilisez la même fonction JavaScript qu’à l’étape 2, il ressemble à cela :

<script>
   window.uetq = window.uetq || [];
   window.uetq.push('event', 'Event action', {'event_category': 'Replace_with_Event_Category', 'event_label': 'Replace_with_Event_Label', 'event_value': 'Replace_with_Event_Value', 'revenue_value': GetRevenueValue(), 'currency': 'Replace_with_Currency_Code'});  
</script>
		

Remarque : Pour afficher la liste complète des codes de devise, voir Devises des revenus des objectifs de conversion.

Une fois que vous avez créé une liste de remarketing dynamique (voir Listes de remarketing dynamique : Remarketing pour des produits), vous devez ajouter les paramètres personnalisés au code de suivi de votre balise de suivi des conversions pour qu’elle fonctionne.

Ajoutez le code JavaScript suivant à chaque page de votre site web :

<script> 

   window.uetq = window.uetq || []; 

   window.uetq.push ('event', '', {'ecomm_prodid': 'Replace_with_Product_ID', 'ecomm_pagetype': 'Replace_with_Page_Type'});   

</script> 

Dans le code JavaScript ci-dessus, modifiez les paramètres suivants :

• Replace_with_Product_ID : Remplacez-le par l’un des ID de produit suivants :
  • L’ID de référence exact qui identifie de manière unique un produit. C’est ce que l’on appelle un code produit universel.
  • Un ID de groupe d’articles représentant un ensemble de variantes d’un même produit (comme des options de couleur ou de taille).

  Important

  L’ID de produit dans le code JavaScript doit correspondre à un ID dans votre flux de produits Microsoft Merchant Center.

• Replace_with_Page_Type : Remplacez cette valeur par l’une des valeurs suivantes dans la colonne de droite de ce tableau, en fonction de la page dans laquelle vous allez utiliser ce code JavaScript :

  Liste de remarketing dynamique que vous suivez	Type de page requise
  Visiteurs généraux	'ecomm_pagetype': 'home' 'ecomm_pagetype': 'category' 'ecomm_pagetype': 'other' Remarque : Tout utilisateur non inclus dans le type de page pour les résultats de recherche, le produit, le panier ou l’achat est inclus dans l’audience des visiteurs généraux.
  Personnes recherchant le produit	'ecomm_pagetype': 'searchresults'
  Personnes consultant le produit	'ecomm_pagetype': 'product'
  Personnes ayant abandonné leur panier d’achat	'ecomm_pagetype': 'cart'
  Acheteurs précédents	'ecomm_pagetype': 'purchase'

  Remarque : Les clients qui achètent un produit sont ajoutés à la liste « Acheteurs précédents » et sont retirés des autres listes (pour ce produit). Pour que cela fonctionne, la balise de suivi des conversions sur votre page de confirmation d’achat doit envoyer l’ID de produit (ecomm_prodid) et le type de page (ecomm_pagetype).

Pour voir un exemple de code de suivi d’une balise de suivi des conversions de remarketing dynamique installé dans le corps d’une page web, visitez cette page web (en anglais uniquement), cliquez avec le bouton droit dans la page web, puis sélectionnez Afficher la source ou Afficher le code source de la page en fonction de votre navigateur. Sur cette page, vous pouvez également définir un ID produit et un type de page, puis sélectionnez un bouton pour déclencher un événement personnalisé pour cette liste de remarketing dynamique. Si vous utilisez un outil de surveillance tiers tel que Fiddler, vous pouvez voir la requête HTTP générée pour bat.bing.com pour signaler chaque événement personnalisé.

Comme décrit dans les sections précédentes, certaines fonctionnalités Microsoft Advertising requièrent que vous ajoutiez et modifiiez un extrait de code JavaScript à votre balise de suivi des conversions :

• Événements personnalisés : Pour les objectifs de conversion ou les listes de remarketing basés sur les événements personnalisés, vous devez modifier l’extrait de code suivant pour renvoyer l’action d’événement, la catégorie d’événement, l’étiquette d’événement et/ou la valeur d’événement :

  <script>		 
  
  							
     window.uetq = window.uetq || [];  
  
     window.uetq.push ('event', 'Replace_with_Event_Action', {'event_category': 'Replace_with_Event_Category', 'event_label': 'Replace_with_Event_Label', 'event_value': 'Replace_with_Event_Value'});   
  
  
  							
  </script> 
  							
  									
  

• Revenu variable : Pour les objectifs de conversion qui ciblent un revenu variable, vous devez modifier l’extrait de code suivant pour renvoyer la valeur de revenu et le code de devise :

  <script>		 
   	  
  
     window.uetq = window.uetq || [];  
  
     window.uetq.push ('event', '', {'revenue_value': 'Replace_with_Revenue_Value', 'currency': 'Replace_with_Currency_Code'});   
  
  
  </script> 
  

• Remarketing dynamique : Pour cibler une liste de remarketing dynamique, vous devez modifier l’extrait suivant afin de renvoyer l’ID du produit et le type de page :

  <script>		 
   	  
  
     window.uetq = window.uetq || [];  
  
     window.uetq.push ('event', '', {'ecomm_prodid': 'Replace_with_Product_ID', 'ecomm_pagetype': 'Replace_with_Page_Type'});   
  
  
  </script> 
  

Si vous implémentez plusieurs de ces fonctionnalités, gardez les points suivants à l’esprit :

• Nous vous recommandons de garder l’extrait de code JavaScript de chaque fonctionnalité séparé dans le code de votre page web (c’est-à-dire, dans des sections <script> </script> distinctes) car chaque extrait de code envoie un événement.
• En d’autres termes, vous ne pouvez pas utiliser un extrait de code JavaScript pour suivre les deux éléments suivants sur une même page web :
  • Revenu variable pour l’objectif de conversion URL de destination
  • Événements personnalisés basés sur un objectif de conversion ou une liste de remarketing

  Dans le cas présent, vous devez avoir deux extraits de code distincts dans le code de votre page web :

  • Extrait de code 1, pour le revenu variable pour l’objectif de conversion URL de destination :

    <script>		 
     	  
    
       window.uetq = window.uetq || [];  
    
       window.uetq.push ('event', '', {'revenue_value': 'Replace_with_Revenue_Value', 'currency': 'Replace_with_Currency_Code'});   
    
    
    </script> 
    

  • Extrait de code 2, pour les événements personnalisés basés sur un objectif de conversion ou une liste de remarketing. Cependant, notez que, si vous suivez le revenu variable d’un objectif de conversion d’événement personnalisé (pas un objectif de conversion d’URL de destination), vous pouvez l’inclure dans l’extrait de code d’événement personnalisé :

    <script>		 
    
    							
       window.uetq = window.uetq || [];  
    
       window.uetq.push ('event', 'Replace_with_Event_Action', {'event_category': 'Replace_with_Event_Category', 'event_label': 'Replace_with_Event_Label', 'event_value': 'Replace_with_Event_Value', 'revenue_value': 'Replace_with_Revenue_Value', 'currency': 'Replace_with_Currency_Code'});   
    
    							
    </script>