Cookie Preference Centre
These cookies are required for the site to work and therefore can't be removed: Grav session cookie (necessary, cannot be removed).
Third-party tools used to monitor performance and improve the user experience: Google Analytics, Google Optimize.
Widgets added to the site to provide additional features: LinkedIn, Bitrix24.
Are you ok with optional cookies? They let us give you a better experience and improve the content we publish on this site.
Your cookie settings have been updated
Outils CRO gratuits
Des outils et procédures que j'utilise pour optimiser le revenu de mes clients.
Je suis spécialisé dans la conception et l'exécution de stratégies marketing de croissance.
Je travaille avec 2/3 clients à la fois, sur des durées de 3 à 6 mois. Mes tarifs - et les résultats - sont élevés (2500-5000€/mois).
Qui peut candidater ?
Les entreprises réalisant un CA en ligne supérieur à 1M/mois .
Comment candidater ?
Vous commencez en achetant un diagnostic de croissance :
1500 €
seulement 990 €
Google Tag Manager is an easy-to-use tool to manage and install tracking codes and marketing pixels.
Once up and running you can deploy many functionalities in minutes: live chat widget, AB testing tool, Google Ads conversion pixel, etc. The sky is the limit.
There are many good reasons why you should be using Google Tag Manager. Let's get to the point and name just three:
Let's dive in. If Google Tag Manager has already been implemented on your site, you can skip directly to step 3.
Skip directly to step 2 if you already have a Google Tag Manager account configured and a container set up for your site.
Visit Google Tag Manager's product page and click on "Start for free".
You'll be prompted to connect to an existing Google Account. If you don't have a Google account, go to the next instruction; if you do have a Google account, enter your email and password; you'll then be directed to the Google Tag Manager. Skip the next instruction.
If you don't have an account, click on "Create account" and follow the steps. You'll eventually be connected to Google Tag Manager.
Once you're logged into Google Tag Manager, click on "Create Account".
On the next page, enter the following information:
An account represents a company while a container represents an online asset such as a website. An account (= business) can contain several containers (= websites).
You'll then be asked to accept the terms of service. Check the box at the bottom and click the "yes" button in the top right corner of the page.
Congratulations, your Google Tag Manager account and the container for your site have been created. You should see the following screen:
This step requires access to your website's code. If you don't know how, you'll need to ask your developers to implement the Google Tag Manager snippet for you. You won't need their help to publish tags on your site after that though.
If you just went through step 1 of this guide, you should see a pop-up with the code snippets to add to your site. If so, skip directly to the next instruction.
If you don't see this pop-up however, proceed as follows:
Here is the code snippet:
<!-- Google Tag Manager -->
<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<!-- End Google Tag Manager -->
You need to place the code snippet as high as possible in the <head>
section of your site (between <head>
and </head>
). The higher the better: the higher the code is added, the sooner Google Tag Manager will load. You just need to copy-paste it; if you copy the code from the above snippet, don't forget to replace GTM-XXXXXXX
with your own Google Tag Manager container ID.
There are 3 ways to add Google Tag Manager to your Wordpress site:
I will explain how to proceed with the first method (with the plugin "Header, Footer and Post Injections"); the other two methods require editing your theme, and it's a good practice to keep your scripts independent from your theme (this way you don't have to re-do it all when you switch themes). Here is how you do it:
<script>
and </script>
tags; it should look like this:<script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');</script>
<script>
and </script>
tags; it should look like this:(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':
new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0],
j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=
'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
})(window,document,'script','dataLayer','GTM-XXXXXXX');
Here is the code snippet:
<!-- Google Tag Manager (noscript) -->
<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->
You need to place the code snippet just after the opening <body>
tag on your site. You just need to copy-paste it there.
<script>
and </script>
tags; it should look like this:<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=GTM-XXXXXXX"
height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
theme.liquid
<body>
tagThe best way to check if Google Tag Manager has been implemented correctly is to use the Chrome extension Tag Assistant. This extension will list all Google products tags added to your site and tell you if the implementation is correct. If there are configuration errors, it will tell you what the errors are and how to fix them.
So go ahead and install the extension. Once it is done, go to your site and click on the Tag Assistant extension in your browser's icon tray.
If the tag Google Tag Manager appears in green or blue, then you're good to go. If not then follow the instructions provided by the extension to fix it.
Let's add your first marketing pixel to Google Tag Manager. I will use Google Optimize as an example.
Open your Google Tag Manager container. In the left-hand side vertical menu, click on "Tags". You should then see a blue button "New" on the top right corner. Click there.
If you don't see the "New" button or if it is greyed out it means you don't have enough permissions to add a tag, in which case you'll need to contact the owner of the Google Tag Manager account to obtain the right access.
In the side drawer that opens, change the default name "Untitled Tag" to a name that describes the tag you are creating (or its function). In our case we will just call it "Google Optimize":
Click on "Choose a tag type to begin setup...". Another side drawer will open. In the featured section at the top you'll find a tag type called "Google Optimize". Click it.
Once you've selected the tag type you'll see configuration options appear. They are different for each tag type.
In the case of Google Optimize we need to do the following:
allowLinker
to TRUE
for the Google Analytics variable in "More Settings" > "Fields to Set" > "Add Field".Click on "Select a trigger to make this tag fire...". A side drawer will open, listing all available triggers. If you just created your Google Tag Manager container, then you should only see 1 available trigger: "All Pages".
If you don't wish to publish Google Optimize on all pages, you can create a new trigger by clicking on the plus sign in the top right corner.
Click on "All Pages" to select this trigger.
Finally click on "Save" to save your tag. You should see it appear in the list of tags:
Now that you've created your tag, let's make sure it is triggered correctly before publishing it on your site. We can do so using Google Tag Manager's preview feature.
Click on the "Preview" button in the top right corner of the page:
Open another tab in your browser and visit your site. Now that the preview mode has been activated in Google Tag Manager, you should see a panel open at the bottom of the page:
By default it opens the "Summary" tab, which shows you which tag were fired. You should see the tag "Google Optimize" under "Tags Fired".
Now that you are sure the tag is probably fired you can publish it on your live site.
Click on "Submit" in the top right corner of the page:
You are about to publish a "version": it contains all the tags, triggers, variables you created or edited since the last published version. Just give it a descriptive name (for example "Adding Google Optimize") then click "Publish".
You should now see a final screen confirming your tag was indeed published:
Congratulations on publishing your first tag! You'll now be able to harness the power of Google Tag Manager to publish new tags in mere minutes.
© Copyright 2023 Thomas Porhel from HappyWeb®