Google Adwords in an iFrame

Recently, I was brought in to a project to figure out why adwords wasn’t logging conversions for a campaign landing page.  The way it was set up, was that the landing page was the target for the adwords links, but the iframed 3rd party form submission would be the conversion trigger.

The confirmation page that displays after form submission inside of the iFrame was supposed to trigger the conversion, but it wasn’t working.

My first attempted solution was to pass in the query string parameters from the parent window into the iFrame (my theory was that the query string parameters containing the adwords click arguments needed to be present on the page triggering the conversion).  This appeared to work at first, but only seemed to capture my test conversions.

My second solution (and this one worked!) was to add scripting to the confirmation “thank you” page (displayed within the iFrame) that posts a message to the parent window.  In the parent window, I set up an event handler for messages to manually trigger a conversion.  See code snippets below.

In the iFramed confirmation page that displays after submission

 
<script>
  window.parent.postMessage('submission-complete', 'http://YOUR_LANDING_PAGE_DOMAIN_GOES_HERE/');
</script> 

In the landing page that contains the iFramed form

 
<!-- Google Adwords-supplied code snippet for click-triggered conversions --> 
<script type="text/javascript">
/* <!--[CDATA[ */
goog_snippet_vars = function() {
  var w = window;
  w.google_conversion_id = YOUR_CONVERSION_ID_GOES_HERE;
  w.google_conversion_label = YOUR_CONVERSION_LABEL_GOES_HERE;
  w.google_remarketing_only = false;
}
// DO NOT CHANGE THE CODE BELOW.
goog_report_conversion = function(url) {
  goog_snippet_vars();
  window.google_conversion_format = "3";
  var opt = new Object();
  opt.onload_callback = function() {
    if (typeof(url) != 'undefined') {
      window.location = url;
    }
  }
  var conv_handler = window['google_trackConversion'];
  if (typeof(conv_handler) == 'function') {
    conv_handler(opt);
  }
}
/* ]]--> */
</script> 
<!-- My custom scripting that triggers the conversion --> 
<script>
  function receiveMessage(e) {
    if(e.data == 'submission-complete') {
      goog_report_conversion();
    }
  }
  window.addEventListener('message', receiveMessage);
</script>