Balises Google Floodlight

Cet article s'adresse aux développeurs qui souhaitent transférer des balises Floodlight à partir d'un tag. conteneur Web du gestionnaire dans un conteneur serveur.

Tag Manager côté serveur vous permet de déplacer vos ventes Google Floodlight et de la page Web au serveur. Déplacer ces tags sur le serveur réduit la quantité de code à exécuter sur la page et contribue à améliorer les temps de chargement des pages.

Avant de commencer

Avant de pouvoir déplacer des tags sur votre serveur, assurez-vous d'avoir effectué les opérations suivantes:

• Accès administrateur à Google Tag Manager et Floodlight
• Configurer et installer Google Tag Manager
• Configurer un conteneur serveur
• Configurer le client Google Analytics: GA4

Étape 1: Configurer la balise Conversion Linker

Votre compte Floodlight ne peut envoyer des données de conversion à Google Tag Manager que : vous avez configuré une balise Conversion Linker.

Si vous avez déjà Balise Conversion Linker configurés dans votre conteneur serveur, vous pouvez ignorer cette étape.

Pour configurer la balise Conversion Linker:

1. Dans l'espace de travail de votre conteneur serveur, ouvrez le menu Tags situé à gauche .
2. Cliquez sur Nouveau pour ajouter une balise.
3. Sélectionnez le type de balise Conversion Linker.
4. Configurez le déclencheur qui déclenchera la balise côté serveur Conversion Linker.
   Dans la plupart des cas, le déclencheur Toutes les pages est la meilleure option.
5. Attribuez un nom à la balise, puis cliquez sur Enregistrer.

Étape 2: Configurer les balises Floodlight

Google Tag Manager est compatible avec les balises Compteur et les balises de ventes Floodlight dans le conteneur serveur.

Compteur Floodlight

Pour configurer une balise Compteur Floodlight:

1. Dans l'espace de travail de votre conteneur serveur, sélectionnez le menu Tags à gauche. sur le côté droit de la page.
2. Cliquez sur Nouveau pour ajouter une balise.

3. Sélectionnez le type de balise Compteur Floodlight.

   

4. Pour rassembler les valeurs requises pour la configuration de la balise, ouvrez une autre fenêtre du navigateur et connectez-vous à Campaign Manager 360. Cliquez sur Annonceurs, puis sur le nom de l'annonceur. Saisissez les valeurs suivantes dans votre nouvelle balise Compteur Floodlight Tag Manager:

   • Référence annonceur: la référence annonceur apparaît au niveau de l'annonceur. juste en dessous du nom de l'annonceur. Cette valeur est également trouvé comme valeur de src= dans une balise Floodlight générée extrait.
   • Chaîne de balise de groupe : dans le tableau "Activité", identifiez l'activité qui vous intéresse et recherchez la chaîne de balise de groupe indiquée dans une colonne à droite. C'est aussi la valeur type= dans l'extrait de code d'une balise Floodlight généré.
   • Chaîne de balise d'activité: dans le tableau "Activité", identifiez la activité qui vous intéresse et recherchez le tag d'activité string dans une colonne à droite. Il se trouve également dans les cas suivants : Valeur de cat= dans l'extrait de code d'une balise Floodlight généré

5. Définissez la Méthode de comptabilisation souhaitée:

   • Standard: comptabilise chaque conversion.
   • Unique: comptabilise la première conversion pour chaque utilisateur unique. au cours de chaque journée de 24 heures, de minuit à minuit, heure de la côte est des États-Unis.
   • Par session: comptabilise une conversion par utilisateur et par session. La durée de la session est définie par le site sur lequel la balise Floodlight est déployée.

6. Ouvrez la fenêtre Sélectionner un déclencheur.

7. Dans le menu Configuration du déclencheur, sélectionnez un déclencheur. Dans la plupart des cas, Toutes les pages est la meilleure option.

   

8. Attribuez un nom à la balise, puis cliquez sur Enregistrer.

   

Ventes Floodlight

Pour configurer une balise Ventes Floodlight :

1. Dans l'espace de travail de votre conteneur serveur, sélectionnez le menu Tags à gauche. sur le côté droit de la page.
2. Cliquez sur Nouveau pour ajouter une balise.

3. Sélectionnez le type de balise Ventes Floodlight. Remarque: Le rapport Ventes Floodlight collecte automatiquement les valeurs suivantes à partir du champ d'e-commerce correspondant:

   *   Order ID (Transaction ID)
   *   Revenue (Value)
   

