onSubmit; however, this isn't possible if you want to use AdWords Conversion Tracking because the tracking code is only triggered by a full page view.
This issue has recently caused me problems as I wanted to track leads generated via a Drupal contact form, but the contact form module doesn't let you specify any confirmation page to send the user to after they hit the submit button. I found some modules for redirecting the user after sending a message, but they hadn't been upgraded to work with Drupal 7.
onSubmit event. I decided to go with the last option, as it is likely to be useful in other situations.
Registering a Conversion in Response to a Click
Defining the Conversion Goal
The two important variables that need to be sent to AdWords are the id and label:
- ID – Identifies your AdWords account.
- Label – Identifies the conversion type within your account: lead, sale etc. In addition to this, you're also likely to want to set the value and URL:
- Value – The optional value you've attached to the conversion goal to measure ROI.
- URL – The page that triggered the conversion event, which can be viewed from the Webpages tab within AdWords.
Sending a Conversion Tracking Pixel
Once the values that defined the conversion goal were identified, I needed to work out how to send them to AdWords. The obvious way to do this is by using the
The important parts of this to understand are the construction of the tracking URL and the callback function that's attached to the image.
How the Tracking URL Is Built
The following code snippet constructs an AdWords tracking pixel request using the
Goal object defined earlier:
You can see that the base URL is a location on Google's servers with your unique account ID appended to the end. I've added a parameter with a random number to ensure the image isn't cached in the users browser, then placed the goal value and label into the
label parameters. Next, I've left the
script parameters in place as I found them in the
noscript element, and finally I've used an additional parameter to send the URL that triggered the conversion.
The Callback Function
Using the Custom Tracking Code
- Send off the tracking pixel,
- Stop the default behavior of your click or submit event to ensure the pixel gets sent first,
- Trigger the default behavior so the user can continue what they were doing.
Registering a Conversion for a Form Submission
Here's an example function that you could use when a form is submitted:
This takes a reference to a form and a
Goal object and does the following:
- constructs a callback function, called
submitFormCallback(), to submit the form when the tracking pixel has loaded,
- calls the
trackAdWordsConversion()function to fire off the pixel then run
submitFormCallback()when the image has loaded,
submitFormCallback()to a timeout so the user won't be kept too long just for the sake of tracking,
falseto cancel the normal submit action.
As an extra safety measure, the whole thing is wrapped in a
try/catch block that will return
true to ensure the form is still submitted if an error occurs in the code.
The only thing left to do is attach this function to the
onSubmit event of a form:
If you trigger one of the events with the Firefox “Live HTTP Headers” plugin active, then something like the following should be recorded:
This shows that the pixel was sent and received by AdWords, then a response was returned with a redirect to register any potential view-through conversions:
More importantly, once this code was installed on my site I started to get conversions being registered against my keywords in AdWords when people sent me messages:
The conversions were correctly categorised based on the Goal label:
And the additional URL parameter has been recorded: