google tag manager (manual in english)

143
Google Tag Manager Not for programmers A quick guidebook to Google Tag Manager for marketers and other professions not connected with programming. LCS & CSI Poland Warsaw, 2014

Upload: sergey-bizikin

Post on 11-Aug-2014

576 views

Category:

Data & Analytics


18 download

DESCRIPTION

 

TRANSCRIPT

Page 1: Google Tag Manager (Manual in English)

 

Google  Tag  Manager    Not for programmers

         A  quick  guidebook  to  Google  Tag  Manager  for  marketers  and  other  

professions  not  connected  with  programming.                  

LCS  &  CSI  Poland  Warsaw,  2014  

 

Page 2: Google Tag Manager (Manual in English)

     

2  

Introduction  Thank  you  for  your  interest  in  this  guidebook  to  Google  Tag  Manager,  which  is  more  and  

more  often  implemented  on  websites,  across  all  over  the  world.  The  main  aim  of  its  

installation  is  usually  for  a  marketing  department  to  become  independent  from  other  

company’s  departments  (like  IT)  and  to  speed  up  changes  on  a  website  within  marketing  

and  analytics  measurement  processes.    

 

However,  to  be  able  to  become  really  independent,  one  should  know  how  to  use  this  tool.  It  

is  often  connected  with  technical  issues,  which  may  not  be  very  well  known  to  everyone.  A  

marketer  does  not  have  to  be  a  programmer  or  a  technical  person,  at  last.  

 

An  idea  has  arisen  on  this  field  to  explain  the  technical  subject  to  non-­‐technical  people  in  

the  least  technical  way  ;).    

 

Please  notice,  this  guidebook  is  not  official  manual  approved  by  Google  and  does  not  

include  all  options  and  does  not  describe  all  possibilities  of  GTM.  It  is  to  give  the  concept  

what  you  can  do  with  it,  understand  its  working  and  make  use  of  it  in  the  most  popular  

cases.  A  reader  can  learn  more  and  develop  himself  in  this  area,  if  she/he  wants.  

 

 

 

All  information  about  mistakes  and  ideas  for  additional  chapters  are  welcome  J    

 

Have  a  comprehensible  reading  

Przemek  Modrzewski  

Senior  Analytical  Lead  

Page 3: Google Tag Manager (Manual in English)

     

3  

Contributors      The  e-­‐book  was  created  in  cooperation  of  couple  of  people  from  Poland.  Thanks  to  huge  contribution  of  team  members  it  was  possible  to  write  this  ebook.        Special  thanks  for  help  and  contribution  to:      

• Mariusz  Gąsiewski  

• Paweł  Matkowski  

• Jacek    Ewiak  

• Piotr  Rudnicki  

• Maciej  Jerzak  

   

         

DISCLAIMER    

This  quidebook  is  NOT  any  official  manual  approved  by  Google.  This  is  private  work  of  

author  and  contributors.  Please  don’t  treat  any  statements  in  this  material  as  official  

statement  of  Google.      

     

             

Page 4: Google Tag Manager (Manual in English)

     

4  

Table  of  Contents  

Introduction  ...........................................................................................................................  2  

Contributors  ...........................................................................................................................  3  

Tag  manager  -­‐  introduction  ....................................................................................................  6  How  does  GTM  work  ?  .............................................................................................................................................................  7  Google  Tag  Manager  structure  .............................................................................................................................................  8  What  is  a  container?  ..................................................................................................................................................................  9  What  are  tags?  ..........................................................................................................................................................................  10  What  are  rules?  .........................................................................................................................................................................  10  What  are  macros?  ....................................................................................................................................................................  11  

Google  Tag  Manager  on  the  website  ...............................................................................................................................  12  Google  Tag  Manager  installation  –  step  by  step  ........................................................................................................  12  Step  1  –  Create  a  GTM  account  ..........................................................................................................................................  12  Step  2  –  Create  the  first  tag  .................................................................................................................................................  16  

Installation  of  basic  scripts  on  the  website  ...........................................................................  22  Installation  of  Google  Analytics  statistics  with  GTM  ...............................................................................................  22  The  first  rule  in  GTM  ...............................................................................................................................................................  28  Testing  a  newly  created  tag  ................................................................................................................................................  30  

Installation  of  Google  AdWords  conversion  tracking  with  GTM  ........................................................................  33  The  first  contact  with  macros  in  Google  Tag  Manager  ...........................................................................................  38  What  does  the  macro  consist  of  and  how  is  it  created?  ..........................................................................................  39  

Implementation  of  Google  AdWords  remarketing  with  GTM  ..............................................................................  40  

Google  Tag  Manager  –  advanced  cases  of  use  .......................................................................  45  Data  Layer  –  what  is  it  and  what  is  it  used  for?  .........................................................................................................  45  What  is  Data  Layer?  ...............................................................................................................................................................  45  How  does  Data  Layer  look  like?  .........................................................................................................................................  48  Adding  variables  and  values  to  Data  Layer  .................................................................................................................  49  

Event  tracking  in  Google  Analytics  with  GTM  ............................................................................................................  52  A  button  click  as  an  event  in  Google  Analytics  ............................................................................................................  52  More  buttons  (events)  to  measure  on  one  website  ...................................................................................................  63  Measuring  the  action  on  the  website  with  virtual  pageviews  ..............................................................................  65  

Auto  event  in  GTM  (auto  event  tracking)  ..............................................................................  69  Auto-­‐tagging  in  practice  (introduction)  ........................................................................................................................  69  Auto  measuring  of  clicks  on  the  button  (link)  .............................................................................................................  70  

A  little  more  about  macros  in  auto  events  ...................................................................................................................  78  Available  macros  and  their  possibilities  .......................................................................................................................  80  Auto-­‐Event  Variable  ...............................................................................................................................................................  81  Macro  Constant  String  ...........................................................................................................................................................  83  Macro  -­‐  Custom  Events  ..........................................................................................................................................................  83  DataLayer  Variable  .................................................................................................................................................................  84  DOM  elements  ............................................................................................................................................................................  84  HTTP  referrer  ............................................................................................................................................................................  87  Javascript  Variable  (Custom  Javascript  code)  .............................................................................................................  87  Random  Number  ......................................................................................................................................................................  88  URL  macro  ..................................................................................................................................................................................  89  

Page 5: Google Tag Manager (Manual in English)

     

5  

Lookup  Table  .............................................................................................................................................................................  90  Measuring  outbound  links  as  auto  events  in  GA  .......................................................................................................  91  Measuring  document  downloads  (e.g.  PDF)  as  auto  events  in  GA  .....................................................................  94  Measuring  clicks  on  images  as  an  event  on  the  website  in  GA  ............................................................................  96  Cross-­‐domain  tracking  with  GTM  (UA)  ......................................................................................................................  100  Dynamic  remarketing  installation  with  GTM  ..........................................................................................................  103  First  method  -­‐  standard  .....................................................................................................................................................  104  The  second  method  –  without  sending  variables  programmistically  ............................................................  112  

Ecommerce  tracking  in  GA  with  GTM  .........................................................................................................................  121  Dealing  with  the  bounce  rate  in  Google  Analytics  (real  bounce  rate)  ...........................................................  124  Tags  which  are  not  in  GTM  ..............................................................................................................................................  128  Using  GTM  in  mobile  applications  .......................................................................................  132  Administering  tags  in  application  –  a  few  words  ...................................................................................................  132  Introducing  changes  in  application  (revolution)  ...................................................................................................  133  A  problem  with  mobile  applications  .............................................................................................................................  133  How  does  GTM  work  for  application?  ..........................................................................................................................  134  What  can  be  changed  by  GTM  in  application?  .........................................................................................................  136  

A  few  final  thoughts  ...........................................................................................................  141  

Migration  plan  to  GTM  .......................................................................................................  142  

Conclusion  ..........................................................................................................................  143        

 

 

 

 

 

 

 

 

 

Page 6: Google Tag Manager (Manual in English)

     

6  

Tag manager - introduction    

Tag  manager  is  a  tool  which  makes  easier  to  work  with  numerous  marketing  codes  which  

allow  tracking,  measuring  and  also  marketing  actions  for  users  of  our  website.  

   

Thanks  to  GTM  we  do  not  have  to  edit  websites  to  make  any  changes  or  add  new  marketing  

codes.  You  need  only  to  paste  the  GTM  code  once  on  our  website.  GTM  answers  the  need  of  

control  of  implementation  of  different  codes  on  the  website  by  marketing  not  by  the  IT  

department.  We  know  that  for  running  effective  marketing  in  the  Internet  more  and  more  

tools  connected  to  our  website  are  necessary.    

 

So  far,  to  introduce  anything,  change  the  website  in  terms  of  marketing  codes,  the  

intervention  of  IT  department  or  a  webmaster  has  been  necessary.  Usually  the  process  was  

quite  long  then.  Additionally,  lack  of  understanding  how  different  marketing  tools  work  by  

the  IT  department  often  caused  wrong  installations.  Another  waste  of  time.    

 

Thanks  to  GTM,  a  marketer  or  other  person  responsible  for  marketing  actions  in  the  

Internet  can,  by  their  own,  in  a  few  minutes,  add  any  code  which  is  needed  for  different  

tools  working  without  the  need  of  contact  with  the  IT  department.  

 

GTM  has  also  many  other  possibilities,  which  I  will  tell  about  later  in  this  e-­‐book.  

 

Page 7: Google Tag Manager (Manual in English)

     

7  

How does GTM work?  

Simply  speaking,  installing  the  GTM  code  once  in  your  service  (a  code  fragment  on  each  

subpage)  we  can  add,  edit,  delete  all  marketing  tags  (remarketing,  analytics,  conversion  

tracking  and  many  others)  with  no  need  of  editing  the  website  code.  All  actions  take  place  

with  GTM  interface  in  the  web  which  we  log  in  as  easy  as  in  mail  or  Google  Analytics.  It  

gives  control  over  marketing  codes  for  people  who  are  not  related  to  the  IT  department  

while  website  security  will  not  be  at  risk.  It  also  significantly  shortens  time  needed  for  

changes  and  reaction  for  changes  which  are  need  while  running  the  campaign  in  the  

Internet  and  reduces  a  resources  (i.e.  IT  department)  needed  every  day  in  marketing  

actions  (website  edition,  code  changes,  tag  pasting,  etc.).    

 

What  is  important  and  should  be  clear.  Switching  to  GTM  not  affect  any  reports  and  should  

not  have  any  impact  on  data.  Of  course  when  implemented  correctly.    

 

 

GTM  tool  consists  of  several  elements,  which  we  will  administer:  

● Containers  i.e.  codes  pasted  on  the  website  in  which  all  marketing  codes  (tags)  will  

be  stored.    

● Tags  –  tracking  codes  which  we  want  to  place  on  the  website  e.g.  Google  Analytics,  

AdWords  conversion  codes,  remarketing  and  any  other  tracking  codes,  not  only  

these  ones  from  Google.    

● Rules  –  conditions  in  which  tags  are  to  be  fired.    

● Macros  –macros  are  used  for  making  the  work  with  tags  and  rules  easier,  

automating  repetitive  actions.    

 

All  these  elements  will  be  discussed  later  in  this  document.  

 

 

Page 8: Google Tag Manager (Manual in English)

     

8  

Google Tag Manager structure    

An  account  structure  of  GTM  tool  consists  of  above  mentioned  containers  and  tags  which  

belong  to  them,  as  well  as  rules  and  macros.    

 

   

 

When  creating  the  GTM  account  you  can  see  the  menu  on  the  left.  There  are  three  elements  

in  it  –  tags,  rules  and  macros.  All  tags  (marketing  codes  added  to  the  website  by  GTM)  and  

rules  and  macros  created  by  us  will  be  stored  here.  Creating  each  of  these  items  takes  place  

with  the  help  of  menu  in  the  center  of  interface,  where  we  see  button  “new”.  We  have  said  

in  short,  at  the  beginning,  what  elements  of  the  GTM  account  are  and  what  they  are  used  

for,  now  let’s  explain  this  in  details.  So,  once  more,  what  actually  containers,  tags,  macros  

and  rules  are.  

 

GTM  account  

Container  

Tags  Rules   Macros  

Page 9: Google Tag Manager (Manual in English)

     

9  

   

What is a container?    

All  tags  are  stored  in  the  container.  The  container  is  a  set  of  all  tags  which  are  used  and  

pasted  on  the  same  website  with  GTM.  The  container  should  be  pasted  on  every  webpage  

of  our  website,  similar  to  normal  tracking  code  e.g.  Google  Analytics.  Only  then  we  can  add  

tags  of  every  tracking  other  tools,  e.g.  Analytics  or  Adwords  from  the  level  of  GTM  interface.  

     

In  this  way,  we  edit  our  website  only  once,  paste  a  container  in  the  right  place  (the  best  

Page 10: Google Tag Manager (Manual in English)

     

10  

directly  under  the  tag  <body>,  which  opens  website  content)  and  then  all  other  codes  are  

added  to  website  through  the  container  with  no  need  of  interference  in  a  website’s  source  

code.      

 

Remember!  The  container  should  be  installed  on  each  subpage  of  our  service.  As,  for  

example,  Analytics  code.  It  is  so  important  that  in  the  case  of  omitting  any  subpage  there  is  

no  possibility  to  add  tags  with  GTM  on  it.  That’s  why  we  will  not  be  able,  for  example,  to  use  

Analytics  code  on  it,  if  we  want  to  install  a  tracking  code  with  GTM.  

 

What  are  tags?  

   

Tags  are  tracking  codes  which  we  want  to  paste  on  a  website  with  the  GTM  tool.  The  Tag  is  

a  script,  e.g.  Google  Analytics  that  we  paste  usually  in  the  website’s  code.  It  can  be  also  

AdWords  conversion  tag,  remarketing  tag  or  other  marketing  tool  tag  which  require  adding  

some  fragment  of  the  code  on  our  website.  

 

What are rules?    

Rules  are  nothing  else  than  principles  when  a  given  tag  is  to  be  fired  in  the  container.  For  

example,  if  we  added  a  tag  of  AdWords  conversion  tracking,  we  would  not  like  to  fire  this  

code  on  each  subpage  of  the  service  but  only  on  the  website  which  confirms  doing  a  

desired  action  by  visitor  –  purchase,  e-­‐book  download,  filling  in  a  form,  etc.  

 

Such  a  website  can  be  determined  as  a  last  website  in  some  process  to  aim,  on  which  it  is  

information  confirming  this  action,  for  example  “Thank  you  for  purchase”.  Its  URL  address  

can  look  i.e.    www.my-­‐website.pl/thankyou.html

 

 

To  count  a  conversion  in  AdWords,  when  someone  achieves  the  end  of  conversion  path  and  

Page 11: Google Tag Manager (Manual in English)

     

11  

sees  the  above  website,  we  must  create  a  rule  in  GTM  which  will  define  a  condition  of  firing  

the  conversion  code.  The  condition  (rule)  could  say  as  follows:  Fire  the  Adwords  

conversion  code  when  there  is  a  word  „thank  you”  in  URL  address.  In  other  case  the  code  

will  not  be  fired  and  the  conversion  will  not  be  counted.    

 

What are macros?    

A  definition:  Macros  are  the  pairs  "name-­‐value"  whose  value  is  completed  in  the  course  of  

action.  For  example,  an  initially  defined  macro  named  “URL”  is  defined  in  this  way  that  its  

value  of  actual  URL  of  the  website.  This  is  a  definition.    

   

Because  macros  are  a  bit  more  complicated  elements  we  will  deal  with  them  a  little  later  by  

the  way  of  more  advanced  use  of  GTM.  They  are  not  required  for  simple  standard  

installations  but  we  rather  cannot  ignore  its  importance.    

 

Summary  

 

So,  how  can  all  these  elements  be  easily  summarized  while  explaining  their  relationships  

between  them?  

 

Tags  are  codes  which  we  want  to  place  on  the  website  (e.g.  Google  Analytics  code),  rules  

are  used  for  defining  when  a  given  tag  is  to  be  fired  (e.g.  GA  code  is  to  be  fired  on  all  pages),  

while  macros  are  used  for  automating  and  simplifying  work  with  data  which  are  necessary  

for  tag  and  rule  working  on  our  website.  

Page 12: Google Tag Manager (Manual in English)

     

12  

Google Tag Manager on the website      

Google  Tag  manager  can  be  used  in  the  case  of  most  codes  which  we  have  to  add  to  our  

website  to  benefit  from  such  mechanisms  like  statistics  of  website  views,  conversion  

tracking  or  other  data  needed  for  marketing  actions.    

 

In  the  following  steps  we  will  move  to  the  process  of  correct  installation  of  GTM  on  the  

website  by  implementing  the  most  popular  tags.  Meanwhile,  we  will  explain  all  functions  

and  concepts,  which  may  not  be  clear  in  official  GTM  help.  

 

Google  Tag  Manager  installation  –  step  by  step  

 

 

Google  Tag  Manager  installation  is  very  simple  and  includes  few  steps.  

They  are:  creating  an  account,  creating  a  container,  settings  configuration  and  installation  

of  first  tags  i.e.  tracking  codes.  Although  the  first  actions  are  quite  simple,  the  questions  will  

arise  just  surely  at  the  beginning  of  actions.  I  will  try  to  foresee  them  here  and  explain  ;).  

   

 

Step 1 – Create a GTM account  

This  action  is  very  simple.  You  need  only  to  enter  https://www.google.com/tagmanager/

and  create  an  account.  

 

First  container  

What  a  container  is  we  have  explained  at  the  beginning  of  this  e-­‐book.  Now  it  is  time  for  its  

creation  and  installation.  

 

 

Page 13: Google Tag Manager (Manual in English)

     

13  

   

A  good  practice  is  just  to  name  a  container  as  we  have  named  our  account  but  it  is  not  

obligatory.  Perhaps  we  will  have  soon  several  containers,  so  it  is  important  to  create  the  

terminology  system.  The  subject  of  terminology  is  essential  because  our  account  with  time  

will  be  bigger  as  we  will  add  next  tags,  macros  and  rules.  We  will  have  to  know  what  they  are  

used  for.  Then  we  have  to  choose  where  we  want  to  use  our  container,  on  a  website  or  in  

the  mobile  application.  It  is  also  one  of  the  advantages  of  GTM  that  we  can  use  it  to  

administer  tags,  and  even  administer  changes  in  mobile  applications.  We  will  write  more  

about  it  later.  

 

 

If  I  have  a  lot  of  domains,  subdomains,  so  how  many  containers  do  I  need?  How  many  

containers  should  I  create?  

It  was  my  first  question,  which  came  to  my  mind  while  creating  the  first  GTM  account.  

Generally,  if  I  have  a  lot  of  domains  but  they  are  not  connected  with  one  another,  it  is  a  

good  practice  to  keep  the  principle  one  domain  –  one  account  -­‐  one  container.  It  allows  

keeping  an  order  while  it  does  not  disturb  to  administer  them  because  we  can  administer  a  

Page 14: Google Tag Manager (Manual in English)

     

14  

lot  of  GTM  accounts  from  the  level  of  one  login  and  password.  It  is  seen  on  the  image  below  

where  with  one  login  I  have  an  access  to  many  GTM  accounts.    

   

Let’s  come  back  to  the  installation  of  the  first  container.  Because  actually  we  implement  

GTM  on  the  website,  we  choose  an  option  of  a  container  just  for  the  website.  If  we  

implement  tag  manager  in  application,  we  will  choose  a  suitable  version  of  “mobile  

applications”.  

 

When  choosing  a  version  for  a  website  an  available  container  will  occur  to  be  pasted  on  our  

website.    

Page 15: Google Tag Manager (Manual in English)

     

15  

 We  copy  a  ready  code  of  the  first  container  as  a  whole  and  paste  it  on  our  website.    

The  best  place  to  paste  a  container  code  is  a  place  directly  below  the  tag  which  opens  the  

website  content  -­‐  <body>.  We  will  find  it  easily  in  the  website  code  by  the  option  “search  in  

content”.  We  can  see  how  it  looks  like  for  a  sample  website  by  clicking  the  right  mouse  

button  on  the  website  content  and  choosing  “Show  the  website  source”.  

 

   

 

Page 16: Google Tag Manager (Manual in English)

     

16  

What  if  we  cannot  put  the  GTM  code  in  the  place  described  above?  

Remember  that  the  best  place  for  a  container,  which  guarantees  the  best  data  collecting,  is  

the  place  directly  below  the<body>  tag.    

Unfortunately,  there  is  no  guarantee  that  our  codes  implemented  by  GTM  will  be  called  

correctly  if  we  change  the  place  of  the  container.  Especially  I  do  not  recommend  pasting  the  

container  code  in  the  <head></head>  section  because  the  script  includes  “iframe”  which  

can  cause  an  unexpected  action  of  the  browser.  

 

Step 2 – Create the first tag As  we  have  seen  in  the  image  from  p.  13,  after  creating  the  first  container  we  can  see,  at  

once,  several  built-­‐in  tags  at  our  disposal  ready  to  be  installed  on  our  website.  As  you  can  

see  the  most  popular  Google  tags  are  there,  we  have  also  available  Doubleclick  tags.  There  

are  also  several  tags  of  other  companies  available  in  GTM.  In  addition,  there  are  custom  

tags  (Custom  HTML)  thanks  to  which  we  can  actually  place  every  other  tag  on  our  website,  

even  if  it  is  not  normally  on  the  standard  GTM’s  tag  list.  We  will  discuss  implementation  of  

