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