Tracking multiple forms from Contact Form 7 in GA as separate events

Question

I would like to know if the value pushed into the datalayer is arbitrary when tracking form completion events.

Currently I add this in the Additional Settings in CF7 settings, as per the guide here - http://dcarlbom.com/google-tag-manager/contact-form-7-on-wordpress-with-gtm/#gref

on_sent_ok: "dataLayer.push({'event': 'gtm4wp.contactForm7Submitted'});"

Is the value gtm4wp.contactForm7Submitted something I can change in order to track 2 forms as separate events or is there a better way? I have a site that has 2 types of form, one is a standard free format message contact form and the other is used to arrange a callback. I'd like to segment the conversion data of each.

Answer 1

In your case, you'll have 2 or 3 options depending on your coding &GA skills With WordPress and cf7: create many form as you need and change the on_send_ok values according to your needs. You can use the action wpcf7_before_send_mail to check the posted values and change dynamically the on_send_ok. Last options with ga, create Goals.

Answer 2

Usually the event value is arbitrary and you can make it anything you want. What's important is that you trigger your GTM tag to fire exactly on that event. In this case, I'm not sure if CF7 specifically requires the event value to be exactly what you have there, but from a GTM point of view, as long as your Trigger event matches what is pushed as the event value, then your tags should fire.

Answer 3

What you could do, is change the label parameter in the event information. I see that you are using a WP plugin (DuracellTomi's GTM, I guess) for using GTM on WP.

I do hope you have setup GTM correctly, in which case it would be easy to just change the label parameter.

Answer 4

Duracell Tomi's plugin is awesome, but you can also hook into this by registering an event listener yourself, via Tag Manager or in your code.

The snippet you're most likely looking for is below. Note how we pull the event.detail.contactFormId from the event. This means we can take the WordPress form ID and have a specific event for each form.

In Google Tag Manager, this would then require you to register a trigger for 'form_submitted_101' which would then in turn trigger your tags; Universal Analytics, perhaps Facebook, etc.

<script>
  document.addEventListener( 'wpcf7mailsent', function( event ) {
    dataLayer.push({'event': 'form_submitted_'+event.detail.contactFormId});
  }, false );
</script>