the  most  popular  tags  in  details  in  a  moment.  Now  we  will  stop  for  a  while  and  discuss  

settings  and  functionality  of  the  account,  which  we  will  use  in  a  while.  

 

 

Settings  and  functionality  of  the  GTM  account  

 

While  creating  the  GTM  account  and  the  first  container  we  have  one  user  (i.e.  ourselves).  In  

GTM  account  we  can  add  next  containers  and  users.  As  we  can  see  below  we  can  use  the  

“New”  button  and  add  a  user  or  a  container.  

 

Page 17: Google Tag Manager (Manual in English)

     

17  

   

 

According  to  what  I  have  written  before,  a  good  practice  is  to  keep  a  rule  –  one  account,  one  

domain,  one  container.  However,  we  can  ignore  this  principle  in  different  cases.    

 

Many  domains  we  treat  as  the  whole.  

Then  we  can  use  one  container  for  many  domains  because  rules,  tags  and  macros  cannot  be  

divided  between  containers.  If  all  domains  are  to  be  configured  in  a  similar  way,  the  use  of  

one  container  is  applied.  

   

 Many  tags  on  one  domain.  

If  we  have  plenty  of  tags  to  handle,  it  is  much  easier  to  administer  them  if  we  divide  them  

into  two  containers  or  more.  It  gives  us  bigger  clarity  what  and  when  is  to  be  fired  and  it  

makes  also  that  the  container  itself  is  less  loaded  (it  is  smaller).  It  is  possible  to  e.g.  

segregate  tags  according  to  a  type  and  a  tool.  However  it  is  quite  rare.  

 

Page 18: Google Tag Manager (Manual in English)

     

18  

Many  users  with  different  access  rights  

Access  rights  for  users  can  be  granted  on  the  container  level.  Thus,  if  we  want  to  limit  the  

access  to  other  domain  or  tag  configuration  we  have  to  use  more  containers  and  give  the  

next  users  access  and  rights  on  their  level.  We  can  grant  accesses  of  different  rights:  

browsing,  browsing  and  editing  or  browsing,  editing  and  publishing  (full  access)  

Test  environment  

A  good  idea  is  to  use  different  containers  while  testing  implementation  of  new  tags  or  rules.  

Especially  for  big  services,  a  wrong  configuration  and  loss  of  data  for  some  period  can  be  

painful.    Hence,  it  is  worth  paying  attention  to  it  during  implementation.  At  the  moment  of  

implementation  it  is  a  good  idea  to  make  use,  especially  in  Google  Analytics  and  other  

statistics  issues,  of  the  Lookup  Table  macro,  which  we  will  discuss  later  in  this  e-­‐book.  At  

the  very  end  you  can  find  a  proposed  migration  plan  to  Google  Tag  Manager.  

 

"Settings"  tab  

 

In  the  "settings”  tab  there  is  an  identifier  of  a  container  and  a  container  name,  which  we  

can  change  in  any  time.  

 

"Containers"  tab  

 

In  the  "Containers"  tab  we  can  see  currently  created  containers  on  the  account,  number  of  

tags  created  for  a  given  container,  our  rights  to  edit  a  container  and  a  number  of  users  

assigned  to  it.  

 

Choosing  our  existing  container,  which  is  called  "my  test  container”  in  our  example,  we  

proceed  to  the  heart  of  Tag  Manager  itself  i.e.  to  container  settings.  

 

Page 19: Google Tag Manager (Manual in English)

     

19  

   

As  we  can  see  in  the  menu  on  the  left,  there  are  tabs  concerning  tags,  rules  and  macros.  We  

have  said  about  these  elements  before  and  we  will  talk  about  them  many  times  further.  We  

will  be  using  the  left  menu  very  often.  In  the  center,  we  have  a  view  of  tags,  rules  and  

macros  created  by  us  under  grey  tabs.  

 

Now  the  most  important  thing,  at  this  point,  is  to  understand  the  matter  of  a  version  

and  a  container  type.  So,  what  is  all  about?  

 

Adding  a  tag  or  a  rule  to  the  container  or  editing  anything  in  GTM  we  will  not  see  changes  

on  our  website.  Nothing  will  be  changed.  To  do  this  we  have  to  publish  the  changes.  Thus,  

in  item  3  in  the  image  above  we  can  see  a  container  as  unpublished.  To  publish  it  and  

introduce  the  changes  which  will  have  reflection  on  our  website  first  we  have  to  create  

another  version  of  a  container  (item  2).  Then  we  can  publish  the  current  version.  It  will  

then  go  live.  Any  created  version  can  be  seen  below  the  menu  on  the  left.  You  can  come  

back  to  the  version,  if  there  is  such  a  need.  Thanks  to  versions  we  do  not  override  changes  

irretrievably.    

 

 

Page 20: Google Tag Manager (Manual in English)

     

20  

   

In  the  image  from  website  17  you  can  see  the  item  1,  that  is  a  function  of  preview.  The  

“Preview”  function  is  one  of  functionalities  used  very  frequently  while  adding  or  editing  

tags  or  changing  other  settings.  Thanks  to  the  “Preview”  function  we  can  preview  if  

changes  introduced  by  us  work  properly  on  the  website.  There  are  three  options  of  

preview  of  changes  available.  

 

 

● Preview  –  It  allows  us  to  preview  the  website  with  changes  applied  by  us.  It  means  

that  after  choosing  a  "Preview”  option  we  can  enter  our  website,  refresh  it  and  check  if  

changes  introduced  by  us  work  e.g.  in  the  programmers'  console  in  Chrome  browser  or  in  

Firebug  tool  in  Firefox.  Because  we  have  not  created  a  version  in  GTM  yet,  changes  on  the  

website  are  seen  only  by  us.  After  switching  off  the  preview  option  (a  yellow  bar  at  top  of  

the  screen),  changes  will  stop  working  on  the  website.  

 

Page 21: Google Tag Manager (Manual in English)

     

21  

   

 

● Debug  –  the  option  probably  the  most  frequently  used.  It  allows  to  add  to  “Preview”  

option  an  auxiliary  console  which  will  show  us  if  and  what  tags  will  work  on  our  website  

after  creating  a  new  version.  

 

 

   

Page 22: Google Tag Manager (Manual in English)

     

22  

 

● Share  –  A  "Share”  option  allows  us  to  create  a  unique  url  address,  which  we  can  send  

to  a  person  who  is  not  related  to  our  GTM  account.  Thanks  to  this  address  the  person  who  

will  use  a  link  given  by  us  will  be  able  to  see  also  working  changes,  which  are  not  published  

yet  in  GTM.  

 

 

Installation of basic scripts on the website  

We  now  know  the  basic  settings  of  Google  Tag  Manager.  We  can  move  to  the  installation  of  

tracking  scripts  on  our  website  with  GTM.  We  will  start  from  the  most  standard  tags  

(scripts)  and  then  we  will  go  into  more  advanced  ways  of  using  this  tool.  

 

 

Installation of Google Analytics statistics with GTM  

Using  Tag  Manager  (GTM)  to  track  traffic  on  the  website  with  Google  Analytics  is  one  of  

most  frequent  cases.  The  simplest  installation  is  not  complicated  but  more  advanced  

aspects  of  tracking  like  e.g.  event  tracking  may  cause  some  problems.  Thus,  we  will  deal  

also  with  these  more  advanced  aspects  in  further  steps.  Now  we  will  make  a  standard  

installation.    

 

In  the  previous  part  of  this  e-­‐book  we  have  created  the  GTM  account  and  the  first  container  

as  well.  Just  after  creating  the  container  we  have  an  opportunity  to  move  at  once  to  create  

the  first  of  the  most  popular  tags.  

 

Page 23: Google Tag Manager (Manual in English)

     

23  

   

 

We  can  start  to  create  them  at  once  or  do  this  after  installing  the  container.    

We  have  to  do  the  following:  

 

1. Create  Google  Analytics  tag    

2. Define  rules  for  tag  to  be  fired    

3. Test  a  newly  created  tag    

4. Create  a  version  of  the  container    

5. Publish    

 

Let’s  start  from  the  beginning.  

 

Ad  1.  Create  Google  Analytics  tag    

We  start  creating  a  tag  from  giving  the  name  to  it.  It  is  important  because  when  there  are  

many  tags  it  will  be  easier  to  administer  them  if  tags  have  properly  matched  names.  

A  good  practice  is  to  construct  names  based  on  a  type  of  a  tool  e.g.  Google  Analytics  and  a  

Page 24: Google Tag Manager (Manual in English)

     

24  

function,  which  a  given  tag  is  to  fulfill.  The  first  tag  which  we  will  create  is  the  tag  named  

GA  (Google  Analytics)  –  Pageviews,  because  this  tag  will  be  responsible  for  tracking  

displays  of  our  website,  that  is  a  basic  function  of  Google  Analytics.  All  other  functions  of  

GA  will  be  also  used  but  we  will  use  next  tags  to  it.  We  will  talk  about  it,  for  example,  by  the  

way  of  event  tracking  on  the  website  with  GTM.  

 

   

 

Another  step  is  to  choose  the  kind  of  a  tag  from  the  list  of  standard  tags  serviced  by  GTM.  

We  choose  Google  Analytics  from  a  pull-­‐down  menu.  Now  we  can  choose  from  Classic  GA  

and  a  new  version  that  is  Universal  Analytics.  For  the  need  of  this  example  we  will  use  a  

classic  version.  The  choice  of  the  second  one  will  not  have  any  influence  on  the  way  of  

creating  and  administering  the  GA  tag,  so  we  can  choose  the  version  at  will.  

 

Page 25: Google Tag Manager (Manual in English)

     

25  

   

As  you  can  see  above  we  have  many  more  standard  tags  available,  which  we  can  use  with  

GTM.  If  our  tag  is  not  on  the  list  we  can  implement  it  with  custom  tags.  We  will  talk  about  it  

later.    

 

In  the  next  step  we  have  to  give  an  ID  number  of  our  account  in  Google  Analytics,  which  we  

are  going  to  install  with  GTM.  We  can  find  ID  in  our  Analytics  account.    

 

***OFF  TOPIC***  

 

As  you  can  see  in  the  image  above,  on  the  right  next  to  the  ID  number  of  the  account  

introduced  in  the  "Web  property  ID”  column  there  is  a  grey    "Lego  brick”.  This  “brick"  

indicates  the  possibility  of  using  macros.  I  have  mentioned  before  that  macros  are  used  to  

simplify  and  automate  the  work.  We  will  make  use  of  a  macro  for  the  first  time  to  simplify  

using  the  ID  number  of  the  GA  account  in  next  cases  of  using  this  number  ID  on  our  

account.    

 

 

Page 26: Google Tag Manager (Manual in English)

     

26  

What  to  do  then?  

 

1. Mark  the  ID  number  and  copy  it  to  the  storage  (ctrl  +  C)  

2. Click  on  the  "brick”  and  choose  "New  macro”  at  the  bottom.  

3. Add  the  macro  name  that  we  know  what  this  macro  is  used  for,  choose  the  

type  as  "Constant  String”  and  a  value  as  an  ID  of  our  Google  Analytics  account.  There  

are  many  macro  types  and  with  time  we  will  make  use  of  different  than  “Constant  

String”.  Now  we  are  not  dealing  with  it.  

   

 

After  that  we  can  use  a  given  macro  and  thanks  to  this  we  do  not  need  to  remember  the  ID  

of  Google  Analytics  account  with  the  next  tags  which  are  to  be  installed.  

 

Page 27: Google Tag Manager (Manual in English)

     

27  

 It  is  one  of  the  simplest  methods  of  using  macros  but  thanks  to  this  we  will  not  make  

mistake  while  pasting  codes  and  what  is  more,  we  do  not  waste  the  time  for  checking  a  

given  ID  many  times.  I  will  emphasize  once  more  that  Analytics  tag  has  its  types,  which  are  

responsible  for  different  types  of  tracked  data.  So,  if  we  want  to  track  events  and  

ecommerce  transactions  by  GTM,  we  will  have  to  use  three  tags:  for  pageviews  (standard),  

for  events  and  for  transactions.    We  need  to  give  the  ID  number  of  the  GA  account  each  time  

we  create  a  tag  for  given  GA  account.  Thanks  to  the  created  macro  we  do  not  have  to  

remember  ID  of  account.  So  we  used  macro  for  the  first  time.  It  is  simple  way  but  very  

useful  and  we  will  use  it,  in  this  way,  quite  often.    

 

***OFF  TOPIC***  

 

Let's  come  back  to  creating  our  Tag.    After  choosing  a  type  of  the  tag  as  Google  Analytics,  

we  can  see  the  option  “Enable  Display  Advertising  Features”  below.  This  option  is  used  for  

switching  on  possibilities  to  make  use  of  remarketing  in  Google  Analytics  and  demographic  

reports.  In  practice  this  option  adds  to  the  code  a  Doubleclick  cookie,  which  is  just  

responsible  for  these  additional  possibilities  of  Google  Analytics.    

   

 

 

 

Page 28: Google Tag Manager (Manual in English)

     

28  

Track  type  

 

I  have  mentioned  about  track  types  a  little  earlier  by  the  way  of  creating  the  first  macro.  

There  can  be  many  track  types  depending  on  a  kind  of  a  tag.  Even  in  the  case  of  Google  

Analytics  we  have  them  quite  a  lot.  

   

 

Website  View  tracking  is  of  course  a  standard  type  but  in  the  further  part  we  will  use  next  

types,  just  as  we  will  want  to  start  the  following  functionalities  of  Google  Analytics  with  

GTM,  such  as,  for  example,  event  tracking  on  the  website  or  traffic  tracking  between  

domains.  We  will  talk  about  it  further  on.  

   

The first rule in GTM  

At  this  moment  we  have  just  almost  configured  the  first  tag.  The  only  thing  which  is  left  

before  testing  and  publishing  it  is  to  add  a  rule  which  will  allow  us  to  set  the  rules  when  

Page 29: Google Tag Manager (Manual in English)

     

29  

GTM  has  to  fire  a  given  tag.  

 

Rules  are  set  in  interface  in  the  right  upper  corner.  To  be  fired  each  newly  created  tag  will  

need  a  rule.  It  will  not  work  without  the  rule.  What  we  have  to  do  is  to  wonder  now  when  a  

given  tag  is  to  be  fired.  Our  first  Google  Analytics  tag  is  to  be  fired  on  each  subpage  of  our  

service.  It  is  quite  obvious  because  we  want  to  collect  data  about  all  pageviews  on  our.  

Then  we  have  to  set  the  rule  which  will  fire  a  tag  on  each  website  of  the  service.    

 

   

When  we  want  to  add  a  new  rule  a  window  of  its  choice  will  occur.  We  can  choose  rules  

that  already  exist  and  which  we  have  created  earlier  for  other  tags  from  the  list  or  create  a  

new  one.  In  the  case  of  new  accounts  and  containers  we  have  to  create  rules  from  the  

beginning.  

 

As  you  can  see,  a  rule,  which  we  are  interested  in,  is  already  available  in  standard  –  fire  it  

on  each  subpage.  You  have  to  only  mark  it,  and  it  is  ready.  In  the  case  of  creating  new  rules  

we  have  to  create  a  rule  about  conditions,  which  have  to  be  satisfied  so  that  a  given  tag  

could  be  fired.  We  will  deal  with  creating  more  advanced  rules  later  in  this  e-­‐book  by  the  

way  of  creating  a  tag  for  tracking  AdWords  conversion  where  we  will  describe  creating  of  

rules  more  extensively.  

 

Page 30: Google Tag Manager (Manual in English)

     

30  

 

Testing  a  newly  created  tag  

 

We  have  created  the  first  Tag.  Before  we  publish  it  on  the  website  it  is  worth  testing  and  

seeing  if  it  works.  As  you  can  see  below,  our  version  of  the  tag  is  unpublished.  It  means  that  

changes  introduced  by  us  did  not  come  into  effect.  It  is  always  worth  paying  attention  to  it  

because  it  is  one  of  more  frequent  mistakes  which  are  made  by  not  only  beginners.  If  we  do  

not  publish  changes  (a  new  container  version)  we  will  not  see  them  live.  They  could  be  

seen  only  in  Preview  –  Debug.    

 

 

 

However,  before  we  publish  anything  we  have  to  verify  it.  We  choose  the  “Preview”  option  

and  then    “Debug”  option  (see  p.17).  Let’s  move  to  our  website  in  a  new  tab  of  a  browser  

and  refresh  the  view.  Thanks  to  this  a  console  will  occur  at  the  bottom  of  the  screen  with  

information  if  our  tag  is  fired  under  conditions  defined  by  rules.  

 

Page 31: Google Tag Manager (Manual in English)

     

31  

 You  can  see  in  the  console  that  our  tag  has  been  fired.  Everything  works.  Now  we  can  come  

back  to  the  tab  with  opened  Tag  Manager  and  publish  the  version.  To  do  this  we  create  a  

new  version  and  publish  it.  A  new  version  is  created  now  (in  our  case  version  no.  4).  

   

Pay  attention  to  a  yellow  bar  at  the  top  with  a  message  about  the  preview  on  our  website.  If  

we  now  go  to  the  website  we  will  see  all  the  time  the  console  at  the  bottom  of  our  website.  

Thus,  if  we  finish  the  work  we  can  quit  this  mode  (For  clarity,  a  preview  mode  is  seen  only  by  

Page 32: Google Tag Manager (Manual in English)

     

32  

us,  other  users  cannot  see  it.  They  could  see  it  if  we  would  sent  them  a  special  link  to  the  

preview,  which  I  have  written  about  before).      

 

 

Next  steps  

 

Our  first  tag  has  been  published.  Now,  we  are  ready  to  install  next  tags  which  will  be  

needed  to  track  our  advertising  actions  and  not  only.  However,  before  we  move  to  the  next  

tags,  we  should  mention  about  a  very  useful  tool  which  will  allow  us  to  see  if  our  website,  

or  any  other,  has  installed  and  working  tags.  This  tool  is  Tag  Assistant.  It  is  a  simple  and  

friendly  plug-­‐in  to  Chrome  browser.  

 

   

 

Thanks  to  Tag  Assistant  we  can  easily  verify  what  tags  are  working  on  the  website  being  

viewed  by  us.  We  will  get  guidelines  and  suggestions  concerning  tag  implementation.  Tag  

Assistant  is  a  tool,  which  is,  we  can  say,  obligatory.  Assistant  can  be  downloaded  free  from  

Google  Chrome  shop.  

 

Page 33: Google Tag Manager (Manual in English)

     

33  

Installation of Google AdWords conversion tracking with GTM  

In  the  previous  chapter  we  managed  to  create  the  first  tag,  which  is  used  for  tracking  

displays  with  Google  Analytics.  We  have  created  the  account,  the  container,  then  the  tag  

where  we  have  chosen  its  type  (Google  Analytics)  and  defined  when  our  tag  has  to  be  fired  

(rule).  In  this  step  we  will  create  a  tag,  which  will  service  AdWords  conversion  tracking.  

 

 

AdWords  or  other  conversion  tracking    

 

What  do  we  actually  need  for  conversion  tracking?  We  need  to  measure  traffic  on  the  

website  or  a  number  of  actions  which  will  confirm  that  the  conversion  took  place.    For  

example,  a  classical  example  of  a  conversion  are  displays  of  the  website  “Thank  you  for”  –  

purchase,  contact,  etc.  That  is  the  website  which  is  displayed  only  when  a  user  did  some  

action  desirable  by  us,  for  example,  filling  in  the  form.  A  classical  conversion  path  seems  to  

look  more  or  less  like  this:    

 

 

Main  website  -­‐>  category  website  -­‐>  product  website  -­‐>  form  -­‐>  payment  -­‐>thank  you.  

 

 

To  track  the  conversion  we  need  to  track  the  last  website  -­‐  “Thank  you”  with  the  special  

code  called  the  conversion  tracking  code.  During  visits  from  AdWords  ads,  the  code  is  

compared  to  a  cookie,  which  was  granted  to  users  at  the  moment  of  clicking  on  the  advert.  

If  data  from  the  cookie  matches  data  from  the  tracking  code,  a  conversion  is  counted.  

It  is  a  description  of  working  in  short,  but  it  is  only  to  remind  it  and  to  eliminate  the  mental  

shortcuts  of  the  author.  

   

To  track  conversions  we  need  an  address  of  the  "Thank  you”  website  and  we  have  to  place  

a  suitable  conversion  code  on  this  website.  So  far,  it  has  been  as  follows:  

Page 34: Google Tag Manager (Manual in English)

     

34  

 

1.  We  have  generated  a  conversion  code  in  AdWords  account  

2.  We  have  copied  the  code.  

3.  We  have  edited  the  "Thank  you”  website    

4.  We  have  pasted  the  conversion  code  in  the  code  somewhere  at  the  end  of  the  website  

just  before  the  closing  </body>  tag.  

 

 

Implementation  of  the  conversion  tracking  code  with  GTM  

 

At  present,  thanks  to  GTM,  we  do  not  have  to  edit  the  website  to  implement  conversion  

tracking  code.  You  only  have  to  create  a  suitable  tag  in  GTM  and  give  it  proper  rules.  As  it  is  

assumed  the  code  is  to  be  fired  on  “Thank  you”  pages.  So  to  create  the  conversion  tag  we  

have  go  through  a  few  steps:  

 

1.  Create  a  conversion  in  AdWords  account  

2.  Create  a  conversion  tag  in  GTM  

3.  Give  a  rule  when  the  code  is  to  be  fired  

