Contact Form 7 Event Listener

Measure your Contact Form 7 successful submissions as conversion in your analytics tools (Google Analytics, Piwik Pro, Mixpanel, Segment, Yandex Metrica, etc.) and advertising platform (Google Ads, Facebook Pixel, Bing UET, etc.)

How to track Contact Form 7 submissions with google tag manager

Tracking when a user converts by submitting your Contact Form 7 forms is easy using Google Tag Manager and the CF7 event listener.

To track CF7 forms, create a custom HTML tag type, paste the contact form 7 event listener code in this tag and make it fire on pageview.

Next is to create a custom event trigger with the event name [cf7submission], which gets fired on successful CF7 form submissions.

Add your marketing tags and conversion pixels to the trigger. If you want to capture the form ID and form input, you should create the following dataLayer variables;

[formId] –> returns the fom ID

[response] –> returns the form inputs that are the records entered by the user

The creator of this code is Julius Fedorovicius

<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
window.dataLayer.push({
"event" : "cf7submission",
"formId" : event.detail.contactFormId,
"response" : event.detail.inputs
})
}); 
</script>