Track Multiple Forms with Google Analytics Events

@yan5280

You can track Contact Form 7 form engagement using Google Tag Manager.

http://dcarlbom.com/google-tag-manager/contact-form-7-on-wordpress-with-gtm/

http://www.simoahava.com/analytics/track-form-engagement-with-google-tag-manager/

Here’s the update on this:
You can easily track successful Contact Form 7 submits in Google Analytics using Google Tag Manager. This uses wpcf7mailsent, required 2017

Contact Form 7 sends a custom JavaScript event (wpcf7mailsent) on successful form submission, and the form is identified in the Click URL variable, which, for forms, contains the form action property.

Create two tags and one trigger:

Tag 1 name: Contact Form 7 – Success Listener
Tag type: Custom HTML
HTML:

<script type=”javascript”>
var wpcf7Elm = document.querySelector(‘.wpcf7’);
wpcf7Elm.addEventListener( ‘wpcf7mailsent’, function(event) {
dataLayer.push({‘event’ : ‘CF7formSubmitted’});
}, false );
</script>

Triggering: All Pages (Page View)

Tag 2 name: Contact Form 7 – Success Submitted
Tag type: Universal Analytics
Track type: Event
Event Category: Form Submitted
Event Action: {{Click URL}}
Event Label: optional
Event Value: optional
Triggering: CF7 Form Submitted – cf7mailsent

Trigger name: CF7 Form Submitted – cf7mailsent
Trigger type: Custom Event
Event name: CF7formSubmitted
Trigger fires on: EVENT matches CF7formSubmitted

Note case sensitivity.

People with more free time can create more advanced reporting by adding the following:

1. Variable (macro) with type JavaScript to extract Form code from {{Click URL}},
   especially valuable if you have the same form appearing on multiple pages
2. Variable (macro) with type Lookup Table to translate form code into form name.