4.  Test  and  publish  the  new  container  version.  

 

 

 

Ad1.  Creating  a  conversion  in  AdWords  account  

 

To  start  tracking  the  effectiveness  of  our  actions  thanks  to  conversions,  first  we  have  to  

create  such  a  conversion  in  our  AdWords  account.  We  have  copied  the  whole  code  before  

and  pasted  it  onto  the  website.  Now  we  need  only  two  things  –  the  conversion  ID  and  its  

label.  To  do  this  we  need  to  preview  the  code  of  conversion  created  by  us  in  AdWords  

interface  (Tools  tab  -­‐>  Conversions  -­‐>  code).  

 

Page 35: Google Tag Manager (Manual in English)

     

35  

   

Ad  2.    Creating  a  conversion  tag  in  GTM  

 

We  already  have  ID  and  the  label  of  the  conversion,  thus,  we  can  move  to  create  a  

conversion  tag  and  start  to  track  a  conversion  with  GTM.  

 

Page 36: Google Tag Manager (Manual in English)

     

36  

   

1.  Create  a  new  tag  in  our  container  

2.  Give  it  a  proper  name  

3.  As  a  type  choose  AdWords  Conversion  Tracking  

4.  Add  copied  ID  and  label  from  the  conversion  code  generated  before  (a  conversion  

value  is  non-­‐obligatory  and  we  do  not  have  to  give  it).  

5.  Add  a  rule  when  the  code  is  to  be  fired.  

 

 

Everything  is  clear  to  the  step  no.  4  but  in  the  step  no.  5  we  have  to  stop  for  a  while  to  say  

something  more  about  rules.  Remember  that  we  have  to  track  the  conversion  on  the  

website  of  “Thank  you”  type.  In  our  case  the  website  of  this  type  is  the  website  after  filling  

in  the  form  whose  address  is  www.test_website.com/thankyou.html.  

We  want  a  conversion  code  to  be  displayed  only  on  this  website.  We  do  not  want  this  code  

to  be  active  on  any  other  website.  Therefore,  we  create  the  rule,  which  will  guarantee  this  

to  us.  

 

We  choose  "Add  the  rule”  and  then  "Create  a  new  rule”.  As  you  can  see  in  the  image  below,  

rules  are  created  from  two  parts:  variable  (macros)  and  value.  In  this  case  we  choose  

Conversion  value  (optional)  

Page 37: Google Tag Manager (Manual in English)

     

37  

{{url}}  macro  which  is  responsible  for  considering  URL  addresses  and  values  of  this  

variable  that  is  the  address  of  our  website  –  thankyou.html.  Between  these  parts  we  choose  

a  logical  parameter,  which  will  be  a  principle  of  their  combination.  

.    

 

In  our  case  the  whole  condition  (rule)  says  as  follows:  If  the  URL  address  includes  the  

"thankyou.html"  string  of  characters,  fire  the  conversion  tracking  tag.  

 

 Of  course  we  can  choose  other  logical  conditions  such  as  "equals”,  "does  not  equal”,  "ends”,  

etc.  

 

Page 38: Google Tag Manager (Manual in English)

     

38  

Actually  we  could  stop  here  because  we  have  done  everything  correctly.  Now  we  have  to  

test  (Debug,  Preview)  possibly  if  everything  works  properly,  create  a  new  version  and  

publish  it.  Voila,  another  tag  on  our  website  has  been  installed.  

 

However,  there  is  one  detail  yet  which  was  not  explained  here  fully.  Macros.  

Indeed,  we  have  used  {{url}}  macro.  The  question  is,  where  is  it  from  and  what  is  it  about?  I  

will  try  to  explain  the  subject  of  macros  here  but  their  use  will  be  used  in  most  of  our  

actions  in  GTM  so  the  subject  of  macros  will  be  present  almost  in  every  example.    

The first contact with macros in Google Tag Manager

 

As  I  have  mentioned  at  a  very  beginning,  macros  are  used  for  automating  and  simplifying  

work  with  data  in  GTM.  It  is  quite  a  general  description  but  it  is  enough  for  the  beginning.  

Macros  are,  in  fact,  links  between  data  on  the  website  and  our  tags,  macros  may  convey  

values  between  a  website  and  individual  tags,  macros  may  also  be  a  basis  for  building  

conditions  of  firing  tags  (in  this  way  we  have  used  {{url}}  macro).  In  the  previous  chapter  

we  have  created  also  the  first  macro  where  the  value  was  the  ID  number  of  our  Analytics  

account.  

If  we  want  to  create  the  rule  in  which  there  are  variable  values  depending  on  a  situation,  

we  will  use  the  macro  then.    Like  URL  addresses  have  a  lot  of  variables  and  all  are  taken  

into  consideration,  we,  in  our  example,  have  placed  the  value  “thankyou.html.”  for  our  

{{url}}  macro.    

 

 

This  all  constitutes  an  opinion  that  macros  are  one  of  the  most  essential  elements,  which  

we  have  to  deal  with  in  GTM.  I  think  that  even  if  a  macro  is  something  abstract  at  this  

moment,  it  will  not  be  when  we  will  consider  many  examples.    

 

Page 39: Google Tag Manager (Manual in English)

     

39  

Below,  there  is  a  list  of  all  macros,  which  are  currently  on  my  account.  A  part  of  them  is  

standard  and  present  from  the  beginning  on  the  account,  the  rest  need  to  be  created.  So  far  

we  have  created  one  macro  concerning  ID  of  Analytics  account  to  make  the  work  easier,  we  

have  used  one  ready  {{url}}  macro  to  define  the  rule.  Now  there  is  a  turn  to  explain  more  

about  macros.  

 

 

 

What does the macro consist of and how is it created?  

As  you  can  see,  the  macro  always  consists  of  two  braces  and  a  name,  e.g.  {{url}}.  

In  this  way  we  always  use  macros  within  GTM.  

 

Each  macro  has  its  type.  It  can  be  a  macro,  which  will  be  used  for  defining  url  addresses,  

but  there  are  several  types  of  macros.  For  example,  the  macro,  which  we  have  created  at  

the  beginning  for  the  need  of  ID  account,  was  simply  a  string  of  characters  “Constant  

string”.  

 

Page 40: Google Tag Manager (Manual in English)

     

40  

   

As  you  can  see  in  the  image  above  there  are  quite  a  lot  of  macros.  So  far  we  have  used  two  

macros  but  we  need  to  use  a  greater  number  of  them.  

 

We  will  create  macros  up  to  date,  if  we  need  to  combine  data  from  the  website  with  our  

tags.  Depending  on  what  a  given  macro  will  have  to  provide,  we  will  use  such  a  macro.  

 

I  think  that  we  can  now  put  the  subject  of  macros  aside.  In  the  next  examples  we  will  come  

back  to  it  many  times  yet  and  explain  their  work  

Implementation of Google AdWords remarketing with GTM  

So  far  we  have  placed  two  very  important  tags  on  our  website  –  Google  Analytics  and  the  

tracking  code  of  AdWords  conversion.  Another  important  and  what  is  more,  basic  code,  

which  is  commonly  displayed  on  pages,  is  a  remarketing  code.    

 

In  this  e-­‐book  I  will  not  explain  what  remarketing  is  because  this  subject  is  not  the  subject  

of  this  publication.  We  can  say  only  that  the  remarketing  code  is  a  code  which  is  used  for  

Page 41: Google Tag Manager (Manual in English)

     

41  

bringing  back  users  on  the  website  with  the  help  of  adverts,  users  who  did  or  did  not  do  

any  action  on  our  website  e.g.  did  not  buy  any  product  and  left  our  service.  It  is  a  classical  

example  but  there  are  lots  of  applications  of  remarketing.  We  will  focus  here  on  a  technical  

side  that  is  on  implementation  of  the  remarketing  code  on  particular  pages  of  our  service.  

 

 

Creating  a  remarketing  tag  

As  in  the  previous  chapters,  we  create  a  new  tag  in  GTM  and  choose  its  kind  as  

remarketing.  We  also  have  to  obtain  ID  of  the  remarketing  code.  

To  do  this  we  have  to  visit  our  AdWords  account  and  a  “Shared  library”  tab  then  

“Audiences”.    There  are,  or  there  will  be,  our  remarketing  lists.  

 

Let’s  move  to  an  option  of  displaying  the  details  of  the  remarketing  tag  and  from  there  we  

have  to  obtain  the  ID  number  of  our  tag,  which  will  be  displayed  in  a  moment  in  GTM.  

 

     

   

Page 42: Google Tag Manager (Manual in English)

     

42  

We  come  back  to  Tag  Manager  and  place  ID  in  a  suitable  place.  Only  ID  is  necessary,  we  do  

not  have  to  give  labels,  which  were  deleted  in  common  remarketing  code.  Only  if  we  create  

new  codes  in  one  account,  there  will  be  need  of  distinguish  them  with  labels.      

Labels  are  used  for  a  unique  labeling  conversion  codes  on  the  account.  Now  we  can  use  one  

code  and  we  create  remarketing  lists  on  the  basis  of  this  code  and  rules  defining  when  the  

list  is  to  collect  cookies.  That  can  be  done  directly  from  AdWords  account.  

 

 

   

Now  we  have  to  only  create  a  rule  when  a  given  remarketing  code  will  be  called  to  collect  

cookies  (i.e.  website  visitors).  We  almost  always  start  adventure  with  remarketing  from  

building  the  list  of  cookies  of  everyone  who  visited  our  website.  Hence,  in  this  example  we  

will  use  the  same  rule  like  in  the  case  of  Google  Analytics  (all  pages).  A  code  is  to  be  called  

on  every  website  of  our  service.  That  means  that  the  remarketing  cookie  will  be  given  to  

each  browser1,  who  will  visit  our  service,  no  matter  what  subpage  of  the  service  it  meets.  

 

 

 

                                                                                                               1 Writing about users or people we have to consider that it is a mental shortcut because we really think

Page 43: Google Tag Manager (Manual in English)

     

43  

   

A  remarketing  code  can  be  fired  also  with  the  help  of  other  rules.  We  could,  for  example,  

create  a  rule,  which  will  fire  the  remarketing  tag,  if  somebody  clicks  on  the  link  or  a  button.  

We  can  create  rules,  which  will  fire  the  list  after  the  time  chosen  by  many  others  and  us.  

While  reading  this  e-­‐book  we  will  get  to  know  how  to  create  such  rules.    

 

While  we  now  fire  the  tag  on  every  website  of  our  website  we  can  then  create  remarketing  

lists  directly  on  our  AdWords  account  based  on  fired  remarketing  tag  and  rules  set  on  

AdWords  accounts  while  creating  new  remarketing  lists.    

 

In  the  image  from  the  previous  website,  we  can  see  also  something  which  is  marked  as  

"Customs  parameters”.  These  parameters  are  used  for  creating  more  advanced  conditions  

of  firing  tags.  We  can,  for  example,  download  data  from  the  website  about  values  of  a  

customer’s  basket  and  depending  on  its  value  fire  the  remarketing  tag  or  (add  to  the  list  or  

not).  We  use  these  parameters  in  creating  a  campaign  of  dynamic  remarketing.  In  this  place  

our  adventure  with  something,  which  is  called  Data  Layer,  starts.  

 

Data  Layer  is  probably  the  most  important  functionality  of  Google  Tag  Manager  because  it  

makes  data  on  the  website  dependent  on  the  website  code  itself  and  makes  that  data  from  

the  website  become  available  for  many  our  tools  which  we  have  on  the  website.  We  can  

compare  Data  Layer  to  a  universal  plug-­‐in,  which  we  can  buy  at  the  airport,  to  which  from  

one  side  we  can  connect  a  laptop  and  from  the  other  we  can  plug  any  socket  all  over  the  

Page 44: Google Tag Manager (Manual in English)

     

44  

world.    

In  the  same  way  data  from  our  website,  thanks  to  such  a  universal  plugin,  can  be  

comprehensible  for  many  tools  and  there  is  no  need  to  connect  them  separately  to  the  

website.  We  will  talk  about  Data  Layer  in  details  later  in  this  e-­‐book,  so  do  not  worry  that  

now  it  can  be  a  little  unclear.  

 

Important!  At  this  moment  we  can  create  remarketing  lists  within  Google  Analytics,  which  I  

encourage  to.  Thanks  to  GA  we  can  create  lists  based  on  many  actions  of  users  of  our  

website.  We  do  not  have  to  use  an  AdWords  remarketing  code  then.  We  create  remarketing  

lists  in  the  Analytics  interface  itself.  (Until  now  remarketing  is  not  serviced  by  Universal  

Analytics).  

 

 

 

Page 45: Google Tag Manager (Manual in English)

     

45  

Google Tag Manager – advanced cases of use  

On  previous  pages  we  have  discussed  the  most  frequent  and  basic  methods  of  using  GTM  in  

work  with  tags  on  our  website.  We  have  installed  a  basic  Google  Analytics  code,  AdWords  

conversion  tracking  and  a  remarketing  code.  Most  installations  end  here.  However,  times  

are  different  now,  so  we  need  more  and  more  data  to  collect  and  process  from  our  website,  

we  need  to  understand  more  and  more  precisely  what  visitors  of  our  website  really  need,  

we  need  to  better  aim  our  marketing  campaigns,  etc.  That  is  why,  surely,  there  is  a  need  of  

additional  operations  on  data  which  are  on  our  website,  we  will  want  to  examine  every  

area  of  the  website,  we  will  want  to  mark  every  visitor  in  a  better  way.    

 

 

So,  there  will  be  some  play  at  more  advanced  implementation  and  use  of  GTM  possibilities.  

In  this  part  there  are  the  most  useful  and  popular  advanced  configurations  of  tags  and  

macros,  so  that  we  could  measure  everything  on  the  website  and  run  effective  marketing  

campaigns.  The  examples  below  will  help  us  understand  better  the  work  of  Google  Tag  

Manager  tool.      It  will  allow  us  to  move  easily  in  it  and  configure  any  tags.  

 

Data Layer – what is it and what is it used for?  

Before  we  move  to  advanced  implementations,  which  I  will  try  to  describe  step  by  step,  it  is  

important  for  us  to  understand  one  of  the  most  important  functionality  of  GTM  that  is  Data  

Layer.  

What is Data Layer?  

Data  Layer  is  a  combination  of  structured  API  Data  and  interfaces,  which  allow  making  use  

of  a  universal  format  (JSON)  of  tagging  services  and  sending  data  to  the  management  

system  (GTM).  In  this  way,  data  are  available  for  many  tools  with  no  need  to  tag  the  

website  each  time  by  separate  formats  for  every  tool  which  we  want  to  connect.  Not  clear?  

Page 46: Google Tag Manager (Manual in English)

     

46  

Neither  to  me;)  So  in  simpler  words.  

 

Having  many  marketing  systems  to  connect  to  our  website  we  have  to  add  for  each  time  a  

special  code  (plugin)  for  every  tool  separately.  Each  tool  usually  works  in  a  different  way.  

 If  we  have  many  things  to  measure  (buttons,  purchase  systems,  basket,  etc.)  and  a  lot  of  

tools,  there  can  be  quite  a  big  mess  on  our  website.  An  employee,  who  dealt  with  it,    quits  

his  job  and  we  want  to  change  something  and  we  have  a  big  problem.  A  remedy  for  such  a  

situation  is  just  Data  Layer  which  has  been  compared  before  to  the  universal  plugin  which  

we  can  apply  in  every  country.  

 

 

 

Page 47: Google Tag Manager (Manual in English)

     

47  

Data  Layer  is  a  kind  of  "translator”  like  English  for  different  kind  of  tools,  as  far  as  data  on  

our  website  are  concerned.  Everyone  loves  their  mother  tongue  but  not  everywhere  in  the  

world  we  can  communicate  in  it  and  we  need  a  universal  language.  In  our  world,  if  we  want  

or  not,  it  is  English.  In  the  world  of  data  it  is  Data  Layer.  

 

Thanks  to  this  information  from  the  website  such  as  events  (e.g.  button  clicks)  or  values  

can  be  sent  to  Google  Tag  Manager  just  by  Data  Layer.  After  that  in  the  GTM  tool  itself  we  

create  rules  on  the  basis  of  these  values.  For  example  “Call  a  remarketing  code  (tag)  when  

the  value  of  a  basket  is  higher  than  300  USD  (variable=basket,  value=300).  Rules  can  be  in  

this  case  created  for  each  tool  which  is  connected  on  our  website.  That  is  the  secret  of  Data  

Layer.  

 

Data  Layer  fulfills  also  other  roles.  It  allows  to  separate  data  from  the  layer  of  the  website  

code  (html,  css).  As  we  separated  the  style  layer  before  (how  the  website  looks  like)  thanks  

to  CSS  language,  now  we  separate  data  from  the  layer  of  the  website  code  itself.  While  

modifying  something  on  any  layer  we  do  not  violate  the  structure  of  the  rest.  It  gives  

security  and  order  in  administering  of  our  services.  

 

 

Page 48: Google Tag Manager (Manual in English)

     

48  

How  does  Data  Layer  look  like?  

 

Data  Layer  is  built  into  the  container  code,  if  we  want  to  send  information  from  the  website  

(e.g.  events  like  clicks)  you  have  to  only  send  them  to  Data  Layer  with  the  help  of  push  

method.  For  example,  if  we  want  to  send  information  to  Data  Layer  that  somebody  has  

clicked  the  button  we  place  the  following  code  fragment  in  the  website  code:  

 

<a  href="#"  onclick="dataLayer.push({'event':  'sample-­‐link'});">Sample  link</a>  

 

If  someone  has  something  in  common  with  Javascript  language  they  know  that  the  push  

method  simply  adds  data  to  the  array.  And  this  just  happens.  For  those  who  are  not  familiar  

with  issues  of  programming,  information  that  method  works  the  same  like  in  the  case  of  

labeling  events  in  Google  Analytics  is  enough.  

 

In  this  example,  at  the  onclick  moment  the  information  to  Data  Layer  that  the  event  

happened  with  the  value  ‘sample-­‐link’  is  sent.    

   

In  this  way  this  information  can  be  used  by  any  tag  which  is  installed  on  the  website  by  

GTM.  For  example,  we  can  “order”  Google  Analytics  to  register  onclick  events,  we  can  

“order”  remarketing  tag  to  mark  the  user  who  has  clicked  on  the  link  (to  add  them  to  the  

list  of  users  who  have  clicked  on  the  link)  or  we  can  register  the  conversion  in  AdWords  

with  the  help  of  tag  of  AdWords  conversion  tracking.  

 

One  event  label  which  was  sent  to  Data  Layer  and  many  possibilities  of  being  used  by  many  

tools.  This  is  the  power  of  Data  Layer.  

 

Page 49: Google Tag Manager (Manual in English)

     

49  

Adding variables and values to Data Layer  

In  the  previous  paragraph  we  have  added  one  variable  (event)  and  one  value  (sample-­‐link)  

to  Data  Layer2  .  Such  adding  data  to  Data  Layer  will  take  place  only  just  when  the  website  is  

loaded  and  the  user  clicks  on  the  marked  link.    

 

However,  we  can  send  data  earlier  during  loading  the  website.  In  this  way  tags  which  will  

be  loading,  while  loading  the  website,  will  be  able  to  use  data  sent  to  Data  Layer.  We  have  

to  send  such  data  at  the  moment  of  downloading  the  website.  We  do  this  by  a  simple  array  

(again  the  element  very  well-­‐known  to  people  who  know  Javascript).  The  empty  table  looks  

like  this:  

 

 

   

The  essential  fact  is  that  the  array  of  Data  Layer  is  above  the  container  script.  It  is  very  

important.  Now  we  will  add  pairs  of  information  (variable  and  value)  inside  this  array.  We  

will  explain  how  it  looks  like  in  a  moment.  

 

A  good  example  is  information  if  the  user  who  has  entered  the  website  is  logged  in  or  not.  

If,  for  example,  the  user  is  not  logged  in  we  add  him  to  the  remarketing  list  of  people  who  

                                                                                                               2  Of  course  we  can  send  such  pairs  variable  :  value  as  many  as  we  want  for  one  event.  More  in  Google  Tag  Manager  help.    

Page 50: Google Tag Manager (Manual in English)

     

50  

have  not  been  registered  yet.  If  we  have  such  a  case,  it  is  important  so  that  data  get  to  GTM  

as  soon  as  possible.  

 

In  this  situation  we  have  to  send  information  while  loading  an  individual  subpage.  That  is  

why  we  send  information  about  the  kind  of  user  to  Data  Layer.  

 

   

In  this  example  we  added  two  pieces  of  information.  

variable:  “visitor-­‐type”  of  value  –  “unregistered”  and  variable:  “category”  of  value  –  

“signup”.  

 

Except  information  about  the  kind  of  a  user,  we  have  send  at  once  information  about  the  

kind  of  the  subpage  (category)  which  the  user  is  on.  The  unregistered  user  found  himself  

on  the  “signup”  subpage.  The  website  category  may  be  helpful  e.g.  in  a  dynamic  

remarketing.  

 

Thanks  to  the  fact  that  data  were  immediately  in  Data  Layer,  tags  which  are  loaded  on  the  

website  can  make  use  of  these  data  at  once  with  no  need  of  any  visitor's  action  on  the  

website.    

 

We  can  send  any  amount  of  data  to  Data  Layer.  There  is  one  question  which  can  occur  -­‐  

Page 51: Google Tag Manager (Manual in English)

     

51  

