My slides about how to do Advanced Form Tracking in Google Tag Manager. I presented these at Conversion Conference London, in October 2014.

1. NB
Advanced Form Tracking
Google Tag Manager
29 Oct 2014 | Conversion Conference, London | @SimoAhava

2. @SimoAhava
google.me/+SimoAhava
>> www.simoahava.com <<
Simo Ahava

3. NB
What’s the point?
3

4. Session includes
/thankyou/ page
NB
Why track forms?
Session does not include
4
Session start
/thankyou/ page
?
Form engagement is rarely tracked together with web traffic
29 Oct 2014 | Conversion Conference, London | @SimoAhava

5. Session includes
/thankyou/ page
NB
Why track forms?
Session does not include
5
Session start
/thankyou/ page
Track forms to reveal the conversion-killing monsters…
29 Oct 2014 | Conversion Conference, London | @SimoAhava

6. Session includes
/thankyou/ page
NB
Why track forms?
Session does not include
6
Session start
/thankyou/ page
…and to find opportunities to optimize the entire online experience
29 Oct 2014 | Conversion Conference, London | @SimoAhava

7. For many websites, a web form is central to
identifying and optimizing engagement goals!
NB
Why track forms?
7 29 Oct 2014 | Conversion Conference, London | @SimoAhava

8. Why track forms with Google Tag Manager?
NB
Because agility is incredibly important to web analytics
8 29 Oct 2014 | Conversion Conference, London | @SimoAhava

9. Why track forms with Google Tag Manager?
NB
Because a complex development process is detrimental to
analytics and to capturing the subtleties of engagement
9
X
29 Oct 2014 | Conversion Conference, London | @SimoAhava

10. Why track forms with Google Tag Manager?
Because Google Tag Manager leverages a number of JavaScript
NB
APIs that help you track engagement on your site
10 29 Oct 2014 | Conversion Conference, London | @SimoAhava

11. NB
What is the biggest challenge here?
11 29 Oct 2014 | Conversion Conference, London | @SimoAhava

12. NB
What is the biggest challenge here?
12
HTML
HEAD
BODY
ARTICLE
DIV
DIV
FORM
Event delegation
GTM’s form submit handler
29 Oct 2014 | Conversion Conference, London | @SimoAhava

13. NB
What is the biggest challenge here?
13
HTML
HEAD
BODY
ARTICLE
DIV
DIV
FORM
Event delegation
submit()
GTM
29 Oct 2014 | Conversion Conference, London | @SimoAhava

14. NB
What is the biggest challenge here?
14
HTML
HEAD
BODY
ARTICLE
DIV
DIV
FORM
Event delegation
submit()
GTM
29 Oct 2014 | Conversion Conference, London | @SimoAhava

15. NB
What is the biggest challenge here?
15
HTML
HEAD
BODY
ARTICLE
DIV
DIV
FORM
Event delegation
submit()
GTM
29 Oct 2014 | Conversion Conference, London | @SimoAhava

16. NB
What is the biggest challenge here?
16
HTML
HEAD
BODY
ARTICLE
DIV
DIV
FORM
Event delegation
submit()
GTM
29 Oct 2014 | Conversion Conference, London | @SimoAhava

17. NB
What is the biggest challenge here?
17
HTML
HEAD
BODY
ARTICLE
DIV
DIV
FORM
Event delegation
submit()
GTM
29 Oct 2014 | Conversion Conference, London | @SimoAhava

18. NB
What is the biggest challenge here?
18
HTML
HEAD
BODY
ARTICLE
DIV
DIV
FORM
Event delegation
submit()
GTM
JS
29 Oct 2014 | Conversion Conference, London | @SimoAhava

19. NB
What is the biggest challenge here?
19
HTML
HEAD
BODY
ARTICLE
DIV
DIV
FORM
Event delegation
submit()
GTM
JS
X
X
X
29 Oct 2014 | Conversion Conference, London | @SimoAhava

20. NB
Other challenges
 Is engagement page- or session-scoped?
 If the user returns to the form later in the session, is it an overall
