Google Tag Manager on Blogger: Install Guide | OpsBlu Docs

Google Tag Manager on Blogger: Install Guide

How to install and configure Google Tag Manager on Blogger. Covers installation method, container setup, verification, and Blogger-specific considerations.

For general GTM concepts, see Google Tag Manager Overview

Overview

Blogger allows direct HTML editing of your theme, giving full control over where GTM is placed.

Prerequisites

Installation

Where to Add GTM Code

Theme → Edit HTML. Find <head> and add the head snippet after it. Find <body (the opening body tag, which may have attributes) and add the noscript snippet immediately after the closing >.

GTM Head Snippet

Add this in the <head> section:

<!-- 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 -->

GTM Body Snippet

Add this immediately after the opening <body> tag:

<!-- 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) -->

Replace GTM-XXXXXXX with your actual Container ID in both snippets.

Blogger-Specific Considerations

Blogger's template editor uses XML syntax. The GTM JavaScript snippet will work inside <script> tags, but the template parser may flag errors on && characters. If so, replace && with &amp;&amp; in the noscript <iframe> URL (not in the JavaScript).

Template System

Blogger uses Blogger XML template with <b:section> and <b:widget> tags. When editing templates directly, note that the GTM JavaScript snippet (inside <script> tags) will not conflict with the template engine's syntax.

Verification

After installation, verify GTM is working:

  1. GTM Preview Mode — In GTM, click Preview, enter your site URL, and verify the container loads.
  2. Browser Console — Open DevTools (F12) and run console.log(window.google_tag_manager). You should see an object (not undefined).
  3. Network TabFilter for googletagmanager.com and verify gtm.js loads with a 200 response.
  4. Data Layer Check — Run console.log(window.dataLayer) to verify the data layer array exists.

Next Steps