Pourquoi vous devriez utiliser l’API de conversion Facebook (FB CAPI)
Si vous faites déjà des campagnes de publicité sur Facebook vous utilisez probablement le fameux pixel Facebook. Ce pixel est utilisé pour enregistrer les visiteurs, les événements et les conversions de vos campagnes. Tout ceci est utilisé côté client en passant par le code HTML du navigateur et Javascript pour envoyer les données de suivi de l’internaute à Facebook.
Aujourd’hui, même si elle fonctionne encore très bien, cette méthode atteint quelques limites avec notamment les restrictions de collecte de données liées au RGPD. Certains navigateurs bloquent les pixels de suivi et cela empêche de plus en plus le suivi du pixel Facebook.
La solution proposée par Facebook pour répondre à cette problématique est son API de conversion (CAPI). Les données de suivi et des événements sont envoyés directement à Facebook via l’API et donc sur le serveur. Ces données ne peuvent donc plus être bloquées côté client et donc par le navigateur. Attention tout de même, cela ne vous autorise pas à faire n’importe quoi. Vous devez toujours vous conformer aux règles applicables en matière de confidentialité des données.
Sommaire de cet article :
- Créer un conteneur Google Tag Manager Serveur
- Paramétrer l’API de conversion Facebook
- Envoyer les données depuis GTM à l’API de conversion Facebook
- Envoyer vos événements Facebook via le navigateur et le serveur
- Configurer les balises GA4 dans GTM côté client
- Tests des événements côté serveur dans Facebook Business Manager
Retrouvez ce contenu dans d’autres formats :
Créer un conteneur Google Tag Manager Serveur
Rendez-vous dans votre compte GTM et créez un nouveau conteneur.
Donnez un nom à ce nouveau conteneur et sélectionnez le type “Server” et cliquez sur “Créer”.
Après avoir cliqué sur le bouton “Créer”, une popup vous demandera de configurer le serveur d’insertion de balises. Sélectionnez “Provisionnez automatiquement le serveur d’ajout de tags”.
Sélectionnez votre compte de facturation Google Cloud Plateform. Si vous n’en n’avez pas, il vous faudra le créer avant de pouvoir finaliser la création du serveur.
Lorsque la création est terminée, vous obtiendrez des données de configuration intéressantes et notamment l’URL de votre serveur. Conservez-le vous en aurez besoin pour la suite ! Vous pourrez toujours retrouver ces informations dans les paramètres du conteneur.
Ca y est, votre conteneur Google Tag Manager côté serveur est maintenant créé, nous allons pouvoir paramétrer le Facebook Conversion API.
Paramétrer l’API de conversion Facebook
Dans un premier temps vous allez devoir activer les paramètres de l’API de conversion Facebook.
Connectez vous à votre compte Facebook Business Manager pour configurer l’API et allez dans les paramètres de votre pixel, au niveau des sources de données.
Scrollez au niveau de l’API Conversion et cliquez sur “Générer un token”.
Le jeton d’accès (ou access token) est une méthode d’authentification unique qui permet à une application d’accéder à une API.
Une fois le jeton d’accès obtenu, retournez dans le conteneur GTM côté serveur.
Envoyer les données depuis GTM à l’API de conversion Facebook
Cette étape n’est pas obligatoire mais pour ma part, cela fait partie des bonnes pratiques à adopter sur tout compte GTM pour des questions d’organisation et de visibilité. En effet, on peut facilement se retrouver avec de nombreuses balises, déclencheurs et variables et si le conteneur n’est pas un minimum structuré et organisé, ça devient très vite compliqué à gérer.
Bref, revenons-en à notre configuration 🙂
Créez ensuite une nouvelle balise. Nous allons utiliser un template que nous trouvons dans la galerie de modèles.
Et sélectionnez Facebook Conversions API Tag.
3 champs sont nécessaires pour configurer la balise :
– Vous aurez besoin de votre pixel Facebook. Pensez à créer une variable de type constante identique à celle créée précédemment pour le token d’accès.
– Le token d’accès généré par Facebook pour l’API conversion.
– Le code de test d’événement que l’on obtient également par Facebook. Il se trouve dans les sources de données, dans l’onglet “événements de test”.
Ajoutez ensuite un déclencheur à cette balise.
La manière la plus simple d’utiliser la balise Facebook Conversion API est de la déclencher à chaque fois qu’une requête GA4 est faite.
Sélectionnez le type de déclencheur Personnalisé et ajoutez les conditions suivantes à votre déclencheur.
Envoyer vos événements Facebook via le navigateur et le serveur
Si vous souhaitez envoyer tous vos événements via le navigateur et le serveur, il vous faudra dédupliquer les événements identiques. Pour cela, il va falloir déterminer si les événements sont bien identiques en utilisant un ID d’événement.
Comme précédemment, vous allez devoir créer une variable nommée “Event Id” qui permettra de générer un ID unique aux événements envoyés.
Rendez-vous dans votre conteneur Tag Manager client et créez la variable à partir de la galerie de modèles et sélectionnez la variable Event Id.
Cette variable ne demande aucune configuration spécifique, il vous suffit simplement de la créer.
Vous devez ajouter cette variable dans la balise de votre pixel Facebook. Si vous ne souhaitez pas utiliser de balise personnalisée HTML pour y implémenter le script, vous pouvez utiliser la balise “Facebook Pixel” que vous trouverez dans la galerie de modèles.
<script>
fbq('track', 'Lead',
{eventID: '{{Event ID}}',
test_event_code: 'TEST65740'});
</script>
Vous pouvez également créer des balises plus simplement pour vos événements Facebook en utilisant un modèle de balise. Je vous conseille d’utiliser le modèle suivant qui est très simple d’utilisation :
Il vous faudra ensuite créer la balise et la configurer comme ceci :
Configurer les balises GA4 dans GTM côté client
Si ce n’est pas déjà le cas, créez une balise de configuration GA4.
Renseignez votre ID de mesure.
Cochez la case “Envoyer au conteneur de serveur” et ajoutez-y l’URL de votre conteneur de serveur obtenu lors de sa création. Cette étape permet d’envoyer les événements GA4 directement à votre serveur GTM.
Ajoutez également les différents champs suivants :
– event_id qui nous permettra de remonter l’id de l’événement
– transport_url pour envoyer les requêtes à votre conteneur GTM côté serveur
– first_party_collection doit renvoyer la valeur true seulement si vous respectez le RGPD et la politique de confidentialité liée aux cookies
– test_event_code : il s’agit du code obtenu dans Facebook Business Manager
Cette liste n’est bien sûr pas exhaustive et vous pouvez ajouter d’autres champs si vous le souhaitez.
A ce stade, si vous faites le test et que votre configuration est correcte, vous devriez voir remonter l’événement pageview dans votre Facebook Business Manager côté navigateur et côté serveur.
Mais avant de faire nos tests, j’aimerais vous montrer la configuration pour créer un événement avec l’API de conversion Facebook.
Pour cela, allez dans une de vos balises d’événement GA4 (ou créez-en une si ce n’est pas encore le cas). Nous allons ajouter des champs de la même manière que pour la balise de configuration GA4.
Ici, je vous montre l’exemple pour une soumission de formulaire.
Renseignez d’abord le nom de l’événement que vous souhaitez suivre. Veillez à utiliser la bonne nomenclature pour le nom de vos événements. Dans cet exemple, un événement de type “Lead” se nommera “generate_lead” pour GA4.
Vous pouvez consulter la liste des événements GA4 pour plus d’informations à ce sujet.
Ajoutez les champs transport_url, test_event_code et event_id comme précédemment.
Tests des événements côté serveur dans Facebook Business Manager
Vérifions maintenant l’événement dans notre Facebook Business Manager.
L’événement PageView apparaît bien deux fois : 1 événement reçu du navigateur et 1 événement reçu du serveur. Vous remarquerez également que l’ID de l’événement est bien le même.
Testons maintenant l’envoi de formulaire.
La prévisualisation du côté serveur remonte bien l’événement “generate_lead” que nous avons paramétré précédemment.
Dans Facebook Business Manager, l’événement Lead (ou Prospect) est bien présent. Vous remarquerez aussi que l’ID de l’événement est bien différent de celui de la page vue.
En cliquant sur l’événement, les détails de celui-ci s’affichent et on retrouve bien les deux paramètres que nous avons ajouté à notre balise Facebook. L’ID de l’événement Lead envoyé par le navigateur est bien le même que celui envoyé par le serveur.
A noter que Facebook privilégie les événements envoyés depuis le navigateur, donc celui envoyé par le serveur sera celui dédoublonné et supprimé par Facebook.
Conclusion
Si vos tests sont concluants, félicitations vos événements ne sont maintenant plus limités par les restrictions liées aux navigateurs.
Vous pouvez supprimer la variable “test_event_code” de toutes vos balises et n’oubliez pas de publier vos conteneurs GTM (serveur et client) pour que vos modifications soient mises en production ;).
Besoin d’aide pour votre Analytics ? N’hésitez pas à me contacter pour en discuter !
Bonjour,
J’ai testé votre configuration et cela marche très bien. par contre je ne remonte plus aucune data sur GA4 comme-ci la config API cannibalisait les TAG GA4.
J’avais bien ma config fonctionnelle GA4, je n’ai pas crée de nouvelles balises, j’ai juste rajouté les infos API dans ces mêmes balises.
Avez-vous une idée du problème ?
Merci
Bonjour,
Je n’ai jamais rencontré ce problème en paramétrant la config API de cette façon.
Avez-vous pu résoudre votre problème ?
Bonjour,
J’ai le même souci que vous, avez trouvé une solution ?
Par ailleurs, j’ai remarqué une note de 3,3/10 dans la qualité de correspondance des événements dans le gestionnaire d’évènement.
J’ai du rater une étape, mais je ne trouve pas comment augmenter ce score pour avoir une meilleure correspondance des évènements.
Bonjour,
Pour améliorer la correspondance des événements, il faut envoyer des informations comme le numéro de téléphone ou l’email via le pixel Facebook et via GA4.
Avec un event id et ces informations supplémentaires, la qualité de correspondance des événements s’améliorera.
Voici un article qui pourrait vous aider :
https://fr-fr.facebook.com/business/help/765081237991954?id=818859032317965
J’ai eu le même soucis, aucune donnée via GA4, il faut créer deux tags de configurations GA4 à partir du gtm web, un avec le transport url et un autre sans, car la donnée est envoyé au server seulement et non à GA4
Bonjour,
sommes nous vraiment obligés de créer une deuxième balise de configuration GA4 ? j’admets avoir eu un doute avec le message d’information accompagnant la case “Envoyer au conteneur de serveur” qui stipule :
———-
“Envoyez tous les événements associés à cette configuration GA4 à l’URL de conteneur de serveur spécifiée pour les utiliser avec un conteneur de serveur Tag Manager, plutôt que de les transmettre directement à Google Analytics”
———-
Le mot “plutôt” semble suggérer que tous les événements seront envoyés au serveur et plus du tout à analytics.
ça n’a pas posé de problèmes de dupliquer @Mehdi ? Et qu’en pensez vous Karen ?
Bonjour,
Le fait de cocher la case « Envoyer au conteneur de serveur » permet d’envoyer les données au serveur uniquement. Rien ne sera envoyé à GA4.
C’est pour cela que je suggère de dupliquer la balise de configuration GA4 sans cocher cette case pour transmettre les données à GA4 cette fois-ci.
J’espère que ça répond à votre question.
Oui, merci pour la confirmation 🙂 j’ai pu corriger le problème en effet avec la solution de dupliquer pour garder sa configuration ga4 existante intacte, on à bien les données remontées et au serveur et à analytics.
Petite note sur certains modèles de balise de la galerie qui ont changé de nom comme le “Conversions API Tag” mais il n’est pas compliqué de faire la correspondance et de retrouver les bons
Merci beaucoup pour ce tuto très clair il n’est pas toujours évident d’en trouver sur ces sujets et encore moins en français.
Très bon post !
Wow merci beaucoup Karen! C’est LE tuto que je cherchais désespérément pour paramétrer comme il faut. Super clair et facile à suivre!
Merci 🙂
Merci pour votre commentaire. Ravie d’avoir pu vous aider 🙂
Bonjour,
j’ai bien suivi tout le tuto, il me manque une clef :
– je ne peux pas lancer finaliser la configuration de l’intégration de l’api conversion via la fenêtre d’accueil du pixel.
Est ce que c’est important ?
Merci à vous
Bonjour,
Que voulez vous dire par “la fenêtre d’accueil du pixel” ?
Est-ce qu’il s’agit du token d’accès ?
Bonjour,
J’ai suivi toutes les étapes jusqu’à la recherche dans la galerie GTM de la variable “event id”, mais elle n’apparaît pas dans la liste comme dans votre vidéo. Du coup je suis bloqué à cette étape (j’ai bien revérifié plusieurs fois les étapes : Modèles –> Modèles de variable –> recherche dans la galerie).
(Par contre je remarque que la variable “Unique Event id” (par stap-io), qui apparait juste en dessous de “Event id” dans votre vidéo est bien présente dans la galerie.
Du coup, comment faire apparaître la variable “Event id” (par mbaersh) que vous indiquez dans votre vidéo?
Bonjour Karim,
La variable est à ajouter dans le conteneur GTM côté client. Est-ce que vous avez bien fait la recherche côté client ?
Avez-vous essayé de rechercher par le nom “mbaersch” ?
De mon côté j’ai testé sur plusieurs comptes la variable est bien dans la liste.
Bonjour Karen,
Merci pour ce tuto, as-tu déjà utilisé une solution Cloud différente de Google Cloud Platform? J’imagine que ça complexifie la mise en place?
Car j’ai des clients qui trouvent le tarif un peu élevé (120€/mois il me semble) pour de petits sites et souhaitent passer par d’autres solutions comme par exmple https://platform.sh/.
Merci.
Bonjour Maxime,
Je n’ai jamais utilisé d’autres solutions que Google Cloud Platform pour une intégration avec GTM.
Mais je ne pense pas que ça complexifie forcément l’installation mais chaque solution a ses spécificités, il faut se renseigner directement auprès du support.
C’est vrai que la mise en place du serveur à un coût mensuel, cette installation n’est pas forcément adaptée et pertinente pour les petits sites.
Perso je l’ai fait sur AWS pour un client qui avait deja son propre serveur ça lui coûte à peine une dizaine d’euros par mois
Bonjour et merci, mais j’ai un souci que d’autres ont apparemment rencontré.
Dès le moment ou j’envoi les infos de la balise au serveur GTM (soit en cochant la case soit sur l’événement avec transport_url), plus rien ne remonte sur Google Analytics.
Donc la fonction pour FB fonctionne, mais plus analytics.
Je vous ai envoyé un email par votre contact form resté sans réponse… Dommage. Je veux bien payer pour une session live pour résoudre ce problème.
Bonjour Frédéric, j’ai bien reçu votre mail du 11/12 et sachez que dans la mesure du possible aucun message n’est laissé sans réponse. Parfois le délai est juste un peu plus long en fonction de la période et de la charge de travail et/ou de la complexité de la question. Pour le coup vous cochez les 2 😅
Concernant le problème que vous rencontrez, ce type de configuration n’est pas évidente à mettre en place et demande beaucoup de manipulations et de tests. Dans votre mail vous me disiez avoir suivi un tuto en anglais donc effectivement peut être qu’il y à un paramètre manquant ou un mélange entre les deux tutos. Dans un premier temps, je vous conseillerai de reprendre point par point pour vérifier que tout soit ok au niveau de la configuration.
Si les évènements que vous avez paramétrés pour Facebook ne remontent plus dans ga4, vous pouvez essayer de recréer les balises spécifiquement pour ga4, ça fera doublon en termes de balises mais normalement ça vous permettra de les avoir dans Facebook et dans ga4.
Malheureusement pour l’instant je n’ai pas d’autres pistes. J’espère que ça pourra tout de même vous aider.
Bonjour Karen, dommage de ne pas m’avoir répondu par email, car du coup je n’ai même pas vu votre réponse à ce post. Je reviens dessus car je me remet dans cette config, que j’avais abandonné.
Bref, ce que je remarque. pour pouvoir faire fonctionner correctement tout ça, c’est qu’il faut effectivement doubler les balises.
J’ai donc fait une essai avec une balise GA4 avec toutes les infos des champs selon votre tuto + une balise GA4 avec aucun champ et la case décochée pour ne rien envoyer au serveur.
Cela fonctionne, j’ai bien les pages vues dédoublées dans les tests FB et mes infos remontent bien sur analytics.
Me restais à comprendre un autre point, les événements. Je remarque que je dois aussi doubler mes balises.
Dans un exemple simple de click email, j’ai donc une balise click_email-FB avec les champs transport_url, test_event_code et event_id et une autre balise click_email sans rien.
Car si je test avec ma balise click_email-FB avec mes champs uniquement, j’ai l’événement qui se déclenche bien côté serveur sur mes test FB, mais rien côté navigateur ni rien dans analytics. Il semble donc que dès qu’on utilise le champ transport_url, ça ne passe que sur le serveur. Eb copiant cette balise et en supprimant tous les champs (même event_id), cela fonctionne de tous les côtés, et j’ai bien mes événements dédoublé côté FB et je les vois côté analytics.
Ce qui me reste comme point ouvert, c’est que je ne vois pas ce que vient faire dans votre explication la balise avec adsmurai. Puisqu’on peut faire des événements via la balise GA4 event… Je me suis un peu mélangé les pinceaux avec ça puis actuellement je n’ai pas utilisé cette balise (adsmurai).
La dernière question étant l’histoire de la coche sur “envoyer les données au serveur”. Car dans le tuto en anglais que j’avais vu, il était stipulé que soit on utilisait la fonction cochée et on envoi tout au serveur, soit on utilise la transport_url et il faut le mettre dans chaque événement, mais pas les 2. Donc peut-être à tester, mais si on met la transport_url dans les événements je ne suis pas certain qu’il faille garder 2 balises GA4… Mais peut-être que mon cerveau fume un peu trop…
EDIT : Je me répond, mais il y a encore un truc qui ne joue pas avec ma config… Je reposterais si je trouve la bonne solution.
EDIT 2 : On y est !
Désolé, mais je post ici la solution qui fonctionne chez moi.
J’ai donc pu faire fonctionner le tout selon mon post plus haut. Par ccontre, pour les événements Facebook, j’ai donc créé des événements pour le pixel avec des balises de facebook pixel (facebookincubator). En ajoutant le {{Event ID}} dans “More setting” de chaque event. Ensuite, j’ai créé le GA4 event avec la balise standard, en incluant la transport_url et tous les autres champs.
Cela fonctionne, mais comme expliqué, pas pour analytics. Il faut donc créer une 3ème balise sans tous les champs pour que ça remonte à nouveau dans analytics.
Mais il faut faire attention à être patient, car le temps entre la mise en place de la balise et la visualisation correct des test sue Facebook prend parfois jusqu’à 15 minutes. C’est pour cela que parfois je pensais que ça ne marchait pas.
J’ai aussi testé la balise de adsmurai mais pour l’instant elle ne remonte que du côté navigateur…
Voilà voilà.
Bonjour Frédéric,
Merci pour votre retour et merci de partager vos tests ici qui pourront certainement aider d’autres personnes.
Effectivement il faut être patient avec Facebook car parfois la remontée des données peut prendre beaucoup de temps.
Mon article commence à dater un peu maintenant donc il n’est pas impossible qu’il ne soit plus tout à fait à jour.
Il faudrait que je prenne le temps de le réviser.
Bonne continuation !
Bonjour,
Est-ce que l’on est obligé d’avoir GTM Server Side pour installer Facebook API via GTM ?
Merci
Bonjour,
Ici je propose la configuration via GTM mais il y a d’autres méthodes que le GTM server side pour configurer Facebook API 🙂
Bonjour,
Le tuto est assez clair, j’aurais toutefois une interrogation sur le RGPD : l’utilisation du tag GA4 ne requiert il pas de soumettre à consentement GA4 + Facebook le tag facebook ?
Aussi, si le Data Privacy Framework (en place depuis cet été) qui autorise les transferts de données aux états unis est invalidé, cette manœuvre ne deviendra-t-elle pas tout bonnement illégale (depuis GTM du moins) ?
Bonjour Vincent,
Oui il faut effectivement conditionner les tags pour le consentement.
Concernant le Data Privacy Framework, je ne saurais pas répondre à cette question. Pour le moment en tout cas je n’ai pas encore trouvé de sources claires à ce sujet.
Bonjour merci pour le tuto:) j’ai une question au sujet du plugin Facebook qu’on a installé sur son site (woo commerce pour moi) est ce qu’on doit le supprimer ? Et du coup comment raccordé t on le catalogue produit à Facebook puisque tout est lié dans le plugin (pixel, catalogue..) merci beaucoup
Belle journée
Jessica
Bonjour,
Il faudra effectivement supprimer le plugin Facebook si vous souhaitez passer en configuration Server Side.
Pour ce qui est du catalogue produit, je ne connais pas spécifiquement le plugin dont vous parlez mais peut-être que vous avez la possibilité de le conserver seulement dans le but de lier le catalogue produit (sans la configuration avec le pixel).