Configurez un événement Google Analytics 4 dans Google Tag Manager pour suivre les envois de formulaires Webflow, puis réutilisez le même déclencheur pour les conversions de leads dans vos plateformes publicitaires.
**Mise à jour** Nous avons ajouté du contenu vidéo à cet article pour vous aider à suivre plus facilement, et pour vous montrer des méthodes plus avancées que celles décrites ci-dessous, notamment pour ne suivre que certains formulaires ou plusieurs formulaires séparément. Abonnez-vous à la chaîne pour ne rien manquer de nos derniers tutoriels et de nos actualités.
Dans cet article, nous allons configurer un événement Google Analytics 4 (GA4) dans Google Tag Manager pour suivre les envois de formulaires Webflow, puis le marquer comme événement clé (ce que GA4 appelait auparavant une conversion) afin de le retrouver dans vos rapports.
Selon les réglages de votre formulaire dans Webflow, il existe en gros deux moyens simples de suivre un envoi. Si vous avez défini une URL de redirection pour votre formulaire, vous pouvez suivre les visites de l'URL de destination comme une conversion. Sinon, vous pouvez suivre l'événement d'envoi lui-même, et c'est ce que nous allons faire.
Ce sera un article assez rapide, mais particulièrement utile, car ce déclencheur et cet événement servent à bien plus qu'à compter les envois de formulaires dans Google Analytics. Milk Moon Studio est un petit studio Webflow orienté design : nous sommes des designers Webflow, nous aimons que les choses restent simples, et si vous utilisez Google Ads, Facebook Ads ou d'autres plateformes et souhaitez diffuser des publicités optimisées pour les conversions de leads, vous pouvez utiliser le déclencheur que nous allons créer ici pour suivre les leads générés par vos annonces. Cela aide non seulement votre plateforme publicitaire à optimiser les conversions, mais vous permet aussi de voir le coût par conversion de vos campagnes, tout en gardant votre projet Webflow propre.
Nous ne verrons pas ici comment configurer Google Tag Manager, Google Analytics ni comment les ajouter à votre projet Webflow. Pour cela, consultez nos articles précédents :
Installer Google Tag Manager et Google Analytics dans Webflow : partie 1
Installer Google Tag Manager et Google Analytics dans Webflow : partie 2
Étape 1 : créer votre balise
Rendez-vous dans Tag Manager, ouvrez le conteneur de votre projet Webflow, puis cliquez sur Variables et Configurer.
Activez-les toutes : vous n'en aurez pas besoin de toutes, mais cela simplifie la création d'autres déclencheurs par la suite.
Allez dans Balises et cliquez sur Nouvelle.
Donnez un nom à votre balise et choisissez la balise d'événement GA4.
Sélectionnez maintenant la balise de configuration (Tag Manager l'appelle désormais la balise Google) que vous avez créée dans notre autre article. C'est le compte GA4 auquel vous souhaitez envoyer l'événement. Donnez un nom à l'événement (c'est ce qui s'affichera dans Google Analytics). Enfin, si vous souhaitez créer des audiences dans GA, vous pouvez ajouter un paramètre utilisateur (comme lead_submit ou ce que vous voulez) dans les propriétés utilisateur.
Vient maintenant l'étape importante : le déclencheur. Elle est importante car ce déclencheur ne servira pas seulement à GA, mais aussi à toutes les autres balises de lead que vous voudrez créer pour des plateformes comme Facebook ou Pinterest.
Cliquez sur Déclenchement, puis sur le +
Donnez un nom à votre déclencheur et choisissez le déclencheur Envoi de formulaire dans Type de déclencheur.
Vous pourriez vous arrêter ici, mais que faire si votre projet contient plus d'un formulaire ? Nous allons affiner le réglage pour que le déclencheur ne s'active que sur les formulaires de la page de contact. Vous pourriez utiliser d'autres variables comme Click Text, etc., mais c'est un sujet pour un autre article, et on peut vite devenir très précis.
Sélectionnons Certains formulaires, puis Click URL, Contient, et l'URL de la page de contact.
La configuration de la balise est terminée : cliquez sur Envoyer, Publier, puis testez en cliquant sur Aperçu.
Saisissez votre URL, puis cliquez sur Connecter. Vous disposez alors de l'onglet Aperçu et de l'onglet de votre site. Rendez-vous sur votre formulaire de contact, remplissez-le et envoyez-le, puis revenez à l'onglet Aperçu pour vérifier que tout se déclenche correctement.
Et voici notre balise.
Regardons cela de plus près en cliquant sur la balise.
Nous voyons ici les filtres de déclenchement que nous avons sélectionnés, l'événement d'envoi de formulaire et la Click URL de la page de contact.
Vous pouvez maintenant vous rendre dans Google Analytics. Vous n'y verrez encore rien, mais dès que les événements commencent à apparaître (comptez un jour), allez dans Événements dans GA4 et cochez le bouton de conversion à côté de l'événement d'envoi du formulaire de contact pour qu'il apparaisse dans les conversions.
Et voilà, c'est terminé ! Félicitations. Nous verrons dans un autre article comment réutiliser ce déclencheur pour les événements de lead dans vos plateformes publicitaires.
Petite précision de vocabulaire : Google a depuis renommé les conversions de GA4 en événements clés. Là où nous disons de cocher le bouton de conversion, cherchez donc l'option pour marquer l'événement comme événement clé. Le résultat est le même. Si vous n'êtes pas encore à l'aise avec le fonctionnement des événements, notre article sur le suivi des événements dans GA4 avec Tag Manager vous explique les bases, et la même logique de déclencheur fonctionne pour le suivi des clics sur les boutons.
Si Tag Manager ralentit vos pages, jetez un œil à comment retarder vos balises Tag Manager, et si vous vous demandez pourquoi nous l'utilisons, nous expliquons pourquoi Google Tag Manager vaut la peine d'être utilisé dans Webflow. Vous pouvez aussi charger GA4 via Cloudflare Zaraz au lieu de Tag Manager.
Questions fréquentes
Comment suivre l'envoi d'un formulaire Webflow dans Google Analytics 4 ?
Créez un déclencheur Envoi de formulaire dans Google Tag Manager, utilisez-le pour activer une balise d'événement GA4, puis marquez cet événement comme événement clé dans GA4. Les étapes ci-dessus détaillent chaque partie.
Ai-je besoin d'une redirection ou d'une page de remerciement pour suivre les envois de formulaires Webflow ?
Non. Si votre formulaire redirige vers une URL de destination, vous pouvez suivre les visites de cette page comme une conversion, mais le déclencheur Envoi de formulaire suit l'envoi lui-même : il fonctionne donc sans redirection.
Quelle est la différence entre les conversions et les événements clés dans GA4 ?
Dans GA4, ce qu'on appelait auparavant une conversion s'appelle désormais un événement clé. La documentation d'aide de Google indique que « les événements qui mesurent les actions importantes pour la réussite de votre activité s'appellent désormais des « événements clés » », le terme de conversion étant réservé aux actions qui mesurent et optimisent vos campagnes Google Ads.
Combien de temps faut-il avant que mon événement d'envoi de formulaire apparaisse dans Google Analytics ?
Comptez environ un jour. L'événement n'apparaîtra pas juste après la publication : testez donc d'abord avec le mode Aperçu de Tag Manager, puis consultez Événements dans GA4 le lendemain.
Puis-je réutiliser le déclencheur de formulaire pour Facebook, LinkedIn ou Google Ads ?
Oui. Le même déclencheur peut activer des balises de lead sur d'autres plateformes publicitaires, ce qui leur permet d'optimiser pour les conversions de leads et vous montre le coût par conversion de vos campagnes.
Posez vos questions dans les commentaires si vous êtes bloqué, et n'oubliez pas de consulter la section Tutoriels de notre blog pour d'autres guides.
