Tracking Google Adwords Conversions in Contact Form 7 for WordPress

tracking conversions in contact form 7

17 Apr Tracking Google Adwords Conversions in Contact Form 7 for WordPress

Tracking Google Adwords Conversions in Contact Form 7 for WordPress
3.67 (73.33%) 3 votes

The default Contact Form 7 plugin uses an AJAX form submission. This means that users don’t get redirected to another page on a successful form submission. Instead they are just shown a thank you message within the same page. AJAX form submission makes it hard to add conversion tracking code for Google Adwords since there is not physical page.

You can track Google Adwords conversions using one of the following methods.

Method 1: Create a Thank You page and redirect users to the Thank You page

Step 1: Create a new page called Thank You and add your Google Adwords conversion tracking code on that page. Then URL of the page should be ‘/thank-you’

Step 2: Edit the Contact Form “Additional Settings” section and add the code below in it.

on_sent_ok: "location = 'http://example.com/';"

Method 2: Tracking without redirects

A sample Google Adwords tracking code looks like below:

<!-- Google Code for Enquiry Conversion Page -->
<script type="text/javascript">
/* <![CDATA[ */
var google_conversion_id = XXXXXXXXX;
var google_conversion_language = "en";
var google_conversion_format = "2";
var google_conversion_color = "ffffff";
var google_conversion_label = "XXXXXXXXXXXX";
var google_conversion_value = 0;
/* ]]> */
</script>
<script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion.js">
</script>
<noscript>
<div style="display:inline;">
<img height="1" width="1" style="border-style:none;" alt="" src="http://www.googleadservices.com/pagead/conversion/XXXXXXXXXX/?value=0&amp;label=XXXXXXXXXXXXXXXXX&amp;guid=ON&amp;script=0"/>
</div>
</noscript>

Step 1: Copy the code above minus the part shown below and paste it on the contact form page.

<script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion.js">
</script>

Step 2: Edit the Contact Form “Additional Settings” section and add the code below in it.

on_sent_ok: "jQuery(String.fromCharCode(60)+'img/'+String.fromCharCode(62)).attr('height','1').attr('width','1').css('border-style','none').attr('src','http://www.googleadservices.com/pagead/conversion/'+google_conversion_id+'/?value='+google_conversion_value+String.fromCharCode(38)+'label='+google_conversion_label+String.fromCharCode(38)+'guid=ON'+String.fromCharCode(38)+'script=0').appendTo('body');"

That’s all folks! You should be tracking the conversions now.