社交互动 - 网络跟踪 (ga.js)

本文档介绍了如何使用 Google Analytics(分析)获取非 Google 广告网络(如 Facebook 和 Twitter)上的互动指标。如果您是网站所有者、内容管理插件开发者或社交网络运营商,并且希望为您的分享按钮的用户提供自动社交互动报告,那么请使用本文档来为您的社交分享按钮设置 Google Analytics(分析)。

简介

默认情况下,Google Analytics(分析)会提供集成的 +1 按钮报告。也就是说,如果您在同一网页上实现了 ga.js 和 +1 按钮,系统将自动报告所有 +1 社交互动。有关 +1 分析的详细信息(包括问题排查提示),请参阅帮助中心里的关于社交分析

要获取 Facebook 或 Twitter 等其他网络的社交互动分析和报告,您需要将 Google Analytics(分析)与每个网络按钮集成。使用社交插件分析功能时,所记录的互动范围从 Facebook“赞”到 Twitter“微博”,不一而足。虽然事件跟踪也可以跟踪一般内容互动,但社交分析可为记录社交互动提供一致的框架。进而为 Google Analytics(分析)报告用户提供一套统一的报告,用于比较多个广告网络中的社交网络互动情况。

要查看如何将 Google Analytics(分析)与 Facebook 和 Twitter 按钮集成的实际示例,请查看社交分析示例代码

设置社交分析

要设置社交互动跟踪,您需要使用 _trackSocial 方法,该方法会将社交互动数据发送到 Google Analytics(分析)。在用户完成社交互动后,应调用此方法。每个社交网络都使用不同的机制来确定社交互动的发生时间,而这通常需要与社交网络按钮的 API 集成。

由于集成社交分析的具体细节因社交网络而异,因此本指南的其余部分提供了有关如何为每个社交网络设置社交插件分析的一般最佳做法。我们建议您查看每个网络的开发者文档,以确定特定于网络的实现。

下面是 _trackSocial 方法的说明:

_gaq.push(['_trackSocial', network, socialAction, opt_target, opt_pagePath]);

其中参数表示:

  • network

    必需。表示要跟踪的社交网络的字符串(例如 Facebook、Twitter、LinkedIn)。

  • socialAction

    必需。表示要跟踪的社交操作的字符串(例如“赞”、“分享”、“发 Twitter 微博”)。

  • opt_target

    可选。一个字符串,表示接收操作的网址(或资源)。例如,如果用户点击网站上某个网页上的 Like 按钮,则 opt_target 可能会设置为网页的标题,或用于在内容管理系统中标识该网页的 ID。在许多情况下,您赞过的网页就是您当前所在的网页。因此,如果此参数为 undefined 或省略,跟踪代码默认使用 document.location.href

  • opt_pagePath

    可选。按操作发生时的路径(包括参数)表示网页的字符串。例如,如果您在 https://developers.google.com/analytics/devguides/ 上点击按钮,则应将 opt_pagePath 设置为 /analytics/devguides。网页的路径几乎始终是社交操作的来源。因此,如果此参数为 undefined 或省略,跟踪代码默认使用 location.pathnamelocation.search。通常,只有在要使用 Google Analytics(分析)的 _trackPageview 方法修改可选的网页路径参数来跟踪虚拟网页浏览时,您才需要进行此设置。

Facebook 操作

根据 Facebook JavaScript SDK,在网页上设置 Like 按钮的最简单方法是使用以下代码:

<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:like></fb:like>

点赞数

要使用 Google Analytics(分析)记录“赞过的视频”,请订阅 Facebook 的 edge.create 事件并创建回调函数来执行 Google Analytics(分析)跟踪代码。

FB.Event.subscribe('edge.create', function(targetUrl) {
  _gaq.push(['_trackSocial', 'facebook', 'like', targetUrl]);
});

当用户您的网页时,回调函数就会执行并接收被赞资源的网址。然后,系统会将该资源以值的形式传递给 _trackSocial 方法,以便 Google Analytics(分析)能够报告用户赞过的网络、操作和网址。

取消顶的次数

您还可以通过 Facebook API 订阅其他有趣的事件,例如“踩”

FB.Event.subscribe('edge.remove', function(targetUrl) {
  _gaq.push(['_trackSocial', 'facebook', 'unlike', targetUrl]);
});

分享次数

您还可以订阅分享

FB.Event.subscribe('message.send', function(targetUrl) {
  _gaq.push(['_trackSocial', 'facebook', 'send', targetUrl]);
});

Twitter 微博

根据 Tweet 按钮文档 Web Intent JavaScript 事件,要在网页上实现 Twitter 按钮并检测用户互动,应使用以下代码:

<a href="http://developers.google.com/analytics" class="twitter-share-button" data-lang="en">Tweet</a>
<script type="text/javascript" charset="utf-8">
  window.twttr = (function (d,s,id) {
    var t, js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return; js=d.createElement(s); js.id=id;
    js.src="//platform.twitter.com/widgets.js"; fjs.parentNode.insertBefore(js, fjs);
    return window.twttr || (t = { _e: [], ready: function(f){ t._e.push(f) } });
  }(document, "script", "twitter-wjs"));
</script>

如需使用 Google Analytics(分析)跟踪 Twitter 按钮事件,您需要使用 Twitter 的网络 intent JavaScript 事件,并将回调函数绑定到 Intent Event。请务必将事件绑定封装在回调函数中,以确保在绑定事件之前已加载所有内容。

function trackTwitter(intent_event) {
  if (intent_event) {
    var opt_pagePath;
    if (intent_event.target && intent_event.target.nodeName == 'IFRAME') {
          opt_target = extractParamFromUri(intent_event.target.src, 'url');
    }
    _gaq.push(['_trackSocial', 'twitter', 'tweet', opt_pagePath]);
  }
}

//Wrap event bindings - Wait for async js to load
twttr.ready(function (twttr) {
  //event bindings
  twttr.events.bind('tweet', trackTwitter);
});

当用户发推文时,回调函数会收到一个对象,该对象通常可用于获取被发推文的资源的网址。 Twitter JavaScript 代码加载后,会将添加了此类注解的推文链接转换为 iframe,并且正在对 Twitter 微博网址进行编码,并以查询参数的形式附加到该 iframe 的网址。传递给回调的事件对象具有对此 iframe 的引用,我们可以使用该引用来获取正在 Twitter 微博中发布的资源的网址。

上面的回调函数会确保 iframe 引用确实是 iframe,然后尝试通过查看 url 查询参数来提取 Twitter 微博中的资源。

以下是从 URI 中提取查询参数的示例函数:

function extractParamFromUri(uri, paramName) {
  if (!uri) {
    return;
  }
  var regex = new RegExp('[\\?&#]' + paramName + '=([^&#]*)');
  var params = regex.exec(uri);
  if (params != null) {
    return unescape(params[1]);
  }
  return;
}

如果该参数位于查询字符串中,则系统会返回该参数。如果没有找到任何参数,该函数会返回 undefined(传递给 _trackSocial 方法),从而引发该方法的默认行为。

集成最佳实践

许多网站使用内容管理插件来添加社交按钮。 如果您是此类插件的作者,我们强烈建议您集成社交插件分析,以便自动记录这些互动。同样,如果您是社交网络的开发者,还可以通过与社交分析集成,让用户更轻松地在 Google Analytics(分析)中跟踪您的社交网络互动情况。

为帮助您实现此目的,本部分介绍了集成社交插件分析功能,以便您的产品或 CMS 自动跟踪社交互动的最佳做法。如果您想查看所有这些最佳做法的实际示例,请查看社交插件 Google Analytics(分析)示例代码

实例化和使用 _gaq 队列

最新版本的 Google Analytics(分析)跟踪代码支持同步和异步加载。为了让开发者能够调用尚未加载的方法,Google Analytics(分析)提供了一个命令队列 _gaq,可将跟踪方法推送到这些队列 _gaq.push();

跟踪代码加载后,队列中的所有命令就会执行。在将 Google Analytics(分析)JavaScript 跟踪代码与您的插件或产品集成时,您应始终确保该命令队列已实例化,且您的集成会将 _trackSocial 命令推送到此数组。

var _gaq = _gaq || [];

这样可以合理保证,无论接收网页使用传统跟踪代码段还是异步跟踪代码段,系统都会调用此方法。

用户配置

如果您要开发集成了社交插件分析的插件,则应考虑提供以下选项,以便用户在使用您的插件时进行设置:

设置可选的网页路径参数 - _trackSocial 方法的最后一个参数是替换发生社交互动的当前网址。最终目标是在网页跟踪和社交插件分析之间报告相同的网址。由于某些用户可能会使用网页浏览跟踪功能来替换正在跟踪的默认网页网址,因此他们还需要通过一种方式替换社交插件分析中的网址,以便获得一致的报告。

以下示例说明了如何让用户设置这些选项,以及您的代码需要如何响应这些选项。

// Create a function for a user to call to pass in the options.
function trackFacebook(opt_pagePath) {
  try {
    if (FB && FB.Event && FB.Event.subscribe) {
      FB.Event.subscribe('edge.create', function(targetUrl) {
        _gaq.push(['_trackSocial', 'facebook', 'like',
            opt_target, opt_pagePath]);
      });
    }
  } catch(e) {}
}

在上面的示例中,如果调用 trackFacebook 函数时设置了 opt_pagePath 参数,则默认网页路径值将被替换为该参数中的供应路径。否则,该参数的值将设置为 undefined。而 Google Analytics(分析)跟踪代码 会对未定义的参数使用默认值

注意:此示例中还添加了几项检查,以确保在 Facebook API 尚未加载时不会发生脚本错误。作为负责任的开发者,您应确保正确处理错误。

多个跟踪器

有些 Google Analytics(分析)用户可为其跟踪对象命名,以便区分同一网页上的多个跟踪器。虽然我们不鼓励在同一网页上使用多个跟踪器,但您可以考虑处理多个跟踪器。

以下示例说明了如何遍历并为每个跟踪器对象调用 _trackSocial 方法。它会使用 _getTrackers 方法,该方法会返回页面上所有跟踪器对象的数组。

在本例中,当 Facebook 事件触发时,每个跟踪器对象的 _trackSocial 方法都会被推送到 Google Analytics(分析)命令队列 _gaq

getSocialActionTrackers = function(network, socialAction, opt_target, opt_pagePath) {
  return function() {
    var trackers = _gat._getTrackers();
    for (var i = 0, tracker; tracker = trackers[i]; i++) {
      tracker._trackSocial(network, socialAction, opt_target, opt_pagePath);
    }
  };
}

function trackFacebook(opt_pagePath) {
  try {
    if (FB && FB.Event && FB.Event.subscribe) {
      FB.Event.subscribe('edge.create', function(targetUrl) {
        _gaq.push(_ga.getSocialActionTrackers_('facebook', 'like',
            opt_target, opt_pagePath));
      });
    }
  } catch(e) {}
}