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

tools-icon Outils CRO gratuits

Des outils et procédures que j'utilise pour optimiser le revenu de mes clients.

ou
Je respecte votre confidentialité Vous devrez confirmer votre adresse email pour valider que la requête provient bien de vous. Je ne vous spammerais pas et je ne partagerai pas vos données avec qui que ce soit. Merci de votre confiance

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 €

- 33%
Diagnostic CRO à

seulement 990 €

Google Tag Manager tutorial: 5 steps to publish marketing pixels

Temps de lecture: 9 minutes, 5 secondes

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:

  1. Once Google Tag Manager has been implemented you no longer need to wait on developers: your development team is always busy so if this is something you can take off their plate and implement without delay, I say it's a win-win
  2. It's easy to use, you can get it done with a few clicks; the process is quite simple: add your tag, decide when to trigger it, test and publish (I'll show you how in a sec)
  3. You can preview in a live environment before pushing live: you can remove the guesswork and make sure it works perfectly before implementing on your live site

Let's dive in. If Google Tag Manager has already been implemented on your site, you can skip directly to step 3.

Step 1: create a Google Tag Manager account

Skip directly to step 2 if you already have a Google Tag Manager account configured and a container set up for your site.

1-1. Visit Google Tag Manager product page

Visit Google Tag Manager's product page and click on "Start for free".

Google Tag Manager tutorial: step 1 - Start

1-2. Connect to your Google account

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.

Google Tag Manager tutorial: step 1 - Sign in

1-2bis. Create a Google account

If you don't have an account, click on "Create account" and follow the steps. You'll eventually be connected to Google Tag Manager.

Google Tag Manager tutorial: step 1 - Create account

1-3. Create a Google Tag Manager account

Once you're logged into Google Tag Manager, click on "Create Account".

Google Tag Manager tutorial: step 1 - Set up account

1-4. Configure your first container

On the next page, enter the following information:

  • Account name: the name of your company
  • Country: your country
  • Container name: the name of your website; I recommend you use your site's domain name so you don't get mixed up in case your company manages several sites

An account represents a company while a container represents an online asset such as a website. An account (= business) can contain several containers (= websites).

Google Tag Manager tutorial: step 1 - Create container

1-5. Accept the terms of service

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.

Google Tag Manager tutorial: step 1 - Accept terms

1-6. Your account and container are configured (-:

Congratulations, your Google Tag Manager account and the container for your site have been created. You should see the following screen:

Google Tag Manager tutorial: step 1 - Container created

Step 2: add the Google Tag Manager snippets to your site

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.

2-1. Get the code snippets

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:

  1. In the top horizontal navigation, click on "Admin"
  2. In the page that opens, click on "Install Google Tag Manager"

Google Tag Manager tutorial: step 2 - Access snippets

2-2. Add the first snippet

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.

How to add the first Google Tag Manager snippet in Wordpress

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:

  1. Install the plugin Head, Footer and Post Injections
  2. In the left sidebar navigation click on "Settings" then "Insert Headers and Footers"
  3. Copy the snippet into the field "Scripts in Header" with the <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>
  1. Click "Save"

Google Tag Manager tutorial: step 2 - Add to Wordpress

How to add the first Google Tag Manager snippet in Shopify

  1. In the left sidebar navigation click on "Online Store" then "Preferences"
  2. In the "Google Analytics" section, you'll either see a "Additional Google Analytics JavaScript" field or a link "Add custom Javascript to Google Analytics" (you need to click this link)
  3. Copy the snippet into the field "Additional Google Analytics JavaScript" and remove the <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');
  1. Click "Save"

Google Tag Manager tutorial: step 2 - Add to Shopify

2-3. Add the second snippet

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.

How to add the second Google Tag Manager snippet in Wordpress

  1. Copy the snippet into the field "Scripts in Body" with the <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>
  1. Click "Save"

How to add the second Google Tag Manager snippet in Shopify

  1. In the left sidebar navigation click on "Online Store" then "Themes"
  2. In the "Live theme" section, click on the "Actions" button
  3. In the dropdown menu that appears, click on "Edit code"
  4. In the second sidebar, click on the file theme.liquid
  5. Place the code just after the <body> tag
  6. Click "Save"

Google Tag Manager tutorial: step 2 - Add to Shopify

2-4. Check with chrome extension

The 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.

Google Tag Manager tutorial: step 2 - Check with Tag Assistant

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.

Step 3: implement your first marketing pixel

Let's add your first marketing pixel to Google Tag Manager. I will use Google Optimize as an example.

3-1. Create a new tag

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.

Google Tag Manager tutorial: step 3 - Create new tag

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.

3-2. Pick a name for the tag

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":

Google Tag Manager tutorial: step 3 - Pick a name

3-3. Choose a tag type

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.

Google Tag Manager tutorial: step 3 - Select tag type

3-4. Set up the tag type

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:

  1. Fill out the ID of our Google Optimize container; if you don't already have a Google Optimize account you'll need to create one to get a container ID from Google Optimize.
  2. Pick a Google Analytics variable; if one doesn't exist yet you'll need to select "New variable..." then indicate your Google Analytics property ID; don't forget to set allowLinker to TRUE for the Google Analytics variable in "More Settings" > "Fields to Set" > "Add Field".

Google Tag Manager tutorial: step 3 - Configure tag type

3-5. Select the trigger

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.

Google Tag Manager tutorial: step 3 - Select trigger

Finally click on "Save" to save your tag. You should see it appear in the list of tags:

Google Tag Manager tutorial: step 3 - Tag added

Step 4: Preview your changes

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.

4-1. Enter preview mode

Click on the "Preview" button in the top right corner of the page:

Google Tag Manager tutorial: step 4 - Preview tag

4.2. Confirm tag firing on your site

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:

Google Tag Manager tutorial: step 4 - Visite site

By default it opens the "Summary" tab, which shows you which tag were fired. You should see the tag "Google Optimize" under "Tags Fired".

Step 5: Publish

Now that you are sure the tag is probably fired you can publish it on your live site.

5.1. Submit your tag

Click on "Submit" in the top right corner of the page:

Google Tag Manager tutorial: step 5 - Submit tag

5.2. Publish your tag

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".

Google Tag Manager tutorial: step 5 - Publish tag

You should now see a final screen confirming your tag was indeed published:

Google Tag Manager tutorial: step 5 - Tag 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.