Badge Webflow Award Winner 2023

Integrate the Google Tag Manager into your Webflow site (new documentation)

Guide to integrating Google Tag Manager code into your Webflow site

Published on 
5/1/2022
-
Amended on 
24/3/2023
-
5 min
Computer screen with Google Tag Manager logo and Webflow hashtag Tuto

If you use several tracking tools, analytics or even a cookie solution like Axeptio on your website, it can be useful to group them all in a single piece of code with the Google Tag Manager.

In this guided tutorial we will guide you to integrate a Google Tag manager on your Webflow website in just a few minutes.

1. Open the "Google Developers" documentation

https://developers.google.com/tag-platform/tag-manager/web

In this documentation you will find the codes to copy and paste to install the GTM in your project (compatible with Wix, shopify, Wordpress, Webflow etc..)

2. Retrieve your tracking code

Your Google Tag Manager ID is in the format: GTM-XXXXXX

You can retrieve it from your Google Tag Manager "Workspace

3. Integration of the code in Webflow

L'ajout de Google Tag Manager est un processus en deux étapes. L'étape 1 consiste à ajouter le code de suivi à tous les éléments "Head" de votre site via la section "Custom Code" dans les paramètres de Webflow sous l'onglet "Project Settings > Custom Code", puis l'étape 2 consiste à ajouter le code de suivi à toutes les pages de votre site via un élément <!-- fs-richtext-ignore --><embed>.

3.1 Integration into your Head Code

Integration of GTM tracking code into Webflow head code

⚠️ Attention: Remember to personalise the GTM-XXX with your GTM ID e.g. GTM-12345

3.2. Intégration avant <!-- fs-richtext-ignore --><body>

Integration of the Google tag Manager embed in Webflow

Une fois l'embed intégré, placer le ensuite le plus haut possible dans votre navigator. Idéalement, juste après votre balise <!-- fs-richtext-ignore --><body>.

To speed up deployment and simplify the management of the tag, I encourage you to transform this embedded element into a symbol, to easily duplicate it on all the pages of your website!

How to create and use a symbol in Webflow? (Youtube Video Tutorial)

Congratulations, you have installed your

(If you don't have access to the designer mode of your Webflow project, ask your developer). You can now follow all the analytics of your website and centralize all your integrations with your Google Tag manager!

Ready to take your website to the next level?

Improve your online visibility thanks to Digidop's experience, excellence and reactivity!

Stay in touch with Digidop news!