Where  are  these  data  to  get  from?  Unfortunately,  in  this  particular  situation,  our  website  

will  often  require  interventions  of  somebody  who  will  be  able  to  send  data  

programmatically  to  Data  Layer  e.g.  from  our  shop  or  registration  system  (data  from  a  data  

base,  server).  If  somebody  has  used  the  ecommerce  Google  Analytics  module  on  their  

website,  the  matter  of  sending  variable  values  to  Data  Layer  is  analogical.  Simply  speaking  

(not  programmatically):  in  Data  Layer  there  must  be  values  from  our  shop,  from  a  sales  

module,  etc,  which  will  be  recorded  clearly  for  GTM  (read:  variable  –  value).  It  can  be  e.g.  a  

basket  value  which  will  be  sent  to  Data  Layer  from  our  shop,  thanks  to  which  GTM  (and  

other  tags  installed  there)  will  be  able  to  use  this  value  e.g.  to  create  conditions  of  firing  

tags.  

 

NOTICE:  Data  Layer  is  not  required  in  any  way.  Without  Data  Layer,  GTM  will  also  fulfill  its  

role  of  “tag  storage  and  management”.  However,  lack  of  Data  Layer  limits  a  lot  possibilities  

which  GTM  gives  to  us.  

 

After  this  short  comment  about  what  Data  Layer  consists  in  we  can  go  to  more  advanced  

examples  of  using  GTM  in  work  with  measuring  our  activity  in  the  Internet.  

 

If  we  want  to  see  what  was  loaded  to  Data  Layer  we  can  easily  check  it  with  the  help  of  the  

console  for  programmers  for  example  in  Chrome  browser.  We  enter  the  menu  View  -­‐>  

Developer  -­‐>  Javascript  console.  

 

 

Page 52: Google Tag Manager (Manual in English)

     

52  

 

After  loading  the  website  with  our  Data  Layer  we  type  in  "dataLayer”  in  the  Console  tab.  In  

objects  we  will  be  able  to  preview  what  was  really  loaded  to  Data  Layer  and  sent  to  Tag  

Manager.  A  greater  part  in  this  case  are  automatic  objects  of  GTM  but  as  you  can  see  our  

data  sets  which  were  loaded  during  loading  the  website  with  the  table  added  above  the  

container  were  added  into  the  first  object.  

 

Event tracking in Google Analytics with GTM  

In  the  previous  steps  we  have  learned  what  Data  Layer  is  and  what  it  is  used  for.  So  that  

GTM  understands  events  which  we  are  going  to  track,  for  example,  with  Google  Analytics,  

we  have  to  send  them  to  Data  Layer  with  the  help  of  push  method3.  If  we  want  to  measure  

an  event  on  our  website  which  will  be  the  button  click,  we  have  to  send  to  GTM,  through  

Data  Layer,  that  the  event  of  a  given  value  happened.  

   

A button click as an event in Google Analytics  

In  the  situation  when  we  want  to  measure  the  button  click  as  an  event  in  Google  Analytics  

with  GTM  we  have  to  do  the  following  actions:  

 

1.  Modify  the  website  code  –  Mark  the  button  click  as  an  event  in  GTM  

2.  Create  Google  Analytics  tag  in  GTM  –  create  a  tag  responsible  for  the  event  in  GA  

3.  Create  suitable  rules  when  our  GA  tag  is  to  be  fired.  

 

Ad  1.  Modification  of  the  website  code    

What  we  have  to  do  now  is  to  send  to  Data  Layer  the  information  that  the  event  –  the  

button  click  –  happened.  We  will  use  the  push  method  to  do  this.    

                                                                                                               3 "The push method is very well-known for everyone who knows Javastript language at least at the basic level, where the push method allows to add values to the array created before. Data Layer is such a array in our case. More about the push method can be read on: http://www.w3schools.com/jsref/jsref_push.asp

Page 53: Google Tag Manager (Manual in English)

     

53  

How  will  it  look  like  in  practice  step  by  step?  

 

1.  Type  in  a  website  address  to  the  browser  and  press  enter.  

2.  The  container  with  our  tags  and  the  rest  of  the  website  is  loaded.  

3.  If  there  is  the  click  on  a  marked  button,  with  the  push  method,  information  about  an  

event  is  sent  to  Data  Layer.  

4.  If  the  event  satisfies  any  rule  within  GTM,  a  given  tag  is  fired.  

 A  DataLayer  array  works  and  sends  data  to  the  container,  if  any  variables  and  values  are  

placed  in  it.  If  not,  it  is  not  obligatory  in  the  website  code.  

 

Thus,  how  will  this  look  like  in  practice  for  the  event  measured  in  Google  Analytics?  

 

1.  Choose  the  button  which  you  want  to  measure  as  an  event,  

2.  Edit  the  website  where  the  button  (link)  is4,  

3.  Mark  the  button  with  the  push  method  with  the  type  of  onclick  event.  

                                                                                                               4 We have to have an access to source files of the website with the possibility of their editing. If we do not know how to do this the best solution is to go with this guidebook to somebody who has the rights to edit pages.

Page 54: Google Tag Manager (Manual in English)

     

54  

The  type  of  the  onclick  event  is  again  the  element  of  Javascript  language.  “Onclick”  fires  the  

event  after  pressing  the  button,  and,  for  example,  “onmouseover”  after  moving  onto  the  

object.  There  are  many  other  types  of  events  in  Javascript  language.  However,  these  two  

are  the  most  popular  ones,  as  far  as  measuring  interaction  with  the  website,  with  the  

mouse  is  concerned.  

 

The  sample  code  will  look  like  as  follows:  

dataLayer.push({'variable_name':  'variable_value'});  

Example  of  our  button  in  the  html  code  will  look  like  as  follows:  

 

<a  href=http://www.any-­‐website.com"  onclick="dataLayer.push({'event':'sample-­‐

link'});">Sample  link</a>5  

 

What  has  happened?  The  link  clicks  we  assigned  the  GTM  event  of  ‘event’  variable  and  

‘sample-­‐link’  value  to  the  “Sample  link”  button.  Then  we  send  these  data  with  the  push  

method  to  Google  Tag  Manager  (to  Data  Layer).  

 

In  the  same  way  we  can  send  the  event  like  „onmousover”  ,  i.e.  measure  moving  onto  the  

button  or  any  other  marked  element.  You  need  only  to  replace  the  type  of  event  from  

“onclick”  to  “onmousover”  6.  

   

 Creating  a  tag  for  event  tracking  in  Google  Analytics    

Having  already  a  marked  button  (or  link  or  any  other  website  element)  with  the  help  of  

push  method,  we  move  to  GTM  and  create  a  new  tag  responsible  for  receiving  "messages”  

about  clicks  from  Data  Layer  and  sending  it  to  Google  Analytics.  This  tag  is  a  Google  

                                                                                                               5 The example can be seen on www.rewolucja.com.pl/gtm.html 6 More types of events can be fund e.g. here: http://www.w3schools.com/js/js_htmldom_events.asp

Page 55: Google Tag Manager (Manual in English)

     

55  

Analytics  tag  of  a  track  type  -­‐  Events  

 

While  creating  Google  Analytics  tag  we  have  to  define  ID  of  Analytics  account  where  we  

want  to  track  a  defined  event  and  we  have  to  define  event  parameters.  According  to  the  

order  in  Google  Analytics7:  

<a  href="#"  onClick="_gaq.push(['_trackEvent',  'Videos',  'Play',  'Baby\'s  First  

Birthday']);">Play</a>  

Above  we  can  see  a  sample  Play  link,  marked  as  an  event  in  GA.  In  the  example  from  Google  

Analytics  we  have  defined:  

 

1. Event  categories  (e.g.  videos)    

                                                                                                               

7 More  on  events  in  Google  Analytics  can  be  read  in  Analytics  help  

https://developers.google.com/Analytics/devguides/collection/gajs/eventTrackerGuide#Anatomy  

Page 56: Google Tag Manager (Manual in English)

     

56  

2. Actions  (e.g..  play  )  

3. Label  (Baby\'s  First  Birthday  -­‐  optional)  

4. Value  (optional)    

 

We  did  this  in  the  case  of  the  GA  installation  on  the  website.  In  our  case  we  have  to  add  

these  values  into  right  columns  while  creating  the  tag  which  is  to  read  out  this  event.  In  our  

case  I  have  defined  three  variables:  

 

1. Event  category  (button)    

2. Event  action  (click)    

3. Label  (sample-­‐link)    

 

In  our  case  I  define  the  label,  although  it  is  a  non-­‐obligatory  variable,  like  the  value.  It  is  

worth  remembering  that  what  is  a  value,  action  or  label  depends  only  on  us.  It  is  worth  

considering  how  to  mark  our  events  reasonably,  to  be  clear  later  what  they  mean  in  Google  

Analytics  reports.    

 

   

 

 

Page 57: Google Tag Manager (Manual in English)

     

57  

Creating  rules  for  GA  event  tag  to  be  fired  

 

We  have  already  created  the  tag  to  read  events.  Now  we  have  to  create  the  rule  which  

allows  to  transfer  the  information  about  event  from  GTM  to  Google  Analytics.    So  let’s  move  

to  create  the  rule  in  the  right  column  of  the  website  of  the  tag  creation.  

 

 

What  we  have  just  done  on  image  above  requires  a  little  explanation  because  we  used  the  

{{event}}  macro.  Our  rule  named  “GA  event  –  sample  link”  says:  Fire  the  “UA  event”    tag  just  

only  when  the  {{event}}  macro  includes8  a  “sample-­‐link”  character  string.    

Do  you  remember  how  was  our  link  in  the  code  marked?  

<a  href=http://www.any-­‐website.com"  onclick="dataLayer.push({'event':'sample-­‐

link'});">Sample  link</a>9.  

During  the  click,  the  event  variable  is  to  take  “sample-­‐link”  value.  So,  during  the  link  click  

our  rule  will  be  satisfied  and  the  “UA  events”  (event  tracking)  tag  can  be  fired.  Thanks  to  

                                                                                                               8 It is possible to use „equals” in the rule.

9 The example can be seen on www.rewolucja.com.pl/gtm.html

Page 58: Google Tag Manager (Manual in English)

     

58  

this,  data  about  event  will  be  sent  to  Google  Analytics.  

Check  the  implemented  changes  by  the  Preview  tool  (Preview  –  Debug),  and  then  publish  

the  changes.  As  you  can  see,  everything  works.  

 

After  publishing  changes  we  know  that  GTM  fires  the  Google  Analytics  tag.  Now  it  is  worth  

checking  if  the  events  are  really  reported  in  GA.    To  do  this,  it  is  a  good  idea  to  use  reports  

of  Real  Time  in  Analytics  interface.  At  the  moment  of  click  it  is  better  to  be  logged  in  our  

Analytics  account.  In  reports  about  Real  Time.  

Page 59: Google Tag Manager (Manual in English)

     

59  

 

Everything  works  properly.  The  event  on  our  website  registers  correctly  in  Google  

Analytics.  However,  one  thing  may  still  not  be  completely  clear  –  macros.  In  our  example  

we  have  used  a  built-­‐in  {{event}}  macro.  The  macro  named  {{event}}  is  ready  to  use  type  in  

GTM.  It  is  a  special  type  of  the  macro  which  gains  value  at  the  moment  of  calling  it  by  the  

code:  

dataLayer.push({'event':  'value'});  

We  are  sending  to  Data  Layer  information  that  "event”  variable  gains  the  value  of  "value”.  

We  used  it  exactly  a  minute  earlier  calling  the  event  on  our  “sample  link”  website.  However,  

macros  have  many  types  which  can  be  used.  Each  type  of  the  macro  will  be  responsible  for  

gaining  different  types  of  values.  

 

Page 60: Google Tag Manager (Manual in English)

     

60  

 Macro  can  retrive  data  directly  from  Data  Layer,  from  the  source  code  of  website  (DOM  

elements10),  Cookies,  Javascript  codes,  URL  addresses  and  other.  

 

Thus,  we  can  choose  a  different  type  of  macro  and  create  another  condition  of  calling  our  

tag.  Thai  is  why,  we  can  create  more  complicated  rule.  

 

For  example  we  could  have  a  more  complicated  rule  conditions:  

 

Register  an  event  in  Google  Analytics  when  the  "event”  variable  will  have  value  of  „sample-­‐

link”  and  the  website-­‐type  will  have  value  “test-­‐site”.  We  want  to  retrieve  data  about  the  

website-­‐type  from  Data  Layer  to  which  it  was  added  while  loading  the  website.  

 

We  have  mentioned  before  about  adding  data  to  Data  Layer  while  loading  the  website,  so  

that  the  tags  could  at  once,  while  loading  webisite,  make  use  of  those  data.  Supposing  that  

our  website  has  a  definited  type  of  each  subpage.  There  are  subpages  of  products,  

categories,  registrations,  etc.    

Such  information  is  sent  GTM  by  the  dataLayer  array,  from  above  from  container.  In  our  

example,  the  website  category  will  be  named  “test-­‐site”,  and  the  table  may  look  like  this:  

                                                                                                               10 DOM elements are the elements in the website code such as DIV, HTML, BODY, ID. Thanks to the hierarchy and such a labeling of website code elements we can refer to them e.g. in javascript language.

Page 61: Google Tag Manager (Manual in English)

     

61  

 

We  added  a  "website-­‐type”  variable  of  a  value:  "test-­‐site”.  Data  will  be  available  in  GTM  

while  the  website  code  is  being  loaded.  So  you  need  only  to  create  a  macro  which  will  make  

use  of  those  data.  

 

For  example,  we  can  choose  a  macro  type  as  "Data  Layer  Variable”  and  name  it  a  "website-­‐

type”.  A  “website  category”  macro  is  ready.  

Now,  we  add  another  condition  concerning  the  website-­‐tape  to  our  previous  condition  

about  firing  the  GA  tag  which  registers  the  event    in  Google  Analytics.  

Page 62: Google Tag Manager (Manual in English)

     

62  

 

We  choose  the  macro  created  by  us,  that  is  the  "Website  category”  11.  That  macro  should  

equals  “test-­‐site”value  to  fire  our  GA  tag.    

After  saving  and  publishing  a  new  version  of  the  container,  the  event  in  Google  Analytics,  

after  the  button  click  "sample-­‐link”  will  register  only  when  a  website-­‐type  will  be  defined  

as  a  "test-­‐site”.  If  it  is  a  different  website-­‐type,  the  event  will  not  be  registered  because  

Google  Analytics  tag,  responsible  for  the  event  registration,  will  not  be  called.  

In  this  way  we  can  create  many  combinations  of  conditions  of  many  tags  actions  making    

use  of  different  types  of  data  (Data  Layer,  DOM  elements,  URL  and  others).  It  gives  wide  

possibilities  of  administering  many  tags  from  many  different  systems  and  applications.  

                                                                                                               11 The name for macros can be any. It is important to which it refers. I used "website-type" variable in "Website category" macro. I could name it "Website-type but in this case I have chosen different name. Macros can have any names, e.g. they can be named like variables they refer to. We have to keep an order in terminology because later, when more and more rules and macros are created we can have problems with administering them.

Page 63: Google Tag Manager (Manual in English)

     

63  

More buttons (events) to measure on one website

If  we  had  more  buttons  (events)  to  measure  on  one  website,  we  would  have  to  create  

separate  tags  for  measuring  each  event  in  Google  Analytics  with  a  method  described  above.  

However,  we  can  use  macros  and  then  one  tag  will  be  enough.  How  will  it  look  like  in  

practice?  

Again,  we  create  Google  Analytics  tag  which  will  be  responsible  for  the  event  registration.  It  

will  be  exactly  the  same  like  tag  as  we  have  created  in  the  example  above.  However,  while  

completing  the  column  about  event  parameters,  we  will  use  created  macros  instead  of  

specific  data  for  one  event  (as  we  had  done  before).  Google  Analytics  tag  configuration  will  

look  more  or  less  like  the  following:  

   

As  we  can  see,  we  have  introduced  macros  for  each  parameter  instead  of  values  for  one  

event.  Now  we  create  macros  which  will  have  equal  settings.  They  are  different  only  with  

the  names  of  the  macro  and  a  Data  Layer  variable.  

Page 64: Google Tag Manager (Manual in English)

     

64  

 

Finally,  we  should  have  such  macros  like  these:  

1. {{Event  Category}}  >>  variable  event-­‐category  

2. {{Event  Action}}  >>  variable  event-­‐action  

3. {{Event  Label}}  >>  variable  event-­‐label  

4. {{Event  Value}}  >>  variable  event-­‐value  

Now  for  each  button  which  we  want  to  measure  as  an  event  in  GA,  we  have  to  add  a  

possibility  of  sending  values  by  Data  Layer.  I.  e.  our  button  in  the  website  code  should  look  

like  the  following:  

<a  href=”http://www.any-­‐website.com"  onclick="dataLayer.push({'event':'sample-­‐link',  

‘event-­‐category’:’my-­‐category,’event-­‐action’:’action  name’,’event-­‐label’:’label-­‐

name’,’event-­‐value’:’event  value’});">Sample  link</a>  

 

What  have  we  done?  

 

We  have  added  variables  (these  ones  which  are  in  created  macros)  and  values  for  a  given  

button.  In  this  way  at  the  moment  of  the  click,  values  are  sent  to  event  parameters  in  GA  tag  

responsible  for  the  event  registration.  We  have  to  do  such  a  code  modification  for  each  

button.  

Page 65: Google Tag Manager (Manual in English)

     

65  

 

Measuring the action on the website with virtual pageviews

In  the  situation  when  we  analyze  usage  of  buttons,  links  or  other  functionalities  on  our  

website,  the  use  of  events  in  GA  is  absolutely  justified.  Events  do  not  generate  artificial  

pageviews  of  our  website  and  do  not  interfere  in  reports  on  website  traffic.  

However,  it  happens  that  some  elements  are  such  an  integral  part  of  service  that  measuring  

them  as  an  event  would  not  be  reliable  to  the  end.  Let’s  take,  for  example,  an  company’s  

offer  in  PDF  which  is  downloaded  by  website  visitors  and  then  read.  Perhaps  it  is  such  a  big  

and  important  part  of  the  website  that  most  visitors  visit  it  just  to  download  PDF.  In  such  

case  analysis  of    pageviews  may  be  better  then  events.  In  this  case  we  can  use  so  called  

virtual  pageviews.  How  to  do  this  with  Google  Tag  Manager?  

1. Tag  the  link  to  download  PDF  in  the  code  of  our  website  

2. Create  Google  Analytics  tag  responsible  for  pageviews  

3. Name  the  virtual  pageview  which  is  to  reflect  PDF  downloading  

4. Create  the  rule  which  is  to  fire  tag  during  the  click  on  PDF  link  

 

Ad  1.  Tag  PDF  link    

Our  link  to  download  PDF  may  look  like  the  following:  

<a  href="http://any-­‐website.pl/ebook.pdf"  

onclick="dataLayer.push({'event':'pdf'});">Download  PDF</a>  

Ad  2.  and  Ad  3.  Create  Google  Analytics  tag  

Our  new  tag  responsible  for  virtual  pageviews  will  look  like  in  the  image  below.  We  set  the  

track  type  as  pageviews  and  in  basic  settings  we  type  the  name  of  the  element  which  is  to  

be  registered  as  a  virtual  pageview  while  downloading  PDF.  In  this  moment  in  GA,  if  a  

Page 66: Google Tag Manager (Manual in English)

     

66  

pageview  is  registered,  in  the  report  on  the  contents  (Behaviour  >Site  content)  we  register  

a  pageview  of  the  subpage/  e-­‐book-­‐download.  

 

 

Ad  4.  Create  a  rule  

To  fire  the  tag  for  measuring  virtual  pageviews  we  need  also  to  define  a  condition  when  a  

given  tag  is  to  be  fired.  Thus,  we  create  the  rule  assigned  to  the  tag.  

 

Page 67: Google Tag Manager (Manual in English)

     

67  

 

The  rule  which  we  have  created  says:  If  the  "event”  variable  equals  pdf,  fire  the  tag  for  

tracking  pageviews  “UA-­‐  virtual  preview  (PDF)”.  There  is  only  one  thing  left,  to  check  if  

everything  works  correctly  (Preview  >  Debug)  and  after  that,  create  a  new  version  and  

publish  it.  

At  the  moment  of  Debug  type  we  can  log  in  our  Google  Analytics  account  and  see  in  live  

reports  if  GA  really  gets  information  about  pageviews  from  GTM.  

 

I  have  clicked  on  the  link  to  download  PDF  and  at  this  moment  a  registered  pageview  of  

subpage  /e-­‐book-­‐download  occurred  on  my  account.  Everything  works.  

Page 68: Google Tag Manager (Manual in English)

     

68  

There  are  more  ways  of  obtaining  information  about  clicks  on  a  specific  link  (e.g.  to  

download  pdf)  and  sending  them  as  an  event  to  GA.  We  will  learn  about  them  soon.  

Summary    

In  this  chapter  we  have  used  macros  several  times  to  create  events  in  GA.  Everything  works  

very  nice  but  there  is  a  quite  big  interference  in  the  website  source  code.  The  same  amount  

as  in  the  case  of  normal  Google  Analytics.  It  was  promised  to  be  so  beautiful,  without  

editing  the  website.  Right,  but  we  have  to  remember  that  we  edit  and  label  once  and  we  can  

do  further  whatever  we  want  in  GTM.  Now  many  different  tools  can  make  use  of  these  

