Skip to main content
Logo

Add Google Tag Manager to your site

This article takes you though the process of adding the Google Tag manager code to your site using master pages or custom code in a base template.

To use Google Tag Manager with your Contensis published website you'll need to add the tracking code to your templates provided in the Google Tag Manager interface. Depending on the publishing method you use, you can do this in a Master Page template, or by using custom code to add it to your base template.

Using either of these methods, provides a way for your marketing team to add relevant marketing scripts using Google Tag Manager to your site without the need to rely on your development team.

Master Pages

You'll need to edit an existing Master Page template or create a new one.

Default master page template

Your template will look something like the default in the following example - comments have been added where the Google Tag Manager code is expected.

<%@ Master Language="VB" Inherits="CMS_API.WebUI.WebControls.MasterPages.MasterTemplate" %>
<!--mce:protected <contensis:DocType runat=\"server\"/>-->
<html>
<head runat="server">
    <!--mce:protected <contensis:Charset runat=\"server\"/>-->
    <title><!--mce:protected <asp:Literal ID=\"TitleBar\" runat=\"server\"/>--></title>
    <!--mce:protected <contensis:CMS_Placeholder ID=\"HtmlHeader\" tagtorender=\"none\" runat=\"server\"/>-->
    <!--mce:protected <asp:ContentPlaceHolder ID=\"MetaData\" runat=\"server\"/>-->
    <!--mce:protected <contensis:StylesheetCollection ID=\"StyleSheetCollection\" runat=\"server\"/>-->
    <!--mce:protected <asp:Literal ID=\"ContensisInternalHeader\" runat=\"server\"/>-->
    <!--mce:protected <asp:Literal ID=\"ContensisHeader\" runat=\"server\"/>-->
    
    <!-- Add Google Tag Manager Head Code Here -->
    
</head>
<body>
    <!-- Add Google Tag Manager Body Code Here -->
    
    <form ID="form1" runat="server">
        <!--mce:protected <asp:ContentPlaceHolder ID=\"PageContent\" runat=\"server\">-->
            Page Content
        <!--mce:protected </asp:ContentPlaceHolder>-->
    </form>
</body>
</html>

Note: Read our in depth article on Master Page templates for more information on each property. 

Master Page template with tag manager code snippets applied

Google Tag Manager provides two code snippets, one snippet to be placed as high in the <head> element as possible, and another to be included straight after the opening <body> tag.

The example shows these code snippets included as part of the Master Page template. You'll need to replace YOUR-GOOGLE-TAG-MANAGER-ID withthe ContainerID provided in the Google Tag Manager interface.

<%@ Master Language="VB" Inherits="CMS_API.WebUI.WebControls.MasterPages.MasterTemplate" %>
<!--mce:protected <contensis:DocType runat=\"server\"/>-->
<html>
<head runat="server">
    <!--mce:protected <contensis:Charset runat=\"server\"/>-->
    <title><!--mce:protected <asp:Literal ID=\"TitleBar\" runat=\"server\"/>--></title>
    <!--mce:protected <contensis:CMS_Placeholder ID=\"HtmlHeader\" tagtorender=\"none\" runat=\"server\"/>-->
    <!--mce:protected <asp:ContentPlaceHolder ID=\"MetaData\" runat=\"server\"/>-->
    <!--mce:protected <contensis:StylesheetCollection ID=\"StyleSheetCollection\" runat=\"server\"/>-->
    <!--mce:protected <asp:Literal ID=\"ContensisInternalHeader\" runat=\"server\"/>-->
    <!--mce:protected <asp:Literal ID=\"ContensisHeader\" runat=\"server\"/>-->
    
	<!-- 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','YOUR-GOOGLE-TAG-MANAGER-ID');</script>
	<!-- End Google Tag Manager -->
   
</head>
<body>
	<!-- Google Tag Manager (noscript) -->
	<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=YOUR-GOOGLE-TAG-MANAGER-ID"
	height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
	<!-- End Google Tag Manager (noscript) -->
    
    <form ID="form1" runat="server">
        <!--mce:protected <asp:ContentPlaceHolder ID=\"PageContent\" runat=\"server\">-->
            Page Content
        <!--mce:protected </asp:ContentPlaceHolder>-->
    </form>
</body>
</html>

Note: This example is just for reference. Google regularly update their code snippets, so we recommend that you copy and paste the latest code they provide.

Custom code (in base template)

If you are not using Master Pages, you can set the Google Tag Manager code snippet using custom code in your base template.

Add <head> code snippet to custom code

  1. Edit the template you want to apply the Google Tag Manager code to.
  2. Select the Custom Code tab and ensure that the Page Load option is set in the Custom Code: dropdown menu.
  3. Enter the following code to be included in the <head>. Replace YOUR-GOOGLE-TAG-MANAGER-ID withthe Container ID provided in the tag manager interface.
ContensisHeader.Text += "<scr"+"ipt>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start':" & Environment.Newline
ContensisHeader.Text += "new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0]," & Environment.Newline
ContensisHeader.Text += "j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src=" & Environment.Newline
ContensisHeader.Text += "'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f);" & Environment.Newline
ContensisHeader.Text += "})(window,document,'script','dataLayer','YOUR-GOOGLE-TAG-MANAGER-ID');</scr"+"ipt>" & Environment.Newline

Add <noscript> snippet to the base template

In addition to adding the snippet to the <head> you'll also need to add the <noscript> codesnippet at the beginning of your base template. Again you'll need to replace YOUR-GOOGLE-TAG-MANAGER-ID withthe Container ID provided in the Google Tag Manager interface.

<!-- Google Tag Manager (noscript) -->
	<noscript><iframe src="https://www.googletagmanager.com/ns.html?id=YOUR-GOOGLE-TAG-MANAGER-ID"
	height="0" width="0" style="display:none;visibility:hidden"></iframe></noscript>
<!-- End Google Tag Manager (noscript) -->

Once these changes have been made to the base template, publish it to update your site.

Updated: 03/07/2017