_trackPageview函数用来记录页面的PV,在页面安装的GA追踪代码中,_trackPageview用来记录当前页面的相对URL地址。并记录在汇报给GA服务器的&utmp参数中。
基本的工作的流程就像是这样:当用户浏览http://bluewhale.cc/123.html这个页面时。页面中的_trackPageview函数就会将/123.html作为_trackPageview函数的值,并将这个值通过调用__utm.gif文件的的形式汇报给GA的服务器,最终显示在我们的报告里。
_trackPageview不仅可以记录当前页面URL,还可以记录任何我们想追踪的数据,并将它显示在我们的GA报告里。
下面介绍5种_trackPageview函数的使用策略。
这是最常用的一种方法。通常页面里的GA追踪代码只会记录当前页面的相对URL地址。如果要在报告中看到更详细的页面信息,可以对页面的名称进行自定义。比如要将页面http://bluewhale.cc/123.html命名为:”5fo_trackPageview”,只需要把这个名字作为_trackPageview的函数值就可以了。
1 | pageTracker._trackPageview( "5fo_trackPageview" ); |
如果想要看到再具体一点的信息,比如当前页面在网站结构中的位置,可以在名字前面加入上一及页面或频道的名称。例如这个页面是属于首页下的GA频道的文章页:
1 | pageTracker._trackPageview( "home/GA/5fo_trackPageview" ); |
home/GA/5fo_trackPageview比/123.html附带了更多的信息,也更容易理解。并且方便以后对数据的分类和过滤操作。
注意:这里填入_trackPageview的值是要加引号的。而在另一种使用方法中是不能加引号的,这个在后面会提到。
默认情况下_trackPageview只汇报当前页面的URL,并且页面里必须含有本站的GA追踪代码,对于指向外部站点的链接无法进行追踪和记录。(如:友情链接,各种形式的广告等等)。
我们通过自定义_trackPageview函数的值,并配合JS事件可以对这部分的点击进行有效记录。
例如我首页上的twitter follow me链接:
1 | <a target= "_blank" href= "http://www.twitter.com/askcliff" ><img src= "http://www.bluewhale.cc/image/twitter.jpg" alt= "twitter" /></a> |
通过加入JS的onClick事件并定义_trackPageview的值就可以追踪到用户的点击。
1 | <a target= "_blank" href= "http://www.twitter.com/askcliff" onClick= "javascript:pageTracker._trackPageview('/home/twitter');" ><img src= "http://www.bluewhale.cc/image/twitter.jpg" alt= "twitter" /></a> |
这个数据将通过utmp参数汇报给GA服务器,并最终显示在我的报告里。
http://www.google-analytics.com/__utm.gif?……utmp=/home/twitter……
_trackPageview函数不仅可以自定义页面名称和追踪出站链接,还可以从时间维度记录页面的表现。比如用户在特定页面的停留时间,页面加载时间等等。在进行时间维度记录前需要编写一段JS来配合_trackPageview一起工作。
这里以追踪用户在页面的停留时间为例。
JS代码:
1
2
3
4
5
6
7
8
9
10
11
|
<script type=
"text/javascript"
>
pageopen =
new
Date
();
function
bluewhale ()
{
pageClose =
new
Date
();
minutes = (pageClose.getMinutes() - pageOpen.getMinutes());
seconds = (pageClose.getSeconds() - pageOpen.getSeconds());
bluewhaletime = (seconds + (minutes *
60
)+
"seconds"
);
pageTracker._trackPageview(bluewhaletime);
}
</script>
|
注意:这里填入_trackPageview的值是一个变量名,不能加引号,否则时间将不会被显示在报告里。
然后在<body>里加入unonload事件。
1 | <body unonload= " bluewhale ()" > |
当用户离开页面时_trackPageview就会向GA服务器发送一条页面停留时间的数据。
PS: 如果将unonload事件替换为onload事件,_trackPageview就会记录页面的加载时间。
http://www.google-analytics.com/__utm.gif? ……utmp=1%20seconds……….
在GA的报告中看到的数据就像这样:
_trackPageview还可以用来监测关键页面在用户浏览器中的状态。比如页面里的焦点图是否被正确显示。
使用JS的onload和onerror两个事件就可以完成监测。
代码如下:
1 | <img src= "http://www.bluewhale.cc/image/twitter.jpg " onload= "javascript:pageTracker._trackPageview('imgloaded');" > |
1 | <img src= "http://www.bluewhale.cc/image/twitter.jpg " onerror= "javascript:pageTracker._trackPageview('imgerror');" > |
最后是通过_trackPageview与JS事件对用户行为的记录。比如用户的鼠标行为。当用户将鼠标移到某个焦点图或按钮上时进行记录。
1 | <img src= "" http: //www.bluewhale.cc/image/twitter.jpg"onmouseover="javascript:pageTracker._trackPageview('jsevent/mouseover');" > |
在GA的报告中看到的数据就像这样:
用户把鼠标放在图片或按钮上大部分可能是无意识的行为,并不能表明用户对这个页面或这个按钮的活动感兴趣。所以单纯记录这个行为没有太大意义,不过可以做一下改进来使这个数据有参考作用。