0
votes

How do I have to add a Google Tag Manager code on a Typo3 website?

I've tried to install the only available Google Tag Manager extension, but it wrecked my installation. (Fortunately I've fixed it with some help from here)

Now I am looking to add the code in a typo3 template page or something like that. The goal is that the code must be visible on all pages of that website.

(I am completely new to Typo3, so a step by step guide would be awesome)

2
Normally, you should prove the efforts you did yourself to solve the problem. So tell us which steps you took and how it wrecked your installation. - lorenz
Hi lorenz. The answer to the wrecked installation was answered in another thread: stackoverflow.com/questions/19478248/… . My information about it is only here to make clear that I won't try another extension anymore. This question here is about the Google Tag Manager. - AleV

2 Answers

3
votes

So I've found the answer to my question. I thought it would take me much longer because configuring TYPO3 is a bit cryptic for a newbie like me.

step 1. open the TYPO3 admin interface
step 2: in "Template" open the root template and choose to edit the "Setup" part. A sort of text editor will open.
step 3: Somewhere in that text you have to add this

page.headerData.999 = TEXT
page.headerData.999.value(
# add your tracking code here
)

Make sure to exchange the line "# add your tracking code here" with your tracking code. I have added this code just below the [global] tag in that config file.
step 4: Hit the save button. Now your tracking code should show up on all pages of your TYPO3 installation.

Additionally it's also easy to add the noscript tag (as mentioned in Google Tag Manager's quickstart guide immediately after the opening <body> tag:

page.1 = TEXT
page.1.value (
    # add your noscript-tracking code here
)
1
votes

Faced the same issue today. We did not want to use the extension so we used the method below.

Google recommends putting the tag manager right after the opening tag. From your code it seems like you are adding the tag to the page instead.

To add it to the body of your page go to your main template file and a market using "###MARKERNAME###".

e.g.

<div id="container" class="home">
   <div id="google-tagmanager">
     ###TAGMAN###
  </div> 

Then go to Template > Templates > Main page template (PAGE) > Setup. Add the marker and its injected value to the page object

# GOOGLE TAG MANAGER     
marks.TAGMAN = TEXT    
marks.TAGMAN =< lib.gtmContainer

Finally, add lib.gtmContainer to your Standard Page Parts (LIB).

lib.gtmContainer = TEXT
lib.gtmContainer.value (

  <noscript><iframe src="//www.googletagmanager.com/ns.html?id=GTM-XXXX" height="0"              width="0" style="display:none;visibility:hidden"></iframe></noscript>  
  <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=
 '//www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);
  })(window,document,'script','dataLayer','GTM-XXXXX');</script>
  )

This seemed to work well for us. Hope it helps!