success, or one abandonment and one completion?
 Just what events should you track?
 submit
 blur
 focus
 change
 unload
 Just what elements should you track?
 What are relevant fields?
 Should you track validation errors?
 Should you track for funnels or unique goals?
 Look out for PII!
20 29 Oct 2014 | Conversion Conference, London | @SimoAhava

21. NB
Tracking forms with Google Tag
Manager
21

22. NB
Step 1: Initiate a Form Submit Listener
22 29 Oct 2014 | Conversion Conference, London | @SimoAhava

23. NB
Step 1: Initiate a Form Submit Listener
23 29 Oct 2014 | Conversion Conference, London | @SimoAhava

24. NB
Step 1: Initiate a Form Submit Listener
24 29 Oct 2014 | Conversion Conference, London | @SimoAhava

25. NB
Step 1: Initiate a Form Submit Listener
25 29 Oct 2014 | Conversion Conference, London | @SimoAhava

26. Step 2: Create tag(s) to collect submit events
NB
26 29 Oct 2014 | Conversion Conference, London | @SimoAhava

27. Step 2: Create tag(s) to collect submit events
NB
27 29 Oct 2014 | Conversion Conference, London | @SimoAhava

28. Step 2: Create tag(s) to collect submit events
NB
28 29 Oct 2014 | Conversion Conference, London | @SimoAhava

29. Step 2: Create tag(s) to collect submit events
NB
29 29 Oct 2014 | Conversion Conference, London | @SimoAhava

30. Step 2: Create tag(s) to collect submit events
NB
30 29 Oct 2014 | Conversion Conference, London | @SimoAhava

31. NB
Step 3: Use macros to parse form fields
31
{{field value}}
Macro Type: Custom JavaScript
Code:
PII ALERT!
29 Oct 2014 | Conversion Conference, London | @SimoAhava

32. NB
Step 3: Use macros to parse form fields
32
{{selected option}}
Macro Type: Custom JavaScript
Code:
29 Oct 2014 | Conversion Conference, London | @SimoAhava

33. NB
Step 3: Use macros to parse form fields
33
{{checked button}}
Macro Type: Custom JavaScript
Code:
29 Oct 2014 | Conversion Conference, London | @SimoAhava

34. NB
Step 3: Use macros to parse form fields
34
{{string of checked buttons}}
Macro Type: Custom JavaScript
Code:
29 Oct 2014 | Conversion Conference, London | @SimoAhava

35. NB
Step 3: Use macros to parse form fields
35
{{array of checked buttons}}
Macro Type: Custom JavaScript
Code:
29 Oct 2014 | Conversion Conference, London | @SimoAhava

36. NB
Step 4: Create your own listeners
36
{{generic event handler}}
Macro Type: Custom JavaScript
Code:
29 Oct 2014 | Conversion Conference, London | @SimoAhava

37. NB
Step 4: Create your own listeners
37
Custom HTML Tag
Code:
29 Oct 2014 | Conversion Conference, London | @SimoAhava

38. NB
Summary and further reading
38

39. NB
Why track forms?
39
To create a story
29 Oct 2014 | Conversion Conference, London | @SimoAhava

40. NB
Why track forms?
40
To create a story
To complete a story
29 Oct 2014 | Conversion Conference, London | @SimoAhava

41. NB
Why track forms?
41
To create a story
To complete a story
To recognize a story
29 Oct 2014 | Conversion Conference, London | @SimoAhava

42. NB
Further reading
42
www.simoahava.com/analytics/form-tracking-google-tag-manager/
www.simoahava.com/analytics/custom-event-listeners-gtm/
www.simoahava.com/analytics/dont-gtm-listeners-work/
29 Oct 2014 | Conversion Conference, London | @SimoAhava

43. NB
Further reading
43
www.simoahava.com/analytics/form-tracking-google-tag-manager/
www.simoahava.com/analytics/custom-event-listeners-gtm/
www.simoahava.com/analytics/dont-gtm-listeners-work/
THANK YOU!
29 Oct 2014 | Conversion Conference, London | @SimoAhava