从 iFrame 小部件跟踪 Adwords 转化

Tracking Adwords Conversions from an iFrame Widget

网站

Saritias

情况

我的客户希望跟踪 Google Adwords 转化。当客户点击广告,到达网站,然后使用第 3 方预订小部件 (ResDiary) 预订 table 时,即为转化。

问题

小部件位于 iframe 中,据我了解,这意味着插入小部件的标签管理器代码无法看到父 window 中 Google 设置的 Adwords 相关 cookie .

我怎样才能让它工作?

我的解决方案

我在跟踪代码管理器中创建了 2 个帐户。

  1. 对于主站点
  2. 一个用于小部件站点

小部件站点包含一个自定义 HTML 标记,用于向父 iframe 发送事件:

<script>
var topOrigin = 'http://www.saritas.com.au';
if (window.postMessage) {
  window.parent.postMessage('confirmation', topOrigin);
}
</script>

我将触发器设置为在小部件中所需的确认页面上触发。

对于主站点,我再次使用了一个自定义 HTML 标签,其中包含一个使用 Google Async Conversion Library 的事件侦听器,并在触发侦听器时触发事件。

<script type="text/javascript" src="http://www.googleadservices.com/pagead/conversion_async.js" charset="utf-8"></script>

<script>
      /* <![CDATA[ */
    var google_conversion_id = 952604500;
    var google_conversion_language = "en";
    var google_conversion_format = "3";
    var google_conversion_color = "ffffff";
    var google_conversion_label = "eMKnCNzU5F8Q1K6exgM";
    var google_remarketing_only = false;
    /* ]]> */
  
  function trackConv(google_conversion_id, google_conversion_label) {
        window.google_trackConversion({
   google_conversion_id: google_conversion_id, 
   google_remarketing_only: false
  });
   }
  
// Replace with your domain here.
var allowedOrigins = ['https://widget-au.resdiary.com'];
function xDomainHandler(event) {
  event = event || window.event;
  var origin = event.origin;

  // Check for the whitelist.
  var found = false;
  for (var i = 0; i < allowedOrigins.length; i++) {
    if (allowedOrigins[i] == origin) {
      found = true;
      break;
    }
  }
  if (!found) return;

  // Might be a different message.
  if (event.data != 'confirmation') return;
  trackConv(google_conversion_id, google_conversion_label);
}
if (window.addEventListener) {
  window.addEventListener('message', xDomainHandler, false);
} else if (window.attachEvent) {
  window.attachEvent('onmessage', xDomainHandler);
}

</script>

我将此触发器设置为小部件出现的单个页面。