4. Pour rassembler les valeurs requises pour la configuration de la balise, ouvrez une autre fenêtre de navigateur et connectez-vous à Campaign Manager 360° : Cliquez sur Annonceurs, puis cliquez sur le nom de l'annonceur. Saisissez ces informations dans votre nouvelle balise Compteur Tag Manager Floodlight:

   • Référence annonceur: la référence annonceur apparaît au niveau de l'annonceur. juste en dessous du nom de l'annonceur. Cette valeur est également trouvé comme valeur de src= dans une balise Floodlight générée extrait.
   • Chaîne de balise de groupe : dans le tableau "Activité", identifiez l'activité qui vous intéresse et recherchez la chaîne de balise de groupe indiquée dans une colonne à droite. C'est aussi la valeur type= dans l'extrait de code d'une balise Floodlight généré.
   • Chaîne de balise d'activité: dans le tableau "Activité", identifiez la activité qui vous intéresse et recherchez le tag d'activité string dans une colonne à droite. Il se trouve également dans les cas suivants : Valeur de cat= dans l'extrait de code d'une balise Floodlight généré

5. Définissez la Méthode de comptabilisation souhaitée:

   • Standard: comptabilise chaque conversion.
   • Unique: comptabilise la première conversion pour chaque utilisateur unique. au cours de chaque journée de 24 heures, de minuit à minuit, heure de la côte est des États-Unis.
   • Par session: comptabilise une conversion par utilisateur et par session. La durée de la session est définie par le site sur lequel la balise Floodlight est déployée.

6. Ouvrez la fenêtre Sélectionner un déclencheur.

7. Dans le menu Configuration du déclencheur, sélectionnez un déclencheur. Dans la plupart des cas, Toutes les pages est la meilleure option.

8. Attribuez un nom à la balise, puis cliquez sur Enregistrer.

Facultatif: Configurer le suivi avancé des conversions

Si vous n'utilisez pas le suivi avancé des conversions, passez directement à Valider vos configuration.

Pour configurer le suivi avancé des conversions Les conversions suivent le les étapes ci-dessous.

Configurer une variable de données fournies par l'utilisateur

Il existe trois méthodes pour implémenter le suivi avancé des conversions dans Tag Manager. Il vous suffit de choisir une option afin de collecter les données fournies par l'utilisateur.

	Collecte automatique	Configuration manuelle	Configuration du code
Méthode de collecte	Collecte automatiquement les données fournies par l'utilisateur en fonction du code de votre sur votre site Web. Si vous avez besoin de contrôler où collecter les entrées, optez pour une manuellement ou par code.	Spécifiez certaines propriétés CSS ou variables JavaScript à collecter les données fournies par les utilisateurs. Si vous devez contrôler le formatage et le hachage des données, opter pour la configuration du code.	Ajoutez à votre site Web un extrait de code qui envoie les données client hachées pour la mise en correspondance. Cette méthode est idéale pour optimiser la précision le suivi avancé des conversions, car il vous permet d'envoyer des données formatées de manière cohérente chaque fois que votre balise de conversion se déclenche.
Complexité	Simple	Moyenne	Complexe
Compétences	Ne nécessite aucune compétence particulière	HTML et CSS	Développement Web

Collecte automatique

1. Dans votre conteneur Web, ouvrez le menu Variables.
2. Créez une Variable définie par l'utilisateur de type Données fournies par l'utilisateur.
3. Définissez le Type sur Collecte automatique.
4. Nommez la variable (par exemple, My user-defined data).
5. Cliquez sur Enregistrer.

Configuration manuelle

1. Dans votre conteneur Web, ouvrez le menu Variables.
2. Créez une Variable définie par l'utilisateur de type Données fournies par l'utilisateur.
3. Définissez le Type sur Configuration manuelle.