labels  of  website  elements.  Not  only  Google  Analytics.  Labels  are  universal,  comprehensible  

for  other  programs,  not  only  for  the  one  (e.g.  GA).  But  still,  the  fact  is  that  there  is  a  lot  to  

edit.    

Here,  there  is  a  nice  surprise  because  GTM  allows  for  fully  automatic  work  with  website  

elements  with  no  need  of  their  labeling  and  code  editing.  Thanks  to  the  function  of  auto  

events  we  can  create  rules  based  on  the  website  content  and  then,  on  the  basis  of  it,  fire  

track  tags  in  GTM.  

So,  is  manual  tagging  pointless?  No.  Sometimes  there  are  such  situations  when  we  are  not  

able  to  use  auto  events,  for  example  when  the  website  code  and  element  labels  do  not  allow  

to  do  this.  Thus,  we  have  to  know  this  way,  despite  the  fact  that  we  will  learn  in  a  moment  

about  a  solution  which  eliminates  the  need  of  website  editing.    

How  do  auto  events  work  exactly?  We  will  learn  about  it  in  the  following  chapter.  

 

 

Page 69: Google Tag Manager (Manual in English)

     

69  

Auto event in GTM (auto event tracking)  

In  the  previous  chapter  we  have  learned  the  rule  of  macro  working  and  basic  methods  of  

event  tracking  with  GTM.  Our  solutions  discussed  so  far  require  quite  a  lot  of  interference  

in  the  website  code.  In  many  organization  each,  even  the  smallest,  modification  is  

connected  with  long  time,  obtaining  consents  and  acceptance,  etc.  Often  in  the  initial  phase  

we  resign  from  measuring  some  smaller  things  on  the  website,  just  because  of  

organizational  difficulties.    

 

Fortunately,  there  is  GTM  with  its  function  of  auto-­‐tagging.  

 

Auto-­‐tagging  is  nothing  more  than  defining  events  on  the  website  with  no  need  of  

interference  in  the  website  code.  In  this  case  we  define  only  conditions  which  have  to  be  

satisfied  so  that  GTM  accepted  the  action  on  the  website  (for  example  onclick)  as  an  event.  

These  conditions  may  be  e.g.  a  type  of  action  (clicking  on  the  button,  link),  ID  of  html  code  

section,  CSS,  (so  called  DOM  ID,  eg.  <a  href=”#"  id=”link-­‐to-­‐something”></a>)12,  URL  

addresses  and  many  other.  

 

So  that  everything  works  we  define  only  an  event  type  (any  onclick,  filling  in  the  form,  time,  

link  clicks)  and  conditions  (rules)  when  such  an  event  is  to  be  counted.  We  do  not  have  to  

ask  for  any  code  edition.  The  only  thing,  which  should  be  set  with  people  responsible  for  

the  website  code,  are  issues  of  labeling  different  elements  so  that  we  could  easily  edit  

conditions  for  event  defining  later  (about  it  in  a  minute).  

 

Auto-tagging in practice (introduction)  

What  does  this  interesting  function  consist  of,  where  we  do  not  have  to  interfere  in  the  

website  code  to  register  events?  It  consists  of  using  so  called  listeners  which  are  able  to                                                                                                                  12 In this example ID is "link_to something”.

Page 70: Google Tag Manager (Manual in English)

     

70  

receive  information  from  the  website  that  are  clicks,  filling  in  the  form  or  other  event  that  

has  happened.  How  does  it  work?  

 

GTM  tag  called  listeners  receives  signals  from  the  website  if  the  event  happens,  identifies  it  

and  automatically  add  it  to  Data  Layer.  Such  an  event  is  then  ready  to  be  used  by  tags  

installed  in  GTM  (e.g.  Google  Analytics  tag).  

 

Receiving  signals  -­‐>  event  registration  -­‐>  using  in  tags  and  rules  

 

 

To  understand  working  of  an  autotagging  function  in  the  easy  way  we  will  show  a  simple  

example.    

Auto measuring of clicks on the button (link)  

Let's  take  a  sample  link  from  our  test  website.  

 

 We  want  to  measure  clicks  on  this  link  as  an  event  in  Google  Analytics.  So  we  have  to  do  the  

following  actions:  

 

1. Create  the  tag  responsible  for  receiving  signals  from  the  website  (listeners).  

Page 71: Google Tag Manager (Manual in English)

     

71  

2. Define  the  rule  –  when  the  listener  is  to  be  fired  on  the  website.  

3. Create  Google  Analytics  tag  responsible  for  the  event  registration.  

4. Define  the  rule  when  the  event  is  to  be  registered  in  GA  

 

 

Ad  1.  Create  the  tag  responsible  for  receiving  signals  from  the  website  (listener)  

 

To  start  making  a  use  of  auto  event  tracking,  first  of  all,  we  have  to  create  the  tag  

responsible  for  "listening"  to  what  is  happening  on  the  website.  That  is  the  Listener.  We  

create  Listener  Tag  like  other  tags.  We  have  to  only  choose  such  a  type  of  it  which  will  be  

the  most  suitable  to  our  task.  

 

   

We  have  five  types  of  Listeners  in  GTM  at  our  disposal.  Each  of  them  is  responsible  for  a  bit  

different  event  types.  Before  we  start  to  create  auto  events,  let's  take  a  look  at  their  types:  

 

 

 

 

Page 72: Google Tag Manager (Manual in English)

     

72  

Click  Listener    

 

This  Listener  is  responsible  for  registration  of  all  kinds  of  clicks  on  the  website  (on  buttons,  

links  and  other  clicking  elements  of  the  website).  While  clicking  on  any  clicking  element,  

the  event  gtm.click  is  auto  generated  inside  Google  Tag  Manager.  

 

Form  Submit  Listener    

 

This  Listener  is  responsible  for  registration  of  form  submission  on  the  website.  At  the  

moment  of  the  form  submission  the  auto  event  is  generated  inside  GTM,  gtm.formSubmit  .  

 

Link  Click  Listener    

 

Click  Listener  is  responsible  for  link  click  registration.  It  can  be  mistaken  with  "Click  

Listener"  because  they  work  quite  similar.  "Link  Click  Listener"  is  recommended  to  be  used  

in  link  click  registration  which  links  lead  to  other  subpages  in  services  and  Click  Listener  to  

the  rest.  

   

Timer  Listener    

 

This  Listener  is  responsible  for  measuring  and  countdown  time  on  the  website  in  

milliseconds.  While  being  fired  it  starts  counting  down  the  time  defined  by  us.  The  listener  

can  be  used  in  many  ways,  e.g.  calling  the  event  on  the  website  which  will  measure  a  real  

bounce  rate  in  Google  Analytics.  We  will  talk  over  this  case  a  little  bit  later.  

 

JavaScript    Error  Listener  

 

A  very  useful  Listener  which  registers  mistakes  in  script  calling  on  our  website.  We  can,  for  

example,  register  mistakes  as  events  in  GA.  Thanks  to  this  we  have  an  insight  and  control  

over  quality  of  our  site  working.    

Page 73: Google Tag Manager (Manual in English)

     

73  

 

Coming  back  to  our  easy  example…  

 

For  our  example,  link  click  registration  (let's  take  :My  link  for  auto  event  tracking  ),  we  will  

choose  a  type  of  Listener  as  simply  Click  Listener.  

 

Ad  2.  Define  the  rule  –  when  the  listener  is  to  be  fired  on  the  website  

 

If  we  have  already  chosen  Click  Listener  we  have  move  to  defining  rules  when  it  is  to  be  

fired.  This  type  of  registering  tag  can  be  easily  switched  on  on  all  pages  of  our  website.  

Thanks  to  this  we  can  easily  register  clicks  also  on  other  links  on  a  website  (we  can  use  that  

information  later).  So  our  now  rule  should  be  as  follows:  fire  the  "Auto  click  listener"  tag  on  

all  pages  of  the  website.  

 

   

Let's  stop  here  for  a  moment.  We  can  check  now  how  GTM  registers  clicks  on  different  links  

on  our  website.  Thanks  to  this  we  will  understand  how  GTM  sees  our  links,  it  will  be  easier  

for  us  to  create  macros  and  rules  later.  

 

If  we  already  save  the  tag  and  publish  its  version  (we  can  do  this  also  in  Preview  >  Debug),  

we  move  to  our  website  tab  in  web  browser  and  click  on  any  link.  Then  we  run  Javascript  

Page 74: Google Tag Manager (Manual in English)

     

74  

console  in  Chrome  browser13  (View  >    Developer  >  Javascript  Console)  and  we  type  

"dataLayer"  in  Console  bookmark.  

 

Thanks  to  this  we  could  see  objects  currently  loaded  to  our  Data  Layer.  In  the  first  object  

there  are  always  data  loaded  from  a  dataLayer  array  above  the  container(If  there  is  

something  there).  In  the  last  object  there  are  the  last  registered  events  on  the  website.    In  

our  case,  it  is  the  link  click  which  called  gtm.click  auto  event.  

   

In  this  view  we  can  see  what  elements  were  registered  by  Click  Listener  and  sent  to  Data  

Layer.  For  example,  in  "ID  element"  value  "example-­‐link"  occurs  and  in  "URL  element"    an  

address  to  which  the  clicked  link  refers.    Thanks  to  our  Click  Listener  we  will  be  able  to  

make  use  of  these  data  while  defining  other  rules.  

 

Let's  preview  now  the  source  of  the  test  website.  Link  ID  and  actual  URL  address  were  

                                                                                                               13 You can make use of other consoles and other browsers. For example, we have a Firebug plug-in in Firefox available.

Page 75: Google Tag Manager (Manual in English)

     

75  

registered  by  our  Listener.  In  our  example  it  is  "#".  Seeing  like  Listener  collects  information  

and  what  is  really  viewable,  we  can  really  understand  how  to  create  rules  and  macros  

which  will  allow  us  to  register  chosen  actions  on  the  website.  Thanks  to  this  we  know  what  

Listener  has  registered,  we  can  create  conditions  of  event  registration  which  will  include  

more  than  one  variable.  

For  example  the  condition  of  this  type:  

Register  e-­‐book  downloading  and  add  it  as  an  event  to  GA  only  then  when  element  ID  <a>  

equals  "e-­‐book"  and  URL  address  ends  with  ".pdf".    

In  this  way  we  can  differ  various  types  of  clicks  and  events  in  GA.  We  will  deal  with  it  later.  

 

 

   

 

Ad  3.  Create  Google  Analytics  tag  responsible  for  event  registering  

 

Since  we  have  Listener  which  "listens"  to  what  is  happening  on  our  website  in  matter  of  

clicks  that  was  done,  we  can  start  register  of  our  chosen  click  as  an  event  in  Google  

Page 76: Google Tag Manager (Manual in English)

     

76  

Analytics.  What  we  have  to  do  at  this  point  is:  

 

1. Create  Google  Analytics  tag  responsible  for  sending  events  to  GA.  

2. Define  when  a  given  tag  is  to  be  fired.  

 

   

What  I  have  done  is  to  use  two  macros  {{element  text}}  and  known  to  us  {{event}}  while  

completing  parameters  about  events  in  Google  Analytics.  We  will  come  back  to  this  issue  in  

a  minute.  

 

So  thatctag  could  work  we  create  the  rule  for  it,  that  is  the  condition  when  it  is  to  be  fired.  

In  this  case  we  use  two  elements  of  our  condition  for  the  tag  created  above.  

The  obligatory  condition  is  auto  event  which  registers  the  clicks:  

         

{{event}}  equals  gtm.click  

 

This  is  the  condition  which  has  to  be  satisfied  to  take  an  auto  event  into  

consideration.    

 

If  we  do  not  add  it  for  each  time  when  we  use  Click  Listener,  the  rule  simply  will  not  work.  

We  will  use  the  event  which  was  automatically  added  to  Data  Layer  at  the  moment  of  click.  

Page 77: Google Tag Manager (Manual in English)

     

77  

Thus,  we  refer  to  gtm.click  auto  object  which  registered  this  event.  

 

The  second  condition  has  to  be  define  by  us:  

{{url  element}}  includes  .html  

This  element  of  the  rule  is  to  prevent  from  registering  the  link  clicks,  for  example,  

concerning  pdf  documents.  In  this  element  a  condition  is  added  if  the  element  which  is  URL  

address  includes  .html,  you  can  fire  a  tag.  

 

Hence,  in  our  case  two  conditions  must  be  satisfied  so  that  the  tag  could  be  fired.  Click  must  

be  registered  by  an  auto  event  and  link  must  include  a  ".html"  character  string.  

 

 You  need  only  to  test  and  publish  a  container  version.  

 

Result?  

Thanks  to  our  currently  created  rule,  all  links  on  the  website  will  be  registered  as  an  event  

in  Google  Analytics.  We  settled  the  matter  thanks  to  two  tags.  

 

Page 78: Google Tag Manager (Manual in English)

     

78  

A little more about macros in auto events Let's  come  back  for  a  while  to  the  moment  of  creating  Google  Analytics  tag  responsible  for  

tag  registration.  While  creating  parameters  for  events  we  used  two  macros:  {{element  

text}}  and  known  to  us  {{event}}.  As  I  have  mentioned,  many  times  ,  macros  are  variables  

which  load  values  from  Data  Layer.  Thanks  to  this  they  make  our  work  easier  and  save  our  

time.  Thanks  to  macros,  if  we  look  at  GA  account,  after  clicking    on  any  link  which  meets  the  

rule,  we  will  see  labels  below.  

 

 These  labels  are  values  substituted  for  our  {{element  text}}  and  {{event}}  variables.    

 

The  {{event}}  macro  assumed  gtm.click  variable  because  such  an  event  happened  while  

clicking.  The  Click  listener  registered  automatically  a  click  event  which  is  marked  by  GTM  

automatically  as  gtm.click.  

 

The  second,  {{element  text}},  macro  i  a  very  interesting  and  useful  macro  which  

automatically  reads  the  text  included  within  the  element.  De  facto  it  reads  simply  the  

"anchor  text"  that  is  viewable  texts  on  the  website  after  which  the  reference  (link)  is.  

 

Page 79: Google Tag Manager (Manual in English)

     

79  

Thanks  to  this  that  I  have  put  these  two  macros  in  the  event  model,  in  the  image  above  an  

event  and  precise  link  contents  (anchor  texts)  occurred  as  a  label.  Nice,  isn't  it?  

 

There  are  more  possibilities  of  content  readings  from  the  website  with  the  help  of  macros.  

It  is  important  that  macros  can  be  used  almost  in  any  place  of  GTM.  It  is  worth  looking  

earlier  at  the  console  for  programmers  how  clicking  is  registered  by  Listeners  in  GTM.  

Then  we  will  know  what  values  we  can  easily  take  out  of  the  website  content  and  which  

will  require  from  us,  for  example,  manual  tagging.  

   

As  it  is  seen  below,  after  clicking  on  the  link,  Listener  read  out  only  URL  address  to  which  

link  (gtm.element/url)  refers.  There  is  also  a  definite  "a"  element.  We  know,  thus,  that  it  is  

a  link.    

 "A"  object  in  html  language  is  responsible  for  links  e.g.  <a  href=”www.link.html”>Link</a>.    

Now  it  is  worth  mentioning  that  an  accurately  and  carefully  written  website  code  will  be  a  

great  facilitation  for  us.  If  a  programmer  does  not  give  e.g.  ID  for  objects  on  the  website,  

classes  are  written  in  a  disordered  way,  it  will  be  more  difficult  for  us  to  define  rules  for  

events.    

   

We  will  have  to  use  more  often  the  custom  javascript  scripts  which  will  help  us  to  "take  

out"  data  from  the  website  code.  

Page 80: Google Tag Manager (Manual in English)

     

80  

 

 

Available  macros  and  their  possibilities  

 

What  are  macros  we  have  said  at  the  very  beginning  of  this  e-­‐book.,  macros  are  pairs  

variable-­‐value.  Values,  for  variables,  are  downloaded  from  Data  Layer  when  the  rules  allow  

for  this.  

A  macro,  as  we  know,  look  always  like  this:    

 

{{macro_name}}  

 

We  have  used  macros  several  times.  At  the  very  beginning  we  have  created  the  macro  

where  the  value  was  Id  number  of  our  Analytics  account.  Later  we  made  a  use  of  a  built-­‐in  

{{event}}  macro  responsible  for  sending  events  to  Data  Layer.    

Just  now  we  have  used  {{element  text}}  macro  which  registers  the  text  within  the  website  

element  e.g.  link.  Now  it  is  time  to  introduce  other  macros  and  their  application.  

 

     

While  creating  a  new  macro  a  list  of  available  macro  types  will  occur.  Some  of  them  we  

have  already  used,  but  some  not  yet.  They  are  such  macros  which  will  be  useful  in  very  rare  

cases  (Random  number)  and  such  which  will  almost  always  use  the  Auto-­‐event  variable.  As  

you  can  see  below,  some  of  macros  is  "built-­‐in"  GTM,  we  have  them  ready  at  once  at  the  

moment  of  creating  an  account.  Most  of  them  concern  event  listeners  i.e.  auto  events  which  

we  have  discussed  initially  in  examples  before.  Here  I  will  mention  once  again  that  it  will  be  

easier  for  us  to  work  with  GTM  if  the  code  of  our  website  will  be  written  precisely.  It  would  

Page 81: Google Tag Manager (Manual in English)

     

81  

be  perfect  if  the  most  elements  had  their  ID.  Of  course,  it  is  not  an  obstacle  but  it  will  be  

easier,  especially  for  people  who  do  not  work  with  javascript.  

 

 

   

Let's  start  from  a  fast  discussion  of  individual  types  of  macros  which  we  can  create.  

 

Auto-Event Variable  

There  are  several  macro  types  of  this  kind.  Because  new  types  appear  quite  often  and  are  

added  to  the  list,  I  will  introduce  only  the  most  popular  and  the  most  frequently  used  ones.  

 

 

Page 82: Google Tag Manager (Manual in English)

     

82  

 Element  classes:  Returns  the  class  of  the  element  attribute  which  was  clicked.  

The  example:  We  have  a  <div  class="MainMenu">website  menu</div>element  in  the  

website  code,  this  type  of  macro  will  return  the  value  of  "MainMenu"  

Element  ID:  Returns  the  ID  of  the  element  attribute  which  was  clicked.  

The  example:<a  href="#"  id="example-­‐link">My  link  for  auto  event  tracking</s>,  macro  of  

this  type  will  return  to  us  the  value  of  "example-­‐link".  

Element  target:  Returns  the  attribute  of  "target"  element  which  was  clicked.  

The  example:    <a  href=”http://www.any-­‐website.pl”  home”  target=”blank”/>,  macro  will  

return  to  us  the  "blank"  value  

Element  text:  This  type  of  macro  we  used  before  in  the  example.  The  macro  returns  the  

text  in  a  clicked  element.  

The  example:  <a  href=”http://www.any-­‐website.pl”  home”  target=”blank”/>Link  to  any-­‐

website</a>.  The  macro  will  give  back  to  us  the  value  of  "Link  to  any-­‐website".  

Element  URL:  This  type  of  macro  gives  back  the  value  of  a  clicked  attribute  element  <a  

Page 83: Google Tag Manager (Manual in English)

     

83  

href>  (link  url  address)  or  the  value  of  "action"  attribute  in  forms.    

The  example  of  the  link:  <a  href=”http://www.any-­‐website.pl”  home”  target=”blank”/>Link  

to  any-­‐website</a>.  The  macro  will  give  back  to  us  the  “http://www.any-­‐website.pl”  value.    

The  example  for  the  form:  <form  action=”/thankyou.html”  id=”form”>.  Macro  will  give  back  

the  "/thankyou.html".  value    

Macro Constant String The  macro  stores  the  constant  value  which  we  can  use  later  in  other  actions  in  GTM.  We  

used  the  macro  before  to  store  Analytics  account  ID.  Thanks  to  this  identification  we  do  not  

have  to  remember  numbers  of  Analytics  accounts  used  by  us  but  also  other  e.g.  Conversion  

ID.  

Macro  -­‐  Custom  Events     It  is  one  of  the  most  popular  macros  created  on  GTM  account  at  once.  The  macro  gives  back  

its  value  while  being  loaded  to  Data  Layer.  

 

dataLayer.push({“event”:”event_value”})  

 

We  use  this  macro  the  most  frequently  in  specific  tag  settings.  If  we  want  to  fire  a  tag  at  the  

moment  of  any  action  on  the  website  (e.g.  click),  and  a  given  click  was  tagged  by  us  with  a  

push  method,  add  only  {{event}}  equals  "event_value"  as  a  rule  in  the  tag.  At  the  moment  of  

the  click,  value  is  sent  to  Data  Layer  and  a  suitable  tag  fires.    

We  have  already  used  this  tag  in  the  chapter  about  basic  event  tracking  in  Google  Analytics.  

 

The  "Custom  Events"  macro  takes  also  value  of  "gtm.click",  "gtm.linkClick  or  other  

connected  with  auto  events.  Hence,  as  we  remember  from  the  previous  chapter  about  

creating  auto  events  to  call  auto  events  we  always  have  to  add  the  rule  of  firing  this  tag  

Page 84: Google Tag Manager (Manual in English)

     

84  

condition  {{event}}  equals  "gtm.click"14  

 

DataLayer Variable  

Like  in  the  case  of  the  "Custom  Events"  macro,  a  variable  will  be  sent  while  calling  the  code.  

 

 

dataLayer.push({'Data_layer_variable':  'value'})  

 

The  same  we  can  use  the  variable  if  it  is  in  the  dataLayer  array  above  the  container.  A  good  

example  of  using  this  macro  is  recognizing  clicks  on  images  on  our  website.  The  example,  

step  by  step,  is  described  later  in  the  e-­‐book.  

 

DOM elements  

The  macro  is  responsible  for  loading  values  connected  with  an  ID  attribute  of  a  given  

element  from  the  website.  We  can,  for  example,  decide  that  we  want  to  register  only  the  

event  if  someone  clicks  on  a  specific  button  with  specific  ID.  We  can  also  do  this  with  the  

help  of  DOM  element  macro,  giving  a  rule.  Fire  a  chosen  tag,  if  the  DOM  element  equals  i.e.  

"sample-­‐link-­‐id".  

 

<a  href="http://www.any-­‐website.pl"  id="sample-­‐link-­‐id">Sample  link</a>  

 

We  can  use  also  macro  in  any  other  place  of  GTM.  For  example,  in  defining  events  in  Google  

Analytics.  

Let’s  see  example.  We  have  "Sample  link"  which  we  want  to  measure  in  GA  as  an  event  

while  it  is  clicked.  The  link  in  the  code  looks  like  as  follows:    

 

                                                                                                               14 Or other values for auto events e.g. gtm.formSubmit, gtm.linkClick.

Page 85: Google Tag Manager (Manual in English)

     

85  

   

Now  we  have  element  ID  of  <a></a>  tag  as  "sample-­‐link-­‐id"  and  "alt"  attribute  which  has  

"this  is  alt"  value.  What  can  we  do  with  this?  

 

Let's  take  our  earlier  example  with  the  use  of  macros  in  defining  parameters  of    the  

Analytics  event.  

 

   

I  have  modified  the  Label  parameter  and  used  in  it  two  created  similar  macros.  One  macro  

is  named  {{DOM  element}},  the  second  one  {{DOM  element  attribute}}.  The  whole  

parameter  looks  like  as  follows:  

 

{{DOM  element}}  -­‐  {{DOM  element  attribute}}  

 

Macros  themselves  look  similar.  {{Dom  element}}  macro  looks  like  as  follows:  

Page 86: Google Tag Manager (Manual in English)

     

86  

 

 I  have  introduced  element  ID  <a>.  The  second  macro  looks  very  similar  but  it  has  

additional  variables.  We  add  element  attribute  <a>  .  

 

   

So,  we  have  two  macros  which  differ  only  on  adding  attribute.  I  assume  that  all  other  in  the  

GA  tag  which  is  to  track  the  click  as  an  event  is  set  correctly.  After  publishing,  if  someone  

clicks  on  the  link  in  Google  Analytics  we  should  register  the  following  data.  

Page 87: Google Tag Manager (Manual in English)

     

87  

   

That  is  {{DOM  element}}  macro  registers  the  text  value  of  the  element  from  ID="sample-­‐

link-­‐id"  and  the  second  {{DOM  element  attribute}}  macro  which  has  additionally  defined  an  

additional  variable  of  the  element  (alt  attribute)  takes  value  alt+  "this  is  alt"  

HTTP referrer  

This  macro  downloads  data  about  the  referrer  to  the  website  where  the  click  was.  If,  for  

example,  our  website  is  www.any-­‐website.pl/gtm.html and  someone  has  entered  it  from  

the  main  website  of  the  service  www.any-­‐website.pl/read-­‐this.pl  ,  the  loaded  referrer  will  

equal  “www.any-­‐website.pl/read-­‐this.html”.  The  website  address  where  the  click  came  

from.  

 

This  macro  can  be  used,  for  example,  to  condition  firing  of  suitable  tags  depending  on  the  

referrer.  

 

Javascript Variable (Custom Javascript code) If  we  are  not  able  to  download  data  with  the  help  of  available  macros  and  click  Listeners,  

we  can  support  ourselves  with  the  script  directly  written  by  us.  

 

Page 88: Google Tag Manager (Manual in English)

     

88  

 

   

 

Our  script  will  download  the  value  of    "class"  attribute  for  the  element  of  ID="product".  Of  

course  using  such  a  type  of  macro  we  have  to  leave  to  people  who  know  JavaScript  

language  at  least  on  a  basic  level.  It  is  an  example  because  now  we  have  also  the  macro  

available  which  is  able  to  identify  the  class  elements  of  source  code.  

 

Random Number  

The  "Random  Number"  macro  for  each  time  when  it  is  called  takes  the  random  number  

from  0  to  2147483647.  How  can  we  use  this  macro?  

 

An  interesting  example  is  to  call  the  tag  for  some  percent  of  visitors  of  our  site.  Such  a  tag  

can  be  at  least  the  tag  which  fires  scripts  to  test  website  contents.  It  can  be  used  for  firing  

scripts  with  surveys  to  some  percent  of  website  visitors.  

 

You  need  only  to  mark  the  condition  in  the  rule  of  calling  the  tag:  if  {{Random  Number}}  

Page 89: Google Tag Manager (Manual in English)

     

89  

macro  ends  with  9,  call  the  tag.  It  will  correspond  to  10%  of  website  visits  15.  

 

URL macro  

This  macro  allows  to  load  address  fragments  like:  host  name,  query  or  any  other  fragment.  

   

Let's  explain  in  details  what  each  type  of  URL  macro  component  can  be  used  for.  

 

● URL:  Returns  the  whole  URL  address    

● Protocol:  Returns  the  protocol  of    URL  address  (http  or  https)  

● Host  Name:  Returns  the  host  name  (e.g.  marketinglab.pl,  google.com,  etc.)  

● Port:  Returns  the  port  number  of  the  host  name.  Ports  are  used  for  communication  with  

the  Internet.  Different  ports  are  responsible  for  different  kinds  of  connections.  Connections  

for  pages  will  also  use  ports:  80  or  443  depending  on  if  it  is  http  or  https.  

● Path:  Path  of  URL  address  without  the  host  name,  e.g.  if  we  have  the  following  address  

www.any-­‐website.pl/example.html,  we  will  get:  example.html.  

● Query:  Returns  the  value  of  a  chosen  query  in  URL  address.    

● For  example  in  URL  address:  www.any-­‐website.pl/example.html?utm_source=mail,  we  can  

download  "utm_source"  query  value  and  the  condition  to  fire  any  tag  or  we  can  use  by  the  

way  of  creating  other  values  such  as  at  least  names  of  event  parameters  in  Google  

                                                                                                               15 http://dan-russell.com/2013/03/sampling-a-percentage-of-your-users-with-google-tag-manager/

Page 90: Google Tag Manager (Manual in English)

     

90  

Analytics.  

● Fragment:  Returns  the  character  string  from  URL  address  without  preceding  #.  

 

Lookup Table  

It  is  one  of  the  most  useful  macros  if  we  are  to  build  condition  of  a  variable  value  depended  

on  the  value  of  other  variable.  The  lookup  table  allows  to  create  the  macro  in  which  the  

value  will  depend  on  the  value  of  other  macro.  

   

Probably  the  most  interesting  example  is  a  situation  when  we  test  changes  within  GTM.  We  

test  events  if  they  work  in  Google  Analytics,  we  generate  a  lot  of  clicks,  visits,  etc.,  in  Debug  

Mode.  Thanks  to  the  Lookup  table  we  can  create  the  condition  which  depending  on  in  

which  mode  we  are  –  live  or  Debug  mode  will  be  replacing  ID  numbers  of  Analytics  

accounts.  In  this  way  we  can,  in  Debug  mode,  test  events  in  GA  on  other  account  (to  tests),  

not  spamming  our  real  account  with  artificial  events.  

 

   

To  do  this  we  will  use  a  combination  of  Debug  macro  and  Lookup  Table.  

We  create  the  macro  of  Debug  type  which  automatically  takes  value  True,  if  we  are  in  

Debug  mode  or  False  if  we  are  not.  When  someone  clicks  in  a  website  in  "live"  mode.  

Then  we  create  Lookup  Table  macro  (I  called  it  SafeMode)  and  give  the  condition:    

If  you  are  in  Debug  mode  (true)  use  macro  value  {{UA  -­‐  Rewolucja  –  test  account}},  and  if  you  

Page 91: Google Tag Manager (Manual in English)

     

91  

are  not  in  Debug  mode,  use  values  from  {{UA  -­‐  Rewolucja  -­‐  live}}  macro.  

 

Of  course  I  have  created  {{UA  -­‐  Rewolucja  -­‐  live}}  and  {{UA  -­‐  Rewolucja  –  test  account}}  

macros  before.  Both  are  of  a  Constant  String  type  and  have  values  of  two  IDs  of  accounts.  

Test  and  true  accounts.    

 

Now  we  should  only  use  {{SafeMode}}  macro  in  all  places  where  we  use  ID  of  our  Analytics  

accounts.  It  is  about  tags  of  course.  

 

  Measuring outbound links as auto events in GA  

In  the  case  of  generating  and  buying  traffic  on  a  website  a  very  important  aspect  of  

measuring  its  effectiveness  is  also  knowledge  about  possible  "escapes"  of  visitors  from  a  

given  site.  That  is  why  events  which  register  outbound  traffic  from  the  website  are  often  

created  in  Google  Analytics.  So  that  it  was  necessary  to  tag  all  links  in  the  site  leading  to  

"outside"  the  website".  Google  Tag  Manager  is  able  to  help  us  to  track  the  outbound  traffic  

in  an  automatic  way.  To  do  this  we  have  to  do  the  following  steps:  

   

1. Add  the  tag  which  will  automatically  register  clicks  on  links  on  a  website.  

2. Add  Google  Analytics  tag  which  will    be  responsible  for  registration  and  sending  

clicks  as  events  to  GA.  

3. Create  the  rule  which  will  register  only  clicks  on  outbound  links.  

Page 92: Google Tag Manager (Manual in English)

     

92  

 

 

Ad  1.  Add  the  tag  which  will  automatically  register  link  clicks  on  the  website  

 

We  create  the  tag  of  Click  Listener  type.  With  the  rule  for  all  pages.  

 

   

 

Ad  2.  Create  Google  Analytics  tag  responsible  for  event  registration.  

 

At  the  moment  of  choosing  parameters  we  can  make  use  of  macros  which  will  

automatically  send  to  GA  information  about  what  the  full  URL  address  of  the  exterior  

website  is  and  we  can  download:  "anchor  text"16  of  the  link  to  PDF.  

                                                                                                               16 Anchor text – a viewable clickable text of the link

Page 93: Google Tag Manager (Manual in English)

     

93  

   

Ad  3.  Create  rule  for  macro  

 

 

   

As  a  rule  we  give  two  conditions.  As  always  in  the  case  of  auto  Listeners,  the  condition  

{{event}}  equals  gtm.click  and  condition  where  link  clicks  on  navigation  links  on  the  

content  within  our  site  are  excluded.  In  this  case  it  will  be:  {{element  url}}  does  not  include  

"name_of_our_domain".  {{element  url}}  macro  returns  the  value  which  is  a  full  address  of  

url  link  which  was  clicke  

Page 94: Google Tag Manager (Manual in English)

     

94  

Measuring  document  downloads  (e.g.  PDF)  as  auto  events  in  GA  

 

In  this  case  we  want  to  register  PDF  file  downloads  as  events  in  Google  Analytics.  We  have  

to  do  the  following:  

 

1. Add  the  tag  (or  if  it  exists  we  make  use  of  existing  one)  which  will  automatically  

register  link  clicks  on  the  website,  click  Listener.  

2. Add  Google  Analytics  tag  which  will  be  responsible  for  registration  and  sending  PDF  

file  downloads  as  events  to  GA.  

3. Create  the  rule  which  will  register  only  clicks  (downloads)  of  PDF  files.  

 

 

Ad  2.  Add  Google  Analytics  tag  responsible  for  registration  of  PDF  file  download  as  

the  event.  

 

We  have  omitted  the  item  1,  because  we  have  the  tag  of  a  click  Listener  type  already  

created  on  the  account.  If  we  do  not  have  it  we  can  use  the  earlier  example  where  it  is  

described  in  details.  

 

So,  we  create  a  GA  tag  responsible  for  event  registration  (type:  event)  with  parameters  

which  will  be  transferred  to  Google  Analytics  as  an  event.  One  of  these  parameters  is  the  

"Action"  parameter.  In  this  parameter  we  use  the  {{element  text}}  macro  which  will  

transfer  as  its  "anchor  text"  value  of  downloaded  PDF.    "Anchor  text"  in  this  example  is  an  

underlined  name  of  a  PDF  file.  It  is  very  often  so,  hence,  my  idea  for  such  a  solution.  If  PDFs  

on  the  website  are  not  labeled  as  links  to  download  with  anchor  texts  of  type  "Download  

now"  I  advise  against  using  this  macro  because  we  will  not  learn  later  much  from  the  

parameter  of  GA  –  Action  event.  

 

Page 95: Google Tag Manager (Manual in English)

     

95  

   

Ad  3.  The  rule  for  the  tag  to  register  PDF  download  

 

The  rule  which  is  to  fire  this  tag  is  important.  In  this  rule  we  have  included  two  conditions:  

As  always  in  the  case  of  auto  registration  of  clicks  {{event}}  equals  gtm.click  and  the  second  

condition  concerning  the  type  of  the  file  registered  as  an  event.  In  this  case  I  used  a  simple  

{{element  url}}  rule  i.e.    url  address  includes  "pdf"  character  string.    Sometimes  the  

conditions  of  this  type  will  be  more  complicated  if  files  have  different  extensions  or  they  

are  differences  in  names,  e.g.  PDF  file  can  be  packed.    Then  surely  regular  expressions  

(regex)  will  be  helpful.    

 

 

Page 96: Google Tag Manager (Manual in English)

     

96  

   

While  using  click  listeners  we  must  always  remember  about  adding  in  the  rule  the  

condition  {{event}}  equals  gtm.click  (or  other  if  we  use  actually  other  listener  e.g.  

gtm.linkclick).  

 

Remember  that  to  exclude  the  registration  of  PDF  from  other  rules  which  collect  clicks  on  

all  other  links.  You  can  add  the  excluding  rule  {{element  url}}  includes  pdf.  The  excluding  

function  is  below  the  option  for  defining  rules.  

 

NOTICE!  If  you  did  not  read  the  whole  e-­‐book,  only  piecemeal,  you  should  know  that  using  

GTM  to  event  registration(event  type)  we  must  always  remember  to  have  the  GA  tag  which  

is  responsible  for  pageviews  registration.  

 

Measuring  clicks  on  images  as  an  event  on  the  website  in  GA  

 

Perhaps  you  are  curious  how  often  somebody  clicks  on  graphic  elements  (e.g.  images)  

which  do  not  have  to  be  links.  Maybe  we  want  to  know  if  any  graphic  deserves  link  or  we  

Page 97: Google Tag Manager (Manual in English)

     

97  

suspect  that  website  users  may  be  mistaken  and  think  that  some  images  is  clicked  and  that  

is  why  they  are  distracted  from  purchase  path  or  causes  confusion.  Let's  take  a  simple  

example:  We  have  a  image  on  the  webpage  which  source  code  looks  like  the  following:  

 

   

We  want  to  register  an  event  in  Google  Analytics  as  clicks  on  this  image.  We    want  to  

differentiate  clicks  on  graphic  forms  from  normal  text  links.  What  do  we  have  to  do?  

 

1. Create  the  macro  which  will  allow  us  to  obtain  information  about  the  name  of  the  

element  of  the  source  code,  in  this  case  we  want  to  get  labels  of  <img>  Image.  

2. In  the  Google  Analytics  tag  responsible  for  event  registration  in  event  parameters  

we  place  macro  combination  which  will  automatically  send  events  with  suitable  

labels  to  GA  

 

 

 

Ad  1.  Create  macro  which  will  allow  us  to  download  such  information  of  the  name  of  

the  element  of  the  website  source  code  which  was  clicked.  

 

Page 98: Google Tag Manager (Manual in English)

     

98  

   

To  do  this  we  made  use  of  the  "Variable  of  Data  Layer"  macro  type  and  the  name  of  variable    

downloaded  from  Data  Layer  is  the  Listener  name  of  elements  on  the  website  

(gtm.element).  Because  there  is  arborization  of  DOM  elements  in  GTM,  we  can  add  after  the  

“dot”  what  element  is  in  our  interest  and  ask  about  its  name  (tagName).  That  is  within  the  

website  code  element  recognized  by  GTM  (e.g.  <a>,  <div>,  itp.)  the  tool  looks  for  the  name  

of  a  given  tag.  De  facto,  it  will  be  its  type.  If  we  ask  about  the  type  of  an  element  (tagName)  

for  the  link:  

<a  href=”any_website.pl”  id=”link1”>Link  to  any-­‐website</a>,  

 

 we  receive  "a"  value.  Hence,  we  can  make  use  of  tagName  command  to  obtain  different  

elements  which  the  user  clicked17.  If  someone  clicks  on  the  image  we  will  get    <img>  value  

and  that  is  it.  

 

NOTICE!  Remember  about  versions  of  Data  Layer.  Version  2  allows  to  recognize  that  a  dot  

in  this  character  string  is  the  gate  to  nested  information  and  not  a  normal  character.  

                                                                                                               17  tagName  is  nothing  else  than  Javascript  command.  You  can  read  more  on  tagName  here:  http://www.w3schools.com/jsref/prop_element_tagname.asp  

Page 99: Google Tag Manager (Manual in English)

     

99  

 

 Ad  2.  We  place  macro  combination  in  Google  Analytics  tag  responsible  for  event  

registration,  in  event  parameters.  

 

We  place  macro  combination  {{event}}  and  {{tagName}}  in  Google  Analytics  tag  

responsible  for  event  registration,  in  event  parameters.  

 

After  being  tested  in  Google  Analytics  the  following  events  should  be  registered:  

 

 

 

Page 100: Google Tag Manager (Manual in English)

     

100  

 

gtm.click  as  {{event}}  and  IMG  as  {{tagName}}.  In  this  way  we  know  that  a  given  click  was  

on  the  image.  It  is  important  in  order  not  to  add  any  additional  conditions  except  {{event}}  

equals  gtm.click  in  the  rule  of  firing  a  tag  which  collects  events.  We  do  not  want  to  block  

recognition  of  any  click.  

 

Cross-domain tracking with GTM (UA)  

It  happens  very  often  that  this  what  we  want  to  measure  with  Google  Analytics  is  not  only  

one  domain  but  our  Internet  actions  take  place  within  a  few  domains  and  subdomains.  If  

we  have,  for  example,  two  domains  (domain1.pl  and  domain2.pl),  in  standard  GA  

configuration,  a  user  moving  from  domain  1  to  domain  2  is,  in  GA  for  domain  2,  treated  as  a  

user  coming  from  the  source  of  domain1.pl/referral  (source/medium).  If  we  want  to  know  

the  whole  path  of  such  user  for  both  domains  (e.g.  what,  in  fact,  source  he  comes  from)  and  

we  treat  both  domains  as  one  business  property,  we  have  to  configure  cross-­‐domain  

tracking  in  Google  Analytics.  There  is  a  similar  situation  but  a  little  bit  simpler  is  in  the  case  

of  tracking  the  traffic  between  subdomains  and  domains  (e.g.  subdomain.domain1.pl).  How  

can  we  configure  tracking  of  this  type  with  GTM?  

 

When  we  use  Universal  Analytics  we  can  use  options  of  auto  cross-­‐domain  traffic  tracking.  

It  is  very  easy.  If  we  use  one  container  for  both  domains:  

 

Page 101: Google Tag Manager (Manual in English)

     

101  

   

1. Create  (edit)  the  UA  tag  responsible  for  pageview  tracking.  

2. Choose  "true"  value  for  'Allow  Linker'  option  and  add  names  of  domains  which  we  

want  to  track  together.  We  do  this  after  comma.  

3. Set  the  rule  –  "Fire  on  all  pages".  

 

That's  all  actually.  Now  GTM  will  share  cookie  settings  for  both  domains.  We  will  see  this  in  

the  link  after  clicking  and  moving  on  the  second  domain.  It  is  important  to  look  at  the  

second  element  of  a  character  string  after  the  dot  on  the  right.    

 

 

Page 102: Google Tag Manager (Manual in English)

     

102  

   

This  number  is  a  unique  identifier  of  the  user  (actually  of  the  browser),  it  should  not  

change  while  moving  between  domains.  

 

If  we  use  different  containers  for  each  domain  we  must  remember  to  install  the  UA  tag  with  

the  same  number  and  settings  in  each  container.  

 

At  the  end  we  enter  our  Google  Analytics  and  we  add  ignored  addresses  of  referrals  in  

profile  settings.  In  other  case  referrals  between  domains  of  traffic  source  will  be  overtyped  

(as  referrals  from  combined  domains).  

 

 

Unique  user  ID    

Page 103: Google Tag Manager (Manual in English)

     

103  

Dynamic remarketing installation with GTM More  and  more  often  we  can  observe  using  tools  in  marketing  actions  such  as  dynamic  

remarketing.  The  tool  works  very  effectively  and  is  actually  an  invaluable  element  of  

marketing  actions  which  is  applied  by  shops  and  advertiser  with  a  very  wide  product  

range.  

We  will  not  explain  here  the  rules  of  dynamic  remarketing  itself.  To  have  it  explained  I  

refer  you  to  AdWords  help.  Here,  instead  of  it,  I  will  tell  how  to  implement  dynamic  

remarketing  with  GTM.  

 

What  will  we  need?  

As  we  know  so  that  dynamic  remarketing  could  work  we  need  additional  parameters  

added  to  the  standard  remarketing  code.  

 

<script  type="text/javascript">  

var  google_tag_params  =  {  

ecomm_prodid:  'REPLACE_WITH_VALUE',    

ecomm_pagetype:  'REPLACE_WITH_VALUE',  

ecomm_totalvalue:  'REPLACE_WITH_VALUE'};  

</script>  <script  type="text/javascript">  

/*  <![CDATA[  */  

var  google_conversion_id  =  XXXXXXXXXX;  

var  google_conversion_label  =  "YYYYYYYYYY";  

var  google_custom_params  =  window.google_tag_params;  

var  google_remarketing_only  =  true;  

/*  ]]>  */  

</script>  

<script  type="text/javascript"  src="//www.googleadservices.com/pagead/conversion.js">  

</script>  

<noscript>    

<div  style="display:inline;">  

<img  height="1"  width="1"  style="border-­‐style:none;"  alt=""  

Page 104: Google Tag Manager (Manual in English)

     

104  

src="//googleads.g.doubleclick.net/pagead/viewthroughconversion/XXXXXXXXXX/?value=0&amp;label=YY

YYYYYYYY&amp;guid=ON&amp;script=0"/>  

</div>  

</noscript>  

 

What  you  can  see  above  is  the  standard  remarketing  code  with  additional  parameters  (in  

red),  thanks  to  which  the  system  is  able  to  serve  suitable  products  to  suitable  people.  

Thanks  to  parameters  we  can  create  conditions  and  rules  concerning  remarketing  lists  and  

advert  serving.  

 

In  a  traditional  way  we  have  to  add  the  code  with  additional  parameters  to  each  subpage  

with  products.  Of  course  nobody  does  it  manually  but  they  employ  a  programmer  who  

loads  the  content  from  a  website,  cms,  data  base  or  CRM  and  pastes  them  in  a  code  for  

parameters.  We  do  this  in  a  similar  way  but  differently  ;)  It  will  be  the  first  solution.  In  a  

second  way  we  will  try  to  do  without  the  programmatical  intervention.  We  will  try  to  use  

suitable  variables  and  macros  and  search  values  in  the  content  of  our  website.  Let's  start  

from  the  standard  way.  

 

First method - standard  

If  we  want  to  make  use  of  dynamic  remarketing  with  GTM  we  have  to:  

1. Create  a  remarketing  tag.  

2. Create  rules  which  will  define  on  which  pages  a  given  tag  is  to  be  fired.  

3. Choose  variables  and  send  product  values  to  Data  Layer  

4. Create  the  macro  which  will  be  a  "bridge"  between  data  from  Data  Layer  and  the  

remarketing  tag.  

5. Test  and  publish  a  container  version.  

 

 

 

 

Page 105: Google Tag Manager (Manual in English)

     

105  

Ad  1.  Create  a  remarketing  tag.  

 

We  create  tag  the  same  like  in  the  case  of  the  normal  remarketing  tag.  We  give  an  ID  

number  of  the  remarketing  tag  which  we  download  from  the  AdWords  account  (we  did  it  

while  creating  a  normal  remarketing  tag  at  the  beginning  of  this  e-­‐book)  and  go  to  the  

moment  when  the  option  of  adding  custom  parameters  occurs.  

 

   

Here  we  can  add  our  parameters  to  the  dynamic  remarketing.  We  can  do  this  in  two  ways:  

 making  use  of  Data  Layer  (and  now    we  will  do  so)  or  we  can  define  each  parameter  as  a  

macro  and  this  is  the  second  way  which  we  will  discuss  in  a  moment.  

 

Ad  2.  Create  a  rule  for  the  remarketing  tag  

 

Remarketing  tag  should  be  called  on  pages  which  indicate  some  kind  of  intentions  of  a  user  

who  visits  our  service.  So  a  good  idea  is  to  remind  the  user  the  product  which  he  or  she  

viewed  at  but  did  not  buy.    Then  it  is  worth  adding  people  who  visited  our  service  subpages  

Page 106: Google Tag Manager (Manual in English)

     

106  

with  specific  products  to  the  remarketing  list.  Dynamic  remarketing  does  the  rest  for  us  

and  it  will  automatically  show  the  user  such  products  which  he/she  has  already  viewed.  

Labeling  each  kind  of  website  is  recommended,  the  more  data  the  better  differentiation  of  

the  user  and  constructing  a  suitable  remarketing  message  for  him.  We  have  such  categories  

which  are  worth  labeling  at  disposal:  

 

 

   

Now  we  will  deal  with  a  category  of  product  pages,  so  that  our  tag  is  fired  only  on  product  

pages.  We  have  to  find  some  common  feature  of  such  pages.  It  can  be  a  fragment  of  the  

code,  ID  of  DOM  element  or  the  part  of  URL  address.  

 

 

 

Page 107: Google Tag Manager (Manual in English)

     

107  

   

 

Let's  take  an  example  of  the  shop  http://www.charlotteas.com/  with  amber  jewelery.  I  

found  out  that,  a  common  feature  of  each  website  with  a  specific  product  is  a  fragment  

"products"  in  URL  address.  

 

Thereupon  we  create  the  rule:  

Fire  a  remarketing  tag  when  {{url}}  includes  the  character  string  :  products  

 

   

Page 108: Google Tag Manager (Manual in English)

     

108  

Of  course  if  parameter  values  will  be  added  dynamically  (e.g.  pagetype)  before  being  sent  

to  Data  Layer(next  step)  we  can  actually  fire  a  remarketing  code  on  each  website.  In  other  

case  we  have  to  create  as  many  remarketing  codes  with  separate  rules  for  each  pagetype,  

as  many  pagetypes  we  want  to  label  with  the  remarketing  code.  

 

Ad  3.  Choose  parameters  and  send  them  to  Data  Layer  

 

We  can  give  more  parameters  than  only:  pagetype,  product  ID  and  product  value  (total  

value).  It  is  important  in  order  not  change  variables  which  are  allocated  to  the  dynamic  

remarketing18.  I  recommend  sticking  to  the  terminology  proposed  in  AdWords  help.  

   

Three  variables  above  are  standard  variables  and  one  should  make  use  of  them.  Of  course  

we  can  add  more  variables.  Their  description  is  available  in  AdWords  help  about  dynamic  

remarketing.  

Now  the  most  important  thing.  Let's  look  at  the  code  below.  We  can  see  a  

"google_tag_params"  variable  there.  To  this  variable  we  have  to  sent  all  variables  and  

values  concerning  the  product  to  a  dynamic  remarketing.  Unfortunately,  it  must  happen  

                                                                                                               18 More about parameters of dynamic remarketing on - https://support.google.com/adwords/answer/3103357

Page 109: Google Tag Manager (Manual in English)

     

109  

with  the  help  of  somebody  who  takes  care  of  our  website  and  can  load  these  data  from  our  

server,  cms,  shop  engine.  In  any  way  it  is  not  too  difficult.  It  works  the  same  like  the  

implementation  of  E-­‐commerce  module  of  Google  Analytics  in  the  online  shop.    

 

We  locate  the  script  with  ecomm  variables  closed  in  google_tag_params  variable  above  

DataLayer  array  –  “dataLayer=  [];”.    As  you  can  see  in  the  example  below.  

 

<script  type="text/javascript">  

var  google_tag_params  =  {  

ecomm_prodid:  'Product_ID',  

ecomm_pagetype:  'product',  

ecomm_totalvalue:  'product_value'  

};  

</script>  

<script>  

dataLayer  =  [{  

   google_tag_params:  window.google_tag_params  

}];  

</script>  

 

As  we  can  see,  we  place  a  variable,  which  sends  our  variables  of  dynamic  remarketing,  in  

Data  Layer.  

What  have  we  done?  We  have  created  google_tag_parms  variable  which  includes  pairs  of  

data  "variable:  value"  needed  to  our  remarketing.  Then  we  refer  to  this  variable.  Now  our  

data  are  already  available  for  GTM.  It  is  a  bit  complicated  but  if  we  do  not  want  to  

understand  it  we  should  only  do  this  as  described  above.  Of  course  taking  our  products  into  

consideration  ;)  

 

 

 

