Google Analytics高级应用系列教程[setVar运用]
_setVar的运用
Google Analytics 进阶运用系列文章作者:Sluke,主要讲解Google Analytics 统计的相关应用,本文是系列文章第六篇。
_setVar函数跟_trackPageview函数一样,灵活运用可以极大丰富统计报告。简单来说,_setVar函数可以定义一个值,当被触发的时候,该值被记录。
1、统计有注册意愿的用户
注册,不出意外都需要访问一个注册页面,那么统计访问这个页面的用户也就知道了有多少用户动过注册的念头,当然可能看了一眼,没有完成注册。我们可以在注册页面这样部署代码:
-
<body onLoad="javascript:pageTracker._setVar('想注册');">
2、统计注册成功的用户
注册的最后一步无非就是按下“确定”按钮,那么就在完成注册的“确定”按钮上加上onClick事件,比如
-
onClick="pageTracker._setVar('完成注册');
3、统计登陆用户
对于有会员系统的网站来说,可能需要知道有每天有多少用户登陆网站,用于考查网站提供的会员增值服务是否有吸引力,关系到网站是否可以通过对会员的精准营销来赢利。我们可以在给登录链接加上:
-
<a href="link.html" onClick="pageTracker._setVar('登陆用户');">点击此处</a>
同样的,也可以在登陆页的确定按钮上加。
以上三个是比较容易想到的应用,值得一提的是,_setVar函数被触发后,定义的值是会被写入cookie的。
4、观察用户兴趣
对于一个大的电子商务网站来说,对用户的购买兴趣一定是有兴趣的,_setVar函数可以通过网站上访问的页面或在表单上做出的响应对其进行分类,前面三个就是演示。
假设网站有个多个商品分类,我们分别给每个分类加上
-
<body onLoad="javascript:pageTracker._setVar('IT书籍');">
所有访问该页面的访问者都将被分配到“IT书籍”组,也就是对IT书籍有兴趣的用户。
google给出了一个通过下拉菜单触发的例子:
-
<form onSubmit="pageTracker._setVar(this.mymenu.options[this.mymenu.selectedIndex].value);">
- <select name=mymenu>
- <option value="Technical/Engineering">技术人员/工程师</option>
- <option value="Marketing/PR">Marketing/PR</option>
- <option value="Manufacturing">Manufacturing</option>
- <option value="General Management">General Management</option>
这样,我们就大致上知道了不同职业的用户停留时间、跳出率、平均访问页数等等数据。
Google Analytics高级应用系列教程[自定义搜索引擎]
搜索引擎跟踪
Google Analytics提供了强大的API来跟踪搜索引擎,下面用鲜果网的自定义代码来说明,打开鲜果网的首页,能看到这样一段代码:
-
var t = _gat._getTracker("UA-9142976-1");
- t._addOrganic("baidu","word");
- t._addOrganic("soso","w");
- t._addOrganic("3721","name");
- t._addOrganic("yodao","q");
- t._addOrganic("vnet","kw");
- t._addOrganic("sogou","query");
- t._addIgnoredOrganic("鲜果");
- t._addIgnoredOrganic("鲜果网");
- t._addIgnoredOrganic("xianguo");
- t._trackPageview();
- return t;
- } catch(err) {}
虽然google analytics默认已经能识别很多搜索引擎,但是在必要的时候我们依然需要自定义代码来识别一些小型的搜索引擎。这里鲜果使用了_addOrganic(),它的格式是这样的:
-
_addOrganic(newOrganicEngine, newOrganicKeyword)
- newOrganicEngine是一个string,标识搜索引擎的名字
- newOrganicKeyword也是一个string,标识传递搜索关键词的那个参数
比如t._addOrganic(“yodao”,“q”),这是用来定义有道搜索的,先看看有道搜索“hello”的时候,是怎样传递参数的:
http://www.youdao.com/search?q=hello&btnIndex=&ue=utf8&keyfrom=web.index
t._addOrganic("yodao","q")
- yodao是指有道搜索
- q是指传递“hello”给搜索引擎的那个参数
同样的,其他自定义项就好理解了,不过看起来鲜果这个代码不是最新的,有写搜索引擎的newOrganicKeyword不对。鲜果在代码中还用到 了_addIgnoredOrganic(),这是用来忽略关键词的。用户可能在搜索框中直接输入网址或者网站名(也可能是误操作),比如输入了 “www.xianguo.com”,这些关键词是不需要被监控的。
t._addIgnoredOrganic("鲜果网")
就是忽略了“鲜果网”这个关键词,当然,通过“鲜果网”这个关键词过来的PV还是会被计算。
同样有用的还有_addIgnoredRef(),这个方法用于忽略Referrer,比如一个网站使用了双域名,那么在统计报告中,不同域名件的 跳转会被计为Referrer,这时候可以使用_addIgnoredRef()来忽略其中一个域名,保证在“Referring Sites”也就是来源网站中不再计算双域名的情况,_addIgnoredRef()不会影响计算PV。格式如下:
-
pageTracker._addIgnoredRef(www.sister-site.com);
Google Analytics高级应用系列教程[调试代码]
调试代码
众所周知,Google Analytics不是实时的,数据需要等待一段时间才能看到,所以在统计代码修改之后,不能很快知道是否能达到想要的效果。
Google Analytics的原理是请求一个1x1的gif小图,带上各种参数,就是下面这样:
http://www.google-analytics.com/__utm.gif?utmwv=4&utmn=769876874&utmhn=example.com&utmcs=ISO-8859-1&utmsr=1280x1024&utmsc=32-bit&utmul=en-us&utmje=1&utmfl=9.0%20%20r115&utmcn=1&utmdt=GATC012%20setting%20variables&utmhid=2059107202&utmr=0&utmp=/auto/GATC012.html?utm_source=www.gatc012.org&utm_campaign=campaign+gatc012&utm_term=keywords+gatc012&utm_content=content+gatc012&utm_medium=medium+gatc012&utmac=UA-30138-1&utmcc=__utma%3D97315849.1774621898.1207701397.1207701397.1207701397.1%3B...
根据不同的浏览器,需要使用不同的调试工具,很多IT从业者都使用firefox+firebug的组合,确实不错,不过在调试Google Analytics时,我推荐使用Live HTTP Headers这个插件,在实际的测试中,firebug有可能会来不及获取HTTP Header信息。
http://livehttpheaders.mozdev.org/installation.html
在IE下,则使用fiddler2,这个软件是微软人员开发的,相当强大。
opera也有一个HTTP Headers饰件。
在开启获取HTTP Header的工具后,可以刷新页面,然后清除掉索取的所有消息,再单独测试某一处的代码,尤其是自定义代码之后。如果代码部署没有问题,就能抓到上面那种信息了
Google Analytics高级应用系列教程[用户行为跟踪]
用户行为跟踪
Google Analytics的默认代码已经提供了很多预置的变量,可以获取到用户的浏览器、系统、分辨率等等数据,通过自定义代码,还能获取到很多其他的数据。下 面介绍的进阶方法比较有意思,可以用于统计tab结构或者ajax,这里用到的是_setVar()方法。
加入我有一个常见于音乐网站首页的tab结构,tab标题是国语专辑、英文专辑、日韩专辑,默认显示的国语专辑,通过鼠标点击tab切换,可以显示其他分类的专辑,结构大致如下:
-
<ul id="albumTab">
- <li><a href="#">国语专辑</a></li>
- <li><a href="#">英文专辑</a></li>
- <li><a href="#">日韩专辑</a></li>
- <li><a href="#">其他专辑</a></li>
- </ul>
这里页面是不会刷新的,所以默认代码就无法知道用户是否浏览了其他分类的专辑,作为一个网站管理者,一定想知道有多少用户点击了tab切换,只需要做如下修改:
-
<ul id="albumTab">
- <li><a href="#" onClick="pageTracker._setVar('Chinese album');">国语专辑</a></li>
- <li><a href="#" onClick="pageTracker._setVar('English album');">英文专辑</a></li>
- <li><a href="#" onClick="pageTracker._setVar('jk album);">日韩专辑</a></li>
- <li><a href="#" onClick="pageTracker._setVar('other album);">其他专辑</a></li>
- </ul>
同样的方式,我们也是用于统计用户点击了什么链接,通常给游客和注册用户显示的菜单是不同的,通过给不同用户组的链接加上统计,就能知道有多少不同类型的用户访问网站,也能知道那些链接是用户最爱点的。
Google Analytics高级应用系列教程[事件跟踪]
事件跟踪
这里是事件跟踪是指Event Tracking,意思比鼠标事件跟踪广泛,先看看都能统计到什么:
- Flash内容,比如flash站点和flash动画,甚至flash游戏都可以。
- 嵌入式AJAX
- 网页小饰件
- 文件下载
- 数据或文件的载入时间
这里用到的是_trackEvent()方法,用法如下:
-
_trackEvent(category, action, optional_label, optional_value)
- category (必填)这个是标注想统计项目的分类
- action (必填)这个是分类下的具体行为
- label (可选)可以理解为对action的一个描述,可选
- value (可选)这个是一个整数型的字段,通常用于统计下载次数或者载入时间
如果部署了时间跟踪,在google analytics的报告里还有一个字段叫做Implicit Count(隐式计数),这个是统计交互行为的,比如点了10次某个按钮,点一次算一次,类似PV,这个值需要根据不同的部署去理解。
用音乐站来说明_trackEvent()的用法:
-
pageTracker._trackEvent("music", "Play", "日光倾城");
- pageTracker._trackEvent("music", "Pause", "日光倾城");
- pageTracker._trackEvent("music", "Stop", "日光倾城");
music是category,play是action,日光倾城是label(这里是歌名),放在链接上是这样的:
-
<a href="#" onClick="pageTracker._trackEvent("music", "Play", "日光倾城");">播放</a>
- <a href="#" onClick="pageTracker._trackEvent("music", "Pause", "日光倾城");">暂停</a>
- <a href="#" onClick="pageTracker._trackEvent("music", "Stop", "日光倾城");">停止</a>
如果加载在播放器的按钮上,就能统计到用户试听《日光倾城》这首歌时的行为。
如果是统计MP3文件被下载的信息,就是这样写:
-
<a href="#" onClick="pageTracker._trackEvent('Downloads', 'MP3', '日光倾城', downloadTime);">下载</a>
这里加入了value,每次在MP3文件被下载完之后,时间会以秒为单位计入value,在报告里用downloadTime表示,加上 Implicit Count,就能计算出平均每次下载时间,同理,可以用于记录flash动画的播放。需要注意的是第四个参数是整数型。
扩展运用
这里介绍两个js库:
TimeTracker() :http://code.google.com/apis/analytics/samples/time-tracker.js
MouseOverTracker() :http://code.google.com/apis/analytics/samples/mouseover-tracker.js
它们需要额外加载到被统计页面。
TimeTracker()主要有两个特性:1、记录持续时间;2、生成柱状图
如果不自定义代码,使用TimeTracker()会创建一个叫做“TimeTracker”的分类,记录开始和结束时间,计算时间差并发送给 google analytics形成报告,用柱状图显示平均时间等数据。用处非常广泛,比如监听页面平均加载时间、视频加载时间、flash界面加载时间或是嵌入式 js脚本加载时间等等。
函数如下:
-
TimeTracker(opt_buckets_array) //返回一个新的时间跟踪器
- _recordStartTime(opt_time) //记录开始时间
- _recordEndTime(opt_time) //记录结束时间
- _setHistogramBuckets(buckets_array)
- //定义柱状图刻度,默认是[100, 200, 300, 400, 500, 1000, 1500, 2000, 2500, 5000]
- _getTimeDiff() //计算时间差
- _track(tracker, opt_event_object_name, opt_event_label)
- //使用_track()需要保证之前已经记录了开始时间和结束时间
- tracker是指google analytics在被统计页面已经实例化的一个跟踪项,比如pageTracker
- opt_event_object_name是定义TimeTracker()统计数据出现在报告中的名字,默认是“TimeTracker”
- opt_event_label是描述这个TimeTracker()的,为了在报告中更容易找到
google给出的运用示例:
-
<html>
- <head>
- <title>Latency Tracking Demo</title>
- </head>
- <body>
- <script type="text/javascript" src="http://www.google-analytics.com/ga.js"></script>
- <script type="text/javascript" src="http://www.example.com/scripts/time-tracker.js"></script>
- <script type="text/javascript">
- var timeTracker = new TimeTracker();
- var pageTracker = _gat._getTracker("UA-1735986-1");
- </script>
- <input type="button" value="Start Timer" onclick="javascript:timeTracker._recordStartTime();"/>
- <input type="button" value="Stop Timer" onclick="javascript:timeTracker._recordEndTime();"/>
- <input type="button" value="Track!" onclick="javascript:timeTracker._track(pageTracker, undefined, 'Manual Test');"/>
- </body>
- </html>
定义柱状图的示例:
-
// somewhere at the top of the page
- var timeTracker = new TimeTracker();
- timeTracker._recordStartTime();
- // page load and setup
- // now when the page is done loading...
- timeTracker._recordEndTime();
- // Specify your own histogram "action" values
- timeTracker._setHistogramBuckets([10, 20, 50, 100, 500, 1000]);
- // assuming pageTracker is called from _gat._getTracker(account)
- timeTracker._track(pageTracker);
MouseOverTracker()
用户在一个PV里可能会多次触发onMouseOver()事件,这样统计到的数据水分很多,使用这个库就可以只统计第一次onMouseOver()事件而忽略掉后续的。
函数如下:
-
MouseOverTracker(tracker)
- //返回一个新的跟踪器,tracker是可选参数,需要是已经在页面中实例化的跟踪项,比如pageTracker
- _trackMouseOver()
- //这个方法第一次被调用的时候,一个onMouseOver()事件被记录,后续操作不记录
示例:
-
// We want to track mouse overs on a video unit that has the element id "myVideoUnit".
- // assuming pageTracker is called from _gat._getTracker(account)
- var mouseOverTracker = new MouseOverTracker(pageTracker);
- document.getElementById("myVideoUnit").onMouseOver = mouseOverTracker._trackMouseOver;
Google Analytics高级应用系列教程[跨域跟踪]
跨域跟踪
从今天开始一个介绍Google Analytics进阶运用的系列日志,其实没有多少技术含量,主要内容来自http://code.google.com/apis/analytics/docs/index.html,不过其中部分的用词与说法与官方不太一样。
首先,要清楚以下几点:
- Google Analytics用document.domain定义一个网站的cookies
- 独立的域名意味着独立的访问者和流量数据,也就是说,在只使用Google Analytics默认代码的情况下,即使是访问不同的二级域名,都会被单独计算
- 独立的域名并不一定是不同的内容
- 子目录使用主域名的cookies
ps:本系列的ID都是google文档中的,想使用的话请更换成自己的。
只统计一个子目录
假如我有一个网站www.example.com,还有一个网店www.example.com/myStore/,我只想统计网店的访问数据,需要用到_setCookiePath()方法,统计代码这么写:
-
var pageTracker = _gat._getTracker("UA-12345-1");
- pageTracker._setCookiePath("/myStore/");
- pageTracker._trackPageview();
这是因为cookie路径设置为您的子目录,而不是根目录www.example.com
统计同域名下连个子目录
假如我有一个网店,还有一个购物车
www.example-commerce-host.com/myStore/
www.example-commerce-host.com/myCart/
想统计他们的访问数据,需要用的_cookieCopyPath()方法,统计代码这么写:
-
var pageTracker = _gat._getTracker("UA-12345-1");
- pageTracker._setCookiePath("/myStore/");
- pageTracker._cookiePathCopy("/myCart/");
- pageTracker._trackPageview();
这样就是设置了一个特殊的cookie,由第一个目录提供,也就是myStore目录,这些cookie数据会被复制到myCart目录cookie中
统计A域名及B域名的一个子目录
这是我认为比较有用的应用方式。
假如我有一个网店,使用的是第三方的购物车,这时候需要设定主次,一般自己的是主,第三方的东西是次。统计代码这么写:
主:www.example-petstore.com
-
var pageTracker = _gat._getTracker("UA-12345-1");
- pageTracker._setAllowLinker(true);
- pageTracker._setAllowHash(false);
次:www.example-commerce-host.com/petStoreCart
-
var pageTracker = _gat._getTracker("UA-12345-1");
- pageTracker._setDomainName("none");
- pageTracker._setAllowLinker(true);
- pageTracker._setAllowHash(false);
_setAllowLinker()方法是为了让目标网站读取到post过来的数据和cookie,但是这样还不够,还需要用到_linkByPost()方法,将网店的cookie通过HTTP POST传到购物车,因此,在网店的表单里需要这样修改:
-
onSubmit="pageTracker._linkByPost('www.example-commerce-host.com/petStoreCart/begin.php');"
当然网店的相关链接也要改为这样的:
-
<a href="pageTracker._linkByPost('www.example-commerce-host.com/petStoreCart/legalTerms.php');">购物车</a>
还有js形式的写法,用到_link方法
-
<a href="www.example- commerce-host.com/petStoreCart /legalTerms.php" onclick="pageTracker._link(this.href); return false;"& gt;购物车</a>
统计主域名及其二级域名
类似这样的:
www.example-petstore.com
dogs.example-petstore.com
cats.example-petstore.com
统计代码这么写:
-
var pageTracker = _gat._getTracker("UA-12345-1");
- pageTracker._setDomainName(".example-petstore.com");
- pageTracker._trackPageview();
用_setDomainName方法设定主域名
统计多域名及二级域名
这是一种混杂的情况,基本上是前两种情况相加,统计代码要这么写:
主:www.example-petstore.com
-
var pageTracker = _gat._getTracker("UA-12345-1");
- pageTracker._setDomainName(".example-petstore.com");
- pageTracker._setAllowLinker(true);
- pageTracker._setAllowHash(false);
如果有表单指向了其他域名,需要用_link()方法和_linkByPost()方法将cookie传到其他域名去,用法上面已经写过了。如果表单指向的是二级域名,就不一定要使用_link()方法和_linkByPost()方法了,因为已经设定了主域名。
次:dogs.example-petstore.com
-
var pageTracker = _gat._getTracker("UA-12345-1");
- pageTracker._setDomainName(".example-petstore.com");
- pageTracker._setAllowLinker(true);
- pageTracker._setAllowHash(false);
同样的,如果有表单指向了其他域名,需要用_link()方法和_linkByPost()方法将cookie传到其他域名去
其他域名:www.my-example-blogsite.com
-
var pageTracker = _gat._getTracker("UA-12345-1");
- pageTracker._setDomainName("none");
- pageTracker._setAllowLinker(true);
- pageTracker._setAllowHash(false);
统计框架(iFrame)
假如想把框架中的www.my-example-iframecontent.com数据传到父一级www.example-parent.com的窗口中去,需要用到_getLinkerURL()方法,用js读取框架,统计代码要这么写:
-
var iframe = document.getElementById("myIFrame");
- iframe.src = pageTracker._getLinkerUrl(http://www.my-example-iframecontent.com/);