Speeding Things Up With Google Tag Manager

Have you ever had a situation where you were so excited to do something on your website and then you were told to wait? Usually this was a developer or someone in IT. This often happened to us when trying to install simple code on a website. By simple, I mean code snippets you use for analyzing and monitoring your site. Believe it or not, Google may have a “Win-Win” solution called Google Tag Manager (GTM) that appeases marketing, IT and site owners. You can use it for more than Google products.

The word “tag” may confuse you at first. These “tags” are different from what many of us use to classify items like web posts, photos or your Evernote stuff. Google defines tags as “tiny bits of website code that let you measure traffic and visitor behavior, understand the impact of online advertising and social channels, use remarketing and audience targeting, test and improve your site, and more.”

Chances are you already have some tags on your site in the <HEAD> section or closing BODY section of your web pages. Some common ones we’ve seen include:

  • analytics code
  • conversion tracking code
  • retargeting code
  • bug tracking code
  • social analytics code

Faster Pages for Users

The first difference you may experience after installing GTM is speed. The service is faster for your users than if you were to load the scripts in the usual synchronous mode. When scripts load in this manner, they can delay other page elements until the script is done. This is like being at a one-lane toll booth, and all the tractor trailer trucks are ahead of you. You’ve probably seen this effect on various websites as the browser status bar will say something like “waiting for”.

Google Tag Manager minimizes this problem because it asynchronously loads the code snippets. It’s like having dedicated lanes for those tractor trailer trucks. They also do some other performance tweaks with intelligent caching.

Another benefit to Google’s Tag Manager is it gives us a way to test and implement code changes without bothering IT folks. This has the advantage of freeing the IT department so they can work on more productive and fun things. The IT folks will also be happy to know that there are safety measures.

In the screen snap below, you can see that Google has allowed for:

  1. Versioning
  2. Previewing and testing
  3. Restoring (if needed)
Google Tag Manager safety features
GTM VERSIONING & PREVIEWS

Tag Examples

Some of you may be thinking how this will work if you’re not a programmer. The key is in Google’s structure. Instead of getting someone to edit numerous web pages, you just need to get someone to install the initial JavaScript snippet. You might think of this as a self-service solution after the initial setup and analysis

In the screen snap below, you can see where I’ve set up 4 different tags. Some tags such as Google Analytics are predefined. The same is true for Google AdWords and doubleClick.

Google Tag Manager
GOOGLE TAG MANAGER EXAMPLES

You’re not limited to just using Google services. As you see below, I have a Custom HTML tag to add a snippet of code for BugHerd.com, which is a 3rd party service that I use.

Example of code snippet in tag manager
GOOGLE TAG SNIPPET

As these examples show, GTM can be used for many services, but not all. You might have some code which needs to be placed in specific sections. As example, I used to use Torbit to gather info regarding web performance, and it requires the code get loaded in the <HEAD> section for accurate timing.

Location Is Everything

One cautionary note is to make sure you put the code Google provides you under the <BODY> section. I know many CMS systems have predefined areas where you can put in code in the HEAD section or towards the end, but these areas won’t work 100% of the time.

Google Tag Manager uses an IFrame to handle situations where the visitor’s browser isn’t using java script. However, not all web browsers work well with iFrames in the <HEAD> section.

Chances are someone may have created a solution for your content management system (CMS) if you don’t want to edit your template or pages. For example, this site uses WordPress, and I was able to leverage code from BlogSynthesis. I followed the instructions to back up one of my theme files and added my specific code into the appropriate placeholder.

Regardless of the size of your site, you should take a look at Google Tag Manager. If you’re just starting out with your website, now is the time to let your developers know you need it. And if you’ve got an existing site and IT department, talk to those folks about how implementing the tool will make it easier for them. Google even provides a details sheet for technical people.

More Info: http://www.google.com/tagmanager/features.html

Cost: Free

1 thought on “Speeding Things Up With Google Tag Manager”

  1. FYI, there is a free Google Chrome extension that helps you troubleshoot issues with Google Tag manager. It tells you which tags it found and offers suggestions. I shortened the link with Bit.ly: http://bit.ly/144NqPi

Comments are closed.