Page 110: Google Tag Manager (Manual in English)

     

110  

Ad  4.  Create  a  macro    which  will  combine  data  from  Data  Layer  with  a  remarketing  

tag.  

 

The  macro  must  be  of  a  dataLayer  variables  type.    

This  type  of  macro  makes  use  of  variables  and  values  from  Data  Layer.  As  a  variable  we  use  

a  variable  which  we  have  already  sent  to  DataLayer,  i.e.  "google_tag_params".  

   

   

I  have  called  my  macro  as  a  variable  to  know  what  a  given  macro  refers  to  but  everyone  can  

use  the  name  of  their  choice.  

Then  we  return  to  remarketing  tag  and  configure  custom  parameters.  It  comes  down  to  

choosing  variables  of  Data  Layer  that  is  to  our  macro  which  we  have  jus  created.  

 

Page 111: Google Tag Manager (Manual in English)

     

111  

   

Ready.  Now  we  have  a  fully  configured  dynamic  remarketing  for  product  pagetypes.  What  

will  happen?  While  the  user  visits  the  website  with  the  word    "products"  in  URL  address  (a  

rule  which  we  have  created)  the  remarketing  code  with  "google_tag_params"  variable  of  

DataLayer  will  be  called.  In  turn,  "google_tag_params"  variable  makes  use  of  data  sent  

before  from  the  variable  which  was  placed  above  our  dataLayer  table  =  [];.  

 

The  whole  procedure  of  dynamic  creation  seems  a  bit  roundabout  way  for  the  first  time.  In  

turn,  as  you  can  carefully  observe,  a  remarketing  code  once  configured  will  work  not  

depending  on  what  additional  variables  we  will  want  to  add.  We  do  not  have  to  also  edit  

anything  in  the  Data  Layer  array  (dataLayer  =  [];)It  is  enough  to  edit  (modify  or  add  

variables  and  values)  in  our  variable  above  dataLayer  array  (google_tag_params).  Another  

case  is  the  fact  that  if  we  want  to  use  Data  Layer  in  a  dynamic  remarketing  we  can  use  only  

one  macro.  Hence,  we  "close"  a  lot  of  variables  and  values  instead  of  one  in  one  macro.  

 

That's  all.  We  should  remember  about  other  pagetypes.  We  have  to  create  for  them  other  

Page 112: Google Tag Manager (Manual in English)

     

112  

sets  of  rules  and  tags  or  dynamically  replace  pagetypes  in  google_tag_params  variable  

which  is  above  array  dataLayer  =[].  

 

The  rest  is  the  work  on  AdWords  account.    

Creating  remarketing  lists  and  AdWords  campaigns  with  dynamic  creations.  

 

It  is  also  worth  reading  about  other  available  variables  in  dynamic  remarketing  in  

AdWords  help  on:  

 https://support.google.com/adwords/answer/3103357  

 

The second method – without sending variables programmistically  

The  first  method  –  recommended  one,  because  it  makes  use  of  DataLayer  may  not  be  

always  suitable.  It  is,  at  least,  because  of  the  need  of  programmer's  help.  We  have  to  

dynamically  send  somehow  values  of  our  variables  to  Data  Layer.  However,  we  cannot  do  

without  little  programmatically  modifications.  

 

The  second  method,  less  popular  one,  allows  us  to  do  without  a  programmer  and  use  

possibilities  which  Google  Tag  Manager  gives  to  us.  So  what  can  we  do  then?  We  will  help  

ourselves  with  GTM  and  we  will  order  it  to  recognize  the  pagetype,  product  and  price  from  

the  content  of  the  website  code.  Sounds  interesting.  It  can  be  done  almost  always,  and  the  

better  (more  precisely)  programmatically  the  website  is  written  the  easier  it  will  be.  

 

What  will  we  do  then?  

 

1.  Create  macros  which  recognize  variables  from  the  website  content  

2.  Modify  a  remarketing  tag.  

3.  Create  a  rule  to  fire  the  remarketing  tag.  

 

 

Page 113: Google Tag Manager (Manual in English)

     

113  

Ad  1.  Creating  macros  which  will  identify  variables  from  the  website  content  

 

We  have  taken  the  challenge  of  recognizing  variables  and  values  from  the  website  content  

with  the  help  of  possibilities  of  GTM,  without  any  help  of  a  programmer  and  using  them  in  

dynamic  remarketing  configurations.  Let's  move  further.  

 

We  have  three  variables  to  be  recognized:  

 

1. A  website  type  (ecomm_pagetype)  –  in  our  case  they  are  the  pages  with  products.  

2. ID  product  (ecomm_prodid)  –  in  our  case  we  search  the  name  of  the  product  and  we  

set  it  as  an  identifier.  We  can  also  do  this  because  each  name  is  unique  on  the  website.  

3. Product  value  (ecomm_totalvalue)  –  we  would  try  to  obtain  this  too.  

 

Let's  do  this.  

 

We  search  a  pagetype    

 

Our  example  is  based  on  the  website  charlotteas.com,  a  shop  with  amber  jewelery.  

 

   

Page 114: Google Tag Manager (Manual in English)

     

114  

To  find  any  tag  or  label  typical  for  product  page  of  this  website  we  edit  the  first  available  

product  page  of  Charlotteas.com.    We  enter  a  tab  with  products  and  choose  any  product.  

The  product  page  address  which  I  will  preview  is:  

http://www.charlotteas.com/collections/pendants/products/pendant12  

   

 

   

Previewing  the  source  code,  I  search  a  place  which  will  help  me  find  the  element  in  the  

code  which  is  responsible  for  identification  of  this  website  type  (product  website).  

 

I  usually  start  from  searching  any  unique  element  ID.  In  the  source  website  preview  I  

search  for  unique  identifiers.  They  are  mostly  ID  of  such  elements  like  body  and  Div  but  

also  there  can  be  others.    

 

Page 115: Google Tag Manager (Manual in English)

     

115  

   

I  have  found  a  unique  ID  for  <div>  element.  It  is  id=product.  I  checked  for  other  pages  too  

e.g.  the  contact  or  main  website,  and  ID  in  this  place  has  different  values.    It  is  a  good  

candidate.  Now  we  need  to  obtain  this  information  and  send  it  to  GTM.  We  will  do  this  with  

the  macro  of  "DOM  element"  type.    

 

 What  does  this  macro  do?  

Macro  finds  the  element  with  the  "product"  identifier.  In  this  case  it  is  DIV  element.  I  give  

the  name  of  the  attribute  as  ID.  It  means  that  I  want  to  take  out  only  the  content  of  id  value  

(i.e.  from  id="product"  takes  out  "product").  If  I  did  not  add  in  this  place  the  parameter  

name,  the  macro  would  take  out  texts  from  the  whole  div  element  labeled  as  id=product,  

Page 116: Google Tag Manager (Manual in English)

     

116  

but  it  is  not  about  it.  

 

There  is  the  second  way  for  determining  value  of  a  variable  (ecomm_pagetype).  Even  

simpler  one  but  it  has  some  limits.  If  we  cannot  find  suitable  relationships  in  the  website  

code  which  will  allow  for  auto  recognition  of  the  website  type  we  can  use  the  macro  

(Constant  String)  in  which  we  rigidly  set  the  name  of  pagetype.    

 

   

If  we  rigidly  determine  the  value  of  ecomm_pagetype  variable,  we  have  to  compensate  this  

fact  setting  the  rule  for  the  remarketing  tag  when  it  is  to  be  fired.  Here,  we  will,  for  

example,  use  URL  address.  

 

Thus,  we  have  the  configured  parameter  concerning  the  variable  of  pagetype  –  

ecomm_pagetype.  Now,  the  next  parameter  that  is  identifier  of  the  product  itself.  As  we  

have  determined  before,  the  identifier  can  be  the  product  name  because  it  is  unique  within  

the  website.  We  must  remember  that  making  use  of  many  "feeds"  in  Google  Merchant  Center  

account,  the  identifier  cannot  be  repeated.  We  have  to  take  it  into  consideration  using  the  

name  as  identifiers19.  As  the  name  of  product  is  unique,  we  create  a  macro  which  will  

identify  for  us  the  product  name.  Again  we  search  such  a  website  element  which  will  give  

                                                                                                               19 More about feeds - https://support.google.com/merchants/answer/188494

Page 117: Google Tag Manager (Manual in English)

     

117  

us  the  product  name  (or  another  unique  identifier).    

 

   

Again  I  have  found  <div>  element  with  the  "product"  identifier.  I  can  see  that  the  product  

name  is  the  class  of  this  element.  "Pendant12"  is  a  unique  product  name.  To  download  this  

value  from  the  class  parameter,  we  will  use  "DOM  element"  macro  again.  

 

 What  does  this  macro  do?  

The  macro  loads  the  value  from  "class"  attribute  for  <div>  element  from  "product"  

identifier.  

 

Page 118: Google Tag Manager (Manual in English)

     

118  

The  second  way  could  be  downloading  value  of  the  "class"  element  from  <div>  element  of  

id="product”  with  the  help  of  "Custom  JavaScript"  macro.  Here  we  would  have  to  ask  

somebody  for  help,  someone    who  knows  how  to  use  JS  language.  Such  a  macro,  for  our  

example,  could  look  like  as  follows:    

 

 

   

We  have  the  second  parameter  of  dynamic  remarketing  which  we  have  to  determine.  Now  

it  is  time  for  the  third  parameter,  that  is  ecomm_totalvalue.  

 

We  will  also  try  to  take  out  the  third  parameter  from  the  website  code.  What  I  have  

determined,  the  product  price  is  stored  in  the  elements  of    the  "price-­‐preview"  identifier.    

 

 

Page 119: Google Tag Manager (Manual in English)

     

119  

   

Hence,  we  create  a  macro  again.  It  will  be  the  macro  of  "DOM  element"  type.    

 

 

 What  does  this  macro  do?  

The  macro  downloads  the  content  of  elements  of  the  "price-­‐preview"  identifier.    

 

We  have  already  all  parameters  needed  for  dynamic  remarketing.  Now  we  return  to  our  

remarketing  tag  to  finish  its  configuration.  

Editing  th  remarketing  tag    which  we  have  created  at  the  beginning,  we  add  parameters  

created  manually  (not  with  the  help  of  Data  Layer).  

Page 120: Google Tag Manager (Manual in English)

     

120  

 

   

Actually,  it  is  the  end.  Now  we  can  check  our  work  in  the  Debug  mode.  After  going  to  the  

website  we  will  use  Tag  Assistant  plug-­‐in  to  check  if  values  of  dynamic  remarketing  are  

sent.  

   

Page 121: Google Tag Manager (Manual in English)

     

121  

 

Now  we  need  only  to  configure  remarketing  lists  and  campaigns  on  Google  AdWords  

account.  

Ecommerce tracking in GA with GTM Adding  a  module  which  tracks  Ecommerce  transactions  in  Google  Analytics  is  one  of  the  

most  important  configuration  actions  of  GA  for  shops,  and  not  only.  Thanks  to  the  

Ecommerce  module  we  can  analyze  almost  all  reports  on  the  users'  activity  on  our  website  

on  the  revenue  level  (show  me  the  money  level).  Actually,  I  cannot  imagine  a  shop  which  

has  Google  Analytics  and  does  not  use  the  Ecommerce  module.  

 

In  a  traditional  way  firing  consists  in  switching  the  module  on  in  settings  of  the  View  

profile  in  GA.  Then  we  have  to  place  a  suitable  code  with  variables  on  the  website  which  

confirms  our  purchases  (thankyou_for_purchase).  Variables  must  get  suitable  values  from  

our  shop  system  sent  to  Google  Analytics  so  that  they  could  be  from  this  website  which  

confirms  the  purchase.  Such  an  operation  requires  programmatical  help.  Unfortunately,  we  

also  do  not  run  away  from  it    with  GTM  because  we  have  to  send  to  another  values  of  

purchases  like  until  now.  But  this  time  we  will  send  them  to  Data  Layer.  At  least,  it  will  be  

easier  to  administer  this  code.    

So,  let's  start.  

 

To  install  the  Ecommerce  module  on  the  website  with  the  use  of  GTM  we  have  to:  

 

1.  Create  a  new  Google  Analytics  tag  responsible  for  registration  of  transaction.  

2.  Send  values  for  variables  to  Data  Layer.  

3.  Set  the  rules  of  firing  the  module  of  counting  transactions.  

 

Ad  1.  Creating  GA  tag  for  measuring  transactions  

 

Tag  for  measuring  transactions  we  create  in  the  same  way  like  any  other  Analytics  tag.  

Page 122: Google Tag Manager (Manual in English)

     

122  

However,  in  this  case  we  choose  track  type  as  "Transaction".  

Remember  that  for  each  time  we  create  a  new  GA  tag,  if  we  want  to  add  any  new  track  type.  

I.e.  in  our  case  it  will  be  another  GA  tag  on  one  account.  We  have  already  the  tag  

responsible  for  measuring  pageviews,  we  have  the  tag  responsible  for  event  tracking  and  

now  we  will  have  a  tag  responsible  for  tracking  transaction.  

 

Ad  2.  Sending  values  to  variables  in  Data  Layer  

 

In  this  step  we  have  to  be  helped  by  a  person  who  deals  with  our  shop  programmatically.  

Values  and  data  concerning  a  given  transaction  should  be  send  from  data  about  

transactions  (obligatory  and  optional  variables)  .  Our  array  above  the  GTM  container  will  

