Don’t wait until you urgently need a new tag to discover you also need your developers. Put the right infrastructure in place and reap the full benefits of Google Tag Manager.

Google Tag Manager is so easy to use, you can start adding tags to a site as soon as the developers put up the GTM container code. To make the most of it, though, you will need your developers’ help.

Some information should not (or cannot) be hard-coded into the tags, because it depends on each visitor’s behavior on your site. What did the visitor buy? What articles did they read? What videos did they watch? What forms did they complete? I could go on (and do, below).

Your developers can pull information from the back-end of your site and make it available on the page. They can also prepare various page elements to work with Google Tag Manager’s listeners, rules, and macros. It all means smoother sailing for you when you want to add tags later.

Follow this checklist to prep your site for Google Tag Manager, and you’ll be ready for almost any tagging request. You’ll be the hero who always knows where your towel is.

Preload the data layer

1. Get familiar with the data layer. If you don’t already know about the object called the data layer, learn why you want one, what it looks like, and how Google Tag Manager uses it. Read my blog post for an intro to the data layer.

3. Check your URLs. In Tag Manager, you write rules to fire tags on different pages according to their URLs. Consider adding page template names to the data layer for easier rule-writing, especially if your URLs are hard to read.

1

2

3

4

5

<script type="text/javascript">

dataLayer=[{

'pageTemplate':'BrandPage'

}];

</script>

We’ll get back to the data layer in a moment. First, take a look at all the places a visitor can click or interact with your site.

Review forms and clickable elements

Google Tag Manager can listen for clicks on links, buttons, and form submits with auto-event tracking. But there’s “automatic” and then there’s “automatic plus” a.k.a. making your life easier with a little advance planning.

4. Add IDs to every important element. I can’t emphasize enough how much time you will save implementing tags when you can refer precisely to the elements you want to track.

5. Use the data- prefix. If you can’t change existing IDs, add “data-id=xyz” to elements you need to identify for tracking. Extend the data- prefix to any attribute, not just IDs.

1

2

3

4

5

<div data-id="cta">

<ahref="/request-info">Get your free brochure</a>

<ahref="/live-chat">Chat with us</a>

<ahref="/video/12gz65hk"data-title="Prospect Video">Watch video</a>

</div>

6. Watch out for “return false”. If any clickable elements use jQuery’s “return false”, change it to “event.preventDefault()” or Tag Manager’s listeners won’t work.

7. Track hover elements. As with clickable elements, having IDs or other unique attributes on elements where visitors can hover will make them easier to track. See my hover tracking post.

8. Do you have AJAX forms or content? Push an event to the data layer for forms that submit back to themselves, or for any AJAX-y content. Use the event info to send virtual pageviews if you need to create goal funnels.

9. Handling URLs with hash changes. You may not need a complicated solution to track pages where the hash is the important part of the URL. Read more about easy dynamic content tracking.

Add ecommerce to the data layer

To track purchases or donations, it is essential to pass the details from the back-end to the data layer on the receipt page where you can retrieve it easily via Tag Manager.

18. Transaction Subtotal. You could calculate this with JavaScript from the product prices and quantities, but why not pass it directly from the back-end where it’s already been calculated?

And it’s worth considering to include:

19. Customer ID.

20. Customer’s lifetime number of purchases.

21. Customer’s lifetime value.

22. Customer demographic info.

23. Time stamp of purchase. Record the customer’s local time at the time of purchase, and use it to prevent repeat views of the receipt page from sending duplicate transactions to your analytics data.

Don’t forget to put a similar data layer on your cart page, showing:

24. Items in cart. Remarketing tags can use info about how many and which products a customer put in the cart.

Product pages may have a full-fledged data layer, including:

25. Product SKU or Product ID.

26. Brand Information.

27. Categories & Subcategories.

28. Reviews. Pass the number of reviews and the overall product rating to the data layer.

Add other page info to the data layer

Besides page template names, as suggested in item #3 above, there are many other pieces of information you might want to access via Google Tag Manager that are specific to individual pages or groups of pages.

For all kinds of content, from news and entertainment sites to blogs to non-profits to government agencies to self-service support sites, you may find one or more of the following labels helpful to add to the data layer:

29. Topics, Tags, or Taxonomy.

30. Authors.

31. Publication Dates.

1

2

3

4

5

6

7

8

9

<script type="text/javascript">

dataLayer=[{

'author':'Yinzer, Joe',

'topic':'sports',

'taxonomyLevel-1':'NCAA Basketball',

'taxonomyLevel-2':'2014 Tournament',

'publicationDate':'2014-03-24'

}];

</script>

32. Comments. How many comments does an article attract? How long is the comment thread?

33. Upvotes or Downvotes. If you have a content rating system, add it to the data layer.

And what about internal promotions or sponsor banners? If these can have specific element attributes as mentioned in item #4, above, then you can pull them directly into Tag Manager. If not, see if your developers can add to the data layer:

35. Internal promo ID or sponsor banner ID. You may also want to include a campaign name or sponsor name, especially if these can be easily pulled from the same database that puts the promo or banner on the page.

Add visitor info to the data layer

Just as you might put customer info in the data layer on your receipt pages, you might also put visitor info in the data layer on any page after the visitor has logged in. Anything a visitor has entered into a form, and you’ve stored in your database, can be returned to the page for easy access via Tag Manager.

Consider adding the following to the data layer:

37. Visitor ID.

38. Demographic info.

39. Membership level.

1

2

3

4

5

6

7

8

9

<script type="text/javascript">

dataLayer=[{

'visitorID':'98765432MK',

'age':'37',

'gender':'male',

'occupation':'university professor',

'membership':'subscriber-level-3'

}];

</script>

40. Preferences or user settings. Use of favorites, wish list, or other options you may offer that allow visitors to personalize their view of your site.

41. Visitor ratings. Depending on the type of site you have, a visitor may be rated as a top commenter, trusted expert, etc.

Finally, think about adding:

42. Visitor IP address. Jon Meck lays out the case for using Google Tag Manager to exclude known IPs from visitors who are not customers, such as internal staff or vendors. You can keep unnecessary hits from ever reaching your analytics data, instead of filtering them out later.

You won’t need everything in this checklist, but you’ll be glad you planned ahead when that last-minute tag request comes in, and you can just set it up in Google Tag Manager without placing a work order for your developers.

How have you handled prepping your site for Google Tag Manager? What obstacles or concerns do you still face? Did I leave anything out of my checklist? Please share in the comments.

Dorcas Alexander is a Senior Digital Analyst. Her path to LunaMetrics followed stints in ad agency creative, math, and computer science. Dorcas has a master's degree in language and information technologies from Carnegie Mellon University, where she helped build precursors to a Universal Translator. One of the top-rated tournament Scrabble players in Pennsylvania, Dorcas has an insatiable drive to compete and win.

Ryan

Great post, Dorcas. Thanks!

http://lesfaber.ca Les

Great…. I was hoping to get a solid night’s sleep tonight Dorcas….. Thanks a bunch! 😉

http://www.analysieren-optimieren.de Gerhard Klassen

Thanks so much!

Custoemr ID is very nice ;P

Caroline

Perfect timing for this great information. We are investigating implementing Tag Manager in the months ahead.
Thanks!

http://www.griplimited.com Kris

This is such a great post. I wish I read this last month, my life would be much easier right now.