4. En ce qui concerne le champ pertinent des données utilisateur que vous souhaitez fournir via le suivi avancé des conversions, ajoutez une variable nouvelle ou existante.

   Remarque :Si votre couche de données comporte déjà des variables (que vous utilisiez des sélecteurs CSS ou d'autres types de variables), vous pouvez les sélectionner au lieu de créer des variables. En cas de doute, suivez les instructions. Les variables peuvent être hachées ou non hachées.

5. Pour préciser un élément du DOM, sélectionnez Nouvelle variable > Configuration de la variable > Élément DOM.

6. Sous Mode de sélection, vous pouvez utiliser un sélecteur CSS ou un ID. Conseil: Si vos variables CSS changent fréquemment, ajoutez un ID HTML à votre site et utilisez la variable d'ID.

7. Saisissez le sélecteur CSS ou le nom de l'ID. Vous pouvez laisser le champ "Nom de l'attribut" vide.

8. Attribuez un nom à la variable d'élément DOM, puis enregistrez-la. Votre écran revient alors aux paramètres Données fournies par l'utilisateur.

9. Nommez la variable Données fournies par l'utilisateur (par exemple, My user-defined data).

10. Cliquez sur Enregistrer.

Configuration avec code

Étape 1 : Identifiez et définissez les variables pour le suivi avancé des conversions

Vous pouvez envoyer des données non hachées, que Google hachera avant les données atteint les serveurs, soit des données préhachées. Si vous décidez d'envoyer des données préhachées, veuillez encoder les données à l'aide de l'algorithme SHA256 encodé en hexadécimal. Dans les deux cas, fournissez au au moins l'un des champs suivants: email ou phone_number.
Pour transmettre les données non hachées à la couche de données:

1. Sur votre site Web, stockez les données fournies par l'utilisateur en tant que paires clé-valeur dans un variable JavaScript. Exemple :

   var leadsUserData = {
     'email': '[e-mail]',
     'phone_number': '[phone]',
     'address': {
       first_name: 'John',
       last_name: 'Doe',
       street: '123 Lemon',
       city: 'Some city',
       region: 'CA',
       country: 'US',
       postal_code: '12345',
     },
   };
   

2. Envoyez les données utilisateur avec un événement utilisant dataLayer.push(). Pour Exemple:

   <script>
     dataLayer.push({
       'event': 'formSubmitted',
       'leadsUserData': {
         'email': '[e-mail]',
         'phone_number': '[phone]',
         'address': {
            first_name: 'John',
            last_name: 'Doe',
            street: '123 Lemon',
            city: 'Some city',
            region: 'CA',
            country: 'US',
           postal_code: '12345',
          },
        },
     });
   <script>
   

La variable leadsUserData est désormais disponible dans Google Tag Manager.

Pour transmettre les données préhachées à la couche de données :

1. Sur votre site Web, hachez les données fournies par l'utilisateur à l'aide de l'algorithme SHA256 encodé en hexadécimal. La clé pour les données encodées doit commencer par sha256_. Exemple :

   {'sha256_email_address':await hashEmail(email.trim()),
   }
   

2. Envoyez les données utilisateur avec un événement à l'aide de dataLayer.push(). La l'exemple ci-dessous montre une implémentation de couche de données qui suppose que vous avez écrit vous-même une fonction de hachage que vous exécutez de manière asynchrone.

   <script>
     dataLayer.push({
       'event': 'formSubmitted',
       'leadsUserData': {
         'sha256_email_address': await hashEmail(email.trim()),
         'sha256_phone_number': await hashPhoneNumber(phoneNumber),
         'address': {
           sha265_first_name: await hashString(firstname),
           sha256_last_name: await hashString(lastname),
           sha256_street: await hashString(streetAddress),
           postal_code: '12345',
          },
        },
     });
   <script>
   

La variable leadsUserData est désormais disponible dans Google Tag Manager.

Étape 2 : Créez la variable de données fournies par l'utilisateur

1. Dans votre conteneur Web, ouvrez le menu Variables.
2. Créez une Variable définie par l'utilisateur de type Données fournies par l'utilisateur.
3. Définissez le Type sur Code.
4. En ce qui concerne le champ pertinent des données utilisateur que vous souhaitez fournir, cliquez sur le menu déroulant et sélectionnez Nouvelle variable.
5. Sous Sélectionner un type de variable, choisissez Variable de couche de données.
6. Dans la Variable de couche de données, faites référence aux données utilisateur stockées. Exemple :leadsUserData
7. Attribuez un nom à la variable de couche de données et enregistrez-la. Votre écran revient alors aux paramètres Données fournies par l'utilisateur.
8. Nommez la variable Données fournies par l'utilisateur (par exemple, My user-defined data).
9. Cliquez sur Enregistrer.

Attribuer la variable à la balise Google

1. Dans votre conteneur Web, ouvrez le menu Balises.
2. Modifiez la balise Google que vous utilisez pour envoyer des données au serveur de taggage.
3. Sous Paramètres de configuration, ajoutez un nouveau paramètre de configuration. appelé user_data. Définissez Valeur sur Données fournies par l'utilisateur. (par exemple, {{My user-provided data}}).

4. Enregistrez les modifications. Votre tag doit se présenter comme suit:

   

Configurer la balise Floodlight côté serveur

Dans votre conteneur serveur, activez le suivi avancé des conversions en configurant Ventes Floodlight ou Compteur Floodlight.

Remarque :Lorsqu'elles sont déclenchées, les balises Floodlight envoient toutes les conversions disponibles données à Google (y compris les données fournies par l'utilisateur). Si vous souhaitez modifier ou exclure tous les paramètres d'événement avant le déclenchement de la balise, configurer et utiliser et les associer à votre balise.