look  more  or  less  like  this,  for  ccommerce  transaction:    

 <script>  

dataLayer  =  [{  

       'transactionId':  '1234',  

       'transactionAffiliation':  'Acme  Clothing',  

       'transactionTotal':  '11.99',  

       'transactionTax':  '1.29',  

       'transactionShipping':  '5',  

       'transactionProducts':  [{  

               'sku':  'DD44',  

               'name':  'T-­‐Shirt',  

               'category':  'Apparel',  

               'price':  '11.99',  

               'quantity':  '1'  

       },{  

               'sku':  'AA1243544',  

               'name':  'Socks',  

               'category':  'Apparel',  

               'price':  '9.99',    

               'quantity':  '2'  

       }]  

}];  

</script>  

We  send  data  about  each  purchased  product  and  data  about  the  whole  transaction  to  Data  

Page 123: Google Tag Manager (Manual in English)

     

123  

Layer.  

There  is  a  set  of  obligatory  and  optional  variables    which  we  have  to  use  in  Data  Layer:  

 

Variables  for  transaction  

 

   

Data  of  purchased  products  

 

   

Ad  3.  Creating  rules  for  the  GA  tag  responsible  for  transactions  

 

Now  we  have  to  only  determine  the  rule  for  the  tag,  when  it  is  to  be  fired.  

Because  the  tag  concerning  transaction  is  to  collect  information  about  transactions  it  

should  be  fired  at  the  moment  when  transaction  will  happen.  So  that  the  only  right  place  to  

Page 124: Google Tag Manager (Manual in English)

     

124  

fire  it  are  pages  with  confirmation  of  the  purchase.  These  are  pages  of  the  type:  

Thankyou_for_transactions.html,  transaction_confirmation.html,  etc.  

 

So,  we  create  the  rule.  

 

   

The  first  part  of  the  condition  is  clear,  I  hope.  Let  the  tag  to  be  fired  when  URL  address  will  

include  a  fragment  "transaction_completed".  This  is  can  whatever  string  of  the  URL  address  

that  confirms  that  the  purchase  was  completed.  

The  second  fragment  may  not  be  clear  to  the  end.  The  event  built  into  GTM,  i.e.  gtm.dom  

does  not  allow  to  fire  the  tag  unless  the  whole  website  is  loaded.  Sometimes  it  simply  

happens  that  our  container  may  not,  for  different  reasons,  be  at  the  very  top  of  the  website  

content  and  so  that  the  transaction  is  registered  for  sure  we  have  to  allow  to  load  the  whole  

website.  And  this  is  the  secret.  ;).  

 

Dealing with the bounce rate in Google Analytics (real bounce rate)  

The  bounce  rate  is  one  of  more  important  rates  which  are  taken  into  consideration  in  the  

matter  of  optimizing  website  usability.  It  is  obvious  that  the  higher  bounce  rate  means  that  

Page 125: Google Tag Manager (Manual in English)

     

125  

less  visitors  made  use  of  additional  contents  of  the  website.  It  means  that  the  website  does  

not  meet  expectations  of  a  visitor.  Hence,  it  is  worth  counting  this  rate  carefully  because  on  

its  basis,  between  others,  optimization  decisions  are  made.  The  problem  in  Google  

Analytics  as  far  as  this  rate  is  concerned  is  that  it  is  not  precisely  counted  in  standard  

configuration.  If  somebody  has  entered  our  website  and  stayed  on  it  10  seconds  and  then  

left,  he/se  is  treated  the  same  like  in  the  case  of  the  user  who  visited  our  website  and  spent  

one  hour  there  (because  he  read  an  article)  and  then  left.  For  GA  the  customer  "bounced"  

from  the  website  and  the  time  of  his  staying  on  the  website  equals  0  seconds.  Why  is  it  so?  

Because  GA  measures  the  time  of  staying  on  the  page  by  subtracking  time  of  enter  the  next  

page  from  time  of  entering  the  first  page.  Without  moving  to  another  page  GA  cannot  count  

time.  The  time  on  first  page  (landing  page)  without  any  further  movement  will  be  0,  no  

matter  what  the  real  time  of  staying  was.    

 

Example  1:  

Entering  the  site  -­‐>  page  A  (landing  page)  time:  10:00  -­‐>  page  B  –  time  of  entering  10:01  –  

time  of  leaving  the  website:  10:01  -­‐>  leaving  the  service.  

Time  of  staying  on  the  page  A  =  1  minute.  Time  of  staying  on  the  page  B  unknown.  there  is  

nothing  to  be  substracked  from  the  the  time  of  entering  the  page  B.  

 

Example  2:  

Entering  the  site  -­‐>  page  A  time:  10:00  -­‐>  leaving  the  service  10:29  

Real  time  on  the  website  29  minutes.  Time  set  by  GA  –  0s.  Google  Analytics  does  not  know  

how  long  the  user  is  on  the  website.  Because  we  have  no  time  of  entering  another  page  of  

website  to  substracked  from  entering  time  on  page  A.  GA  classifies  the  time  as  0  s.  Of  

course  the  visit  will  be  treated  as  visit  with  bounce.    

 

If  we  want  to  make  any  decisions  based  on  the  bounce  rate  we  have  to  make  it  real.  The  

best  example  is  to  define  time  after  which  Google  Analytics  is  to  stop  treating  entering  the  

website  as  bounce.  That  is  for  example  after  10  seconds  from  entering  the  website  we  can  

assume  a  user  engaged  in  the  page  content  and  it  is  a  valuable  visit  for  him.  Let's  make  the  

Page 126: Google Tag Manager (Manual in English)

     

126  

bounce  rate  real  on  our  website.  To  do  this  we  need  an  event  in  Google  Analytics  which  will  

register  the  time  of  staying  on  the  website  and  cause  that  the  bounce  rate  will  not  be  

counted  even  after  leaving  a  given  website  without  going  deeper  in  the  service.  We  can  do  

this  with  GTM.    

 

What  we  have  to  do  is:  

 

1. Carte  a  tag  with  auto  time  listener  

2. Create  the  GA  tag  responsible  for  sending  information  about  time  event.  

3. Create  rules  which  will  allow  to  fire  tags  in  a  suitable  moment.  

 

 

Ad  1.  A  tag  registering  the  time  automatically  

 

Create  the  tag  –  Time  listener.  We  define  the  event  name.  Generally,  there  is  no  need  to  

change  it.  We  set  the  time  interval  in  every  what  time  a  given  event  is  to  be  fired.  At  the  end  

we  set  a  number  of  firing  of  a  given  event.  We  set  one  (1)  because  we  do  not  need  more.  We  

are  interested  into  the  fact  if  someone  was  less  or  more  than  10  seconds.  

 

 

 

Page 127: Google Tag Manager (Manual in English)

     

127  

 

Do  not  forget  that  we  need  to  determine  a  rule  too  when  a  given  tag  is  to  be  fired.  

In  our  case  we  want  to  know  a  real  bounce  rate  for  each  website  of  our  service.  So  that  we  

set  "All  pages".  

 

Ad  2.  Create  the  GA  tag  responsible  for  the  bounce  rate  

 

Create  a  new  Google  Analytics  tag  responsible  for  event  registration.  

   

We  add  event  labels,  how  we  want  the  category  and  event  action  to  be  named.  Of  course  we  

can  also  add  other  values  but  in  this  case  it  does  not  matter.  Remember  not  to  change  the  

settings  "Non-­‐interaction  Hit".  If  we  leave  it,  while  doing  event,  the  bounce  rate  will  be  

eliminated.  The  event  will  affect  its  cancellation.  If  we  set  its  value  on  "true",  the  event  will  

not  affect  the  bounce  rate  and  despite  execution  of  the  event  the  bounce  rate  will  be  

counted  while  leaving  the  page.  

 

Page 128: Google Tag Manager (Manual in English)

     

128  

Now  just  only  a  rule  for  our  Google  Analytics  tag.  

 Our  rule  says:  Fire  Google  Analytics  tag  which  will  register  events  when  {{event}}  equals  

gtm.timer.  That  is  our  Time  Listener.  We  know  that  Time  Listener  will  be  called  after  10  

seconds  since  entering  the  website.  Just  then  our  tag  will  fire  itself,  register  event  and  

cancel  counting  the  bounce  rate.  

 

Tags  which  are  not  in  GTM    

Indeed.  What  to  do  when  there  is  no  tag  which  we  want  to  install  with  GTM  on  the  defined  

list  in  Tag  Manager?  There  is  not  any  problem  because  there  are  custom  tags.  We  have  two  

types  of  custom  tags  available:  

 1. Custom  HTML  tag  2. Custom  Image  tag  

 Ad  1.  Custom  HTML  tag    Thanks  to  such  a  type  of  tag  we  can  add  any  other  tag  which  is  not  in  standard  on  the  list  in  

GTM.  Simply  we  paste  the  whole  fragment  of  the  tracking  code  which  we  want  to  

implement  on  the  website  in  an  available  place.    

Page 129: Google Tag Manager (Manual in English)

     

129  

With  the  help  of  the  custom  tag  we  can  occasionally  add  also  elements  on  the  website.  It  is  

not  recommended  but  possible.  We  can  add,  for  example  the  javasript  or  simple  html  code.  

 

As  an  example  I  have  added  tag  with  very  simple  fragments  of  the  javascript  code  which  is  

to  call  the  window  with  a  notice  "it  is  a  custom  javascript"  on  the  website.  

   After  saving  and  publishing  (or  while  testing)  the  container  version,  a  given  script  will  be  

called  on  our  website,  together  with  other  tags.  

 

 

   

   

Page 130: Google Tag Manager (Manual in English)

     

130  

It  is  the  same  situation  if  we  add  a  simple  HTML  code:      

   The  result  will  be  as  follows:    

 

Of  course  these  are  very  simple  examples  but  they  are  only  for  presenting  possibilities  

which  a  custom  tag  gives.  What  is  interesting,  we  can  use  macros  created  by  us  in  a  tag  

code.  One  should  only  always  remember  about  closing  macro  name  in  double  brackets  

{{my_macro}}.  Worth  to  remember  that  if  we  start  the  adventure  with  GTM  this  Custom  tag  

Page 131: Google Tag Manager (Manual in English)

     

131  

type  of  tag  will  not  be  rather  very  often  used  by  us.  Most  of  the  most  popular  tracking  

scripts  are  already  built  in  

Page 132: Google Tag Manager (Manual in English)

     

132  

Using GTM in mobile applications  

Nowadays  Google  Tag  Manager,  except  its  very  important  function  of  tag  administering  on  

websites,  allows  in  a  revolutionary  way  to  administer  also  our  mobile  applications.  Here,  I  

am  writing  'administer'  because  it  is  not  only  about  tags  and  tracking  codes.  It  is  about  

administering  the  application  itself  and  introducing  changes  in  it.  So  what  does  GTM  do  for  

application?  

 

 

GTM  for  application  allows  to:  

1. Administer  tags  in  applications  (GA  codes,  conversion,  remarketing,  etc.)  

2. Introduce  changes  in  application  (revolution)  

 

Administering tags in application – a few words  

Here,  there  is  not  probably  any  surprise.  GTM  allows  to  administer  tags  inside  the  

application.  It  allows  us  to  track  actions  of  users  in  application,  it  allows  to  implement  

conversion  and  remarketing  codes.  Thanks  to  this  we  can  run  effective  remarketing  

campaigns  for  our  application.  

   

 

Page 133: Google Tag Manager (Manual in English)

     

133  

As  you  can  see,  the  interface  does  not  differ  a  lot.  We  create  a  container  in  the  same  way  

(we  can  choose  if  we  create  separate  containers  for  iOS  and  Android  or  one  common),  tags,  

rules  and  macros.  

 

Unfortunately,  the  truth  is  that  without  the  help  of  someone  who  is  engaged  in  creating  

applications  it  will  be  difficult  for  us  to  understand  all  possibilities  of  GTM  for  applications.  

The  most  important  is  to  understand  what  we  can  expect  from  GTM  for  application.  

Introducing changes in application (revolution)  

The  problem  with  applications  is  that  at  the  moment  of  downloading  them  on  the  device  

we  loose  control  over  it  a  bit.  Application,  shortly  speaking,  has  gone  off  the  leash.  Like  a  

car  leaves  the  factory  and  in  order  to  change,  modify  or  repair  something  in  it  the  owner  

has  to  go  to  the  repair  shop.  The  same  is  with  the  application.  If  we  want  to  improve,  

change,  modify  something  we  have  to  create  another  version  of  application  and  encourage  

users  to  its  download.  Everything  depends  on  the  owner  of  the  device.  If  the  owner  does  

not  want  to  download  a  newer  version,  we  lost  control  on  this  application  "forever".  Now  

the  situation  has  changed  thanks  to  GTM  for  application.  

 

Administering  tags  is  one  thing  but  GTM  can  do  much  more.  Namely,  it  lets  us  have  control  

over  applications  already  downloaded  (already  on  the  devices).  We  can  introduce  changes  

in  application  and  administer  it  even  if  it  was  downloaded.  In  this  way  we  do  not  have  to  

ask  anybody  for  downloading  new  versions.  But  let's  start  from  the  beginning.  

A problem with mobile applications  

As  I  have  mentioned  after  the  application  is  installed  on  the  device.  It  is  a  bit  out  of  our  

reach.  We  can  only  update  it  by  introducing  a  new  version  in  the  online  shop  and  

encouraging  to  its  download.  This  creates  quite  a  lot  of  problems:    

Page 134: Google Tag Manager (Manual in English)

     

134  

   

● Application  requires  repeated  verification  in  the  shop  in  terms  of  security  

● Application  must  be  sent  again  and  installed  from  the  beginning.  

● On  the  market,  the  more  our  applications,  the  more  versions  which  function  because  

not  everybody  updates  software  as  frequently  as  we  would  like  to.  

 

Of  course  it  is  not  the  intention  of  GTM  creators  to  omit  the  shop  verification.  It  is  

recommended  to  inform  about  changes  and  undergo  verification  but  on  different  basis.  

 

How does GTM work for application?

   

Page 135: Google Tag Manager (Manual in English)

     

135  

Google  Tag  Manager  for  application  works  on  the  basis  of  constant  updating  data  included  

in  the  container.  Changes  propagate  themselves  every  12  hours(changes  are  checked  twice  

a  day).  It  does  not  mean  that  if  application  does  not  have  any  access  to  the  Internet  it  will  

not  work.  While  installing,  a  container  with  default  values  of  variables  is  installed.  

Additionally,  GTM  does  not  use  a  lot  of  data  transfer  to  update  the  container,  so  we  do  not  

have  to  worry  about  the  fact  that  application  will  be  consuming  a  lot  of  internet  data  

transfer.  

 

Updating  the  container  and  creating  a  new  version,  simply  we  wait  for  the  application  

being  updated.  We  can  of  course  test  changes  by  a  test  version  which  we  open  on  our  

mobile  device.  We  can  also  send  a  special  link  to  people  who  will  be  also  able  to  see  a  test  

version  thanks  to  the  link.  

 

   

Page 136: Google Tag Manager (Manual in English)

     

136  

What can be changed by GTM in application?  

Google  Tag  Manager  allows  to  change  a  lot  of  things  in  application,  from  Visual  changes  to  

usefulness,  through  changes  in  the  place  of  advert  display,  to  changes  in  principles  of  

working  application  (e.g.  changes  of  number  of  lives  in  the  game)  

 

   

Let's  see  it  on  the  example  of  test  application  used  by  Google  team.  

We  have  application  which  is  used  to  store  contacts.  In  a  given  application  we  have  a  place  

for  an  advert.  

 

Page 137: Google Tag Manager (Manual in English)

     

137  

   

After  some  time  we  claim  that  the  better  solution  would  be  to  move  the  advert  to  the  

bottom  of  the  screen  and  use  a  bigger  format.  In  GTM  in  a  given  moment  we  have  such  

values  as  far  as  our  advert  place  is  concerned.  

 

   

We  need  only  change  values  for  the  macro  responsible  for  the  place  and  advert  type.  

 

 

Page 138: Google Tag Manager (Manual in English)

     

138  

   

In  this  way  we  will  obtain  the  following  result.  The  advert  will  be  occurring  from  now  at  the  

bottom  of  the  screen.  It  will  have  a  different  format.  

  Another  example  can  be,  for  instance,  the  change  of  view  of  application  in  terms  of  periodic  

sales  campaigns.  We  have  decided  that  we  want  to  have  another  application  background    

for  Christmas.  With  the  Christmas  tree;).  You  have  to  only  use  the  macro  which  will  fire  a  

suitable  background.  Here  you  should  know  that  this  kind  of  things  like  background  must  

be  already  present  in  the  application  itself.  We  can  have  an  influence  on  rules  or  principles  

of  their  display  but  we  do  not  send  them  by  GTM  to  application.  

Page 139: Google Tag Manager (Manual in English)

     

139  

 

In  this  way,  in  12  hours,  our  application  will  look  like  this  at  everybody.  Of  course,  if  they  

are  connected  to  the  Internet  at  this  time,  so  that  the  container  had  a  chance  to  be  

refreshed.  Of  course  this  will  change  at  the  moment  of  another  opening.  Application  needs  

to  be  restarted  to  see  the  changes.  

Another  examples  are,  for  instance,  adding  language  version  to  the  application,  change  of  

Page 140: Google Tag Manager (Manual in English)

     

140  

lives  in  the  game,  etc.  All  of  these  can  be  easily  modified  because  this  does  not  require  to  

implement  new  elements  to  the  application.  We  use  the  same  variables  and  change  only  

their  values.  

 

Page 141: Google Tag Manager (Manual in English)

     

141  

A few final thoughts  

Using  Google  Tag  Manager  we  can't  remember  about  a  few  important  things  which  run  

away  very  often  and  cause  frustration  and  waste  of  time.  Here  are  a  few  of  them:  

 

1. Remember  to  publish  a  new  version  of  a  container  always  after  changes.  

2. Create  a  reasonable  system  of  a  terminology  of  tags,  rules  and  macros.    

3. Keep  domains  on  separate  accounts  so  that  it  would  be  easier  to  understand  everything.  

Unless  a  few  domains  create  the  whole/integrity  in  the  Internet.  

4. Always  test  tags  before  publishing  them.  

5. Use  the  Lookup  table  macro  to  create  test  environment  in  GA  so  that  not  to  spam  

statistics  with  tests.  

6. Plan  tags  migration  before  you  will  start  to  do  this.  

7. Be  careful  with  capital  letters.  They  may  cause  that  macros  and  rules  do  not  work.  

8. Use  Tag  Assistant  

 

There  are  surely  more  of  such  popular  issues  connected  with  using  GTM  but  these  ones  are  

the  most  worth  mentioning  at  the  very  end.  

Page 142: Google Tag Manager (Manual in English)

     

142  

Migration plan to GTM    At  the  very  end  of  the  part  about  using  GTM  on  websites  I  place  a  proposed  schedule  of  

migration  of  the  tags  to  GTM  which  are  on  the  website.  It  is  worth  having  a  plan  of  this  

work  so  that  any  data  were  not  lost  during  the  migration.  It  is  only  an  offer,  of  course  

everyone  can  but  they  do  not  have  to  use  it.  

     

 

Plan  

• make  a  list  of  tags  to  migrate  •   Are  those  tags  standard  or  custom  ones?  • Do  we  have  event  tracking  codes  for  events  or  any  other  snippets  within  the  website  source  code?  • Do  we  tracking  one  or  more  domains  or  subdomains?  • Who  is  responsible  for  editing  the  website?  

Implementation  

• Implementing  empty  container  on  website  • Create  test  account  in  GA  for  tests  • Set  settings  in  GTM  (+macro  lookup  table  )  • Tag  implementation,  macros  and  rules  

Testing  

• Testing  each  tag  on  test  GA  account  +  (Debug  >  Preview)  

Launching  

• Deleting  tags  from  site  one  by  one  and  turning  them  on  in  GTM.  From  the  most  standard  to  most  custom.  We  don't  have  to  delete  all  tagd  at  once.  Tags  directly  on  the  site  (not  through  GTM)  can  work  alongside  tags  working  from  GTM.    

Page 143: Google Tag Manager (Manual in English)

     

143  

Conclusion The  task  of  this  e-­‐book  is  to  explain  issues  connected  with  using  the  Google  Tool  Manager  

to  all  who  are  not  skilled  at  technical  issues  concerning  creating  pages,  programming  and  

everything  which  should  be  dealt  with  by  people  from  the  IT  department  or  webmasters.    

 

However,  power  of  a  good  specialist  in  internet  marketing  is,  at  least,  understanding  the  

rules  of  working  and  possibilities  which  are  given  by  new  tools  and  technologies.  So,  

according  to  this  thought,  I  have  tried  to  describe  the  rule  of  working  and  possibilities  of  

GTM  in  the  simplest  way,  omitting  purposefully  all  more  complicated  descriptions  and  

simplifying  some  issues.  

 

The  e-­‐book  does  not  include  everything  about  Google  Tag  Manager.  It  is  much  more  

information  if  someone  wants  to  learn  this  subject  thoroughly.  I  have  purposefully  omitted  

some  elements  of  configuration  in  the  e-­‐book.  I  meant  to  explain  possibilities  and  rule  of  

working.  You  must  read  more  about  the  rest.  

 

 

I  hope  the  material  will  help  someone  in  a  more  and  more  technical  world  of  marketing.  

 

 

Regards,  

Author  and  Contributors  

           Any  cases  considering  this  ebook,  please  contact  [email protected]