Facultatif: valeur des revenus

La balise de ventes Floodlight utilise le paramètre value de l'événement comme paramètre par défaut. pour calculer les revenus. Pour spécifier une autre base de calcul vous devez configurer une variable pour extraire les données de votre base de données et l'attribuer à votre balise de ventes Floodlight.

Remarque :Le conteneur serveur chiffre la valeur des revenus pour garantir que les données de conversion n'est pas exposée lorsque le serveur transmet des données au navigateur.

Pour créer une variable:

1. Dans votre conteneur serveur, ouvrez le menu Variables.
2. Créez une variable définie par l'utilisateur pour la saisie des données. Par exemple, si vous souhaitez utiliser une valeur d'une base de données Firestore, créez {{Recherche dans Firestore}} .
3. Spécifiez les sources de données de la variable.
4. Nommez la variable (par exemple, "Recherche de bénéfices"). Cliquez sur Enregistrer.

Pour utiliser la variable dans la balise de ventes Floodlight:

1. Dans votre conteneur serveur, ouvrez le menu Tags.
2. Modifiez la balise Ventes Floodlight.

3. Dans la section Paramètres uniques:

   • Pour Source de données, sélectionnez Configuration personnalisée.
   • Pour Revenus, sélectionnez la variable que vous avez créée précédemment.
   • Pour ID de commande, saisissez un ID ou utilisez une variable à renseigner dynamiquement l'ID de commande.

   

4. Enregistrez la balise.

Facultatif: paramètres personnalisés

Vous pouvez transmettre des paramètres personnalisés champs de votre page Web à Google Marketing Platform, par exemple match_id.

Google Tag Manager

Afin de configurer des champs personnalisés pour Floodlight, ajoutez le préfixe x-dc- à une nom du paramètre:

1. Dans votre conteneur Web, ouvrez le menu Balises.
2. Modifiez un tag d'événement GA4 ou créez-en un.

3. Dans Paramètres de l'événement, ajoutez le nom du paramètre. Pour signaler qu'il est envoyé à Floodlight, ajoutez x-dc- au début. Par exemple, si vous envoyez normalement Remplacez match_id par x-dc-match_id.

   

4. Enregistrez la balise.

gtag.js

Afin de configurer des champs personnalisés pour Floodlight, ajoutez x-dc- à l'événement. nom du paramètre:

  gtag('event', 'purchase', {
      'x-dc-match_id': [MATCH_ID],
      ...
  })

Étape 3: Valider votre configuration

Une fois que vous avez commencé à envoyer des données avec le conteneur serveur, s'il fonctionne correctement:

1. Ouvrez votre site Web.
2. Dans votre conteneur serveur Google Tag Manager, sélectionnez Prévisualiser. Tag Assistant démarrera et chargera votre conteneur serveur.
3. L'onglet Balises affiche toutes les balises qui ont été déclenchées. Assurez-vous que la balise que vous avez configurée s'est déclenchée.
4. L'onglet Console affiche toutes les erreurs survenues pendant la transmission des données. vers le conteneur serveur. Recherchez les erreurs éventuelles et corrigez-les.

Pour obtenir de l'aide sur le débogage des conteneurs Tag Manager, consultez l'aide concernant l'aperçu et le débogage.

Étapes suivantes

Une fois que votre balise Floodlight fonctionne comme prévu, vous pouvez supprimer toute balise équivalente Balises Floodlight dans un conteneur Web pour éviter la duplication des données