使用#view为单页网站启用Google Analytics

Question

我读过类似的问题,但我的问题略有不同.

我正在使用Kendo UI为网站实现单页注册处理页面.该网站有4个页面,这是用户单击菜单选项卡时动态生成的.例如,当用户单击菜单上的tab1时,则会tab_1将其注入app_container容器中.

模板如下:

<div id="app_container"></div>
<script id="tab_1" type="text/x-kendo-template">
//first page
</script>
<script id="tab_2" type="text/x-kendo-template">
//second page
</script>
<script id="tab_3" type="text/x-kendo-template">
//third page
</script>
<script id="tab_4" type="text/x-kendo-template">
//fourth page
</script>

该页面位于域名下:www.xxxxxxxx.com/register.html.

当用户单击菜单中的选项卡时,http链接地址更改为: www.xxxxxxxx.com/register.html#/p1

www.xxxxxxxx.com/register.html#/p2

www.xxxxxxxx.com/register.html#/p3

www.xxxxxxxx.com/register.html#/p4

我抓住了GA的代码:

<script>

  (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-XXXXXXX-1', 'xxxxxxxx.com');
  ga('send', 'pageview');

</script>

1)问题1,因为我只想跟踪这个注册页面,我已经阅读了google的文档,developers.google.com/analytics,这个代码会起作用吗？

ga('send', 'pageview', '/register.html');

2)问题2,如何启用GA获取4个不同标签页的数据？我是否必须修改单击操作才能跟踪事件？或者只是简单地跟踪锚标签？我从Tracking Hash URL中读到了一些内容,这个代码是否适用于我的情况？由于显示分析可能需要一些时间,因此现在无法测试:

_gaq.push(['_trackPageview', "/" + window.location.hash]);

如果它适用于这个单页应用程序,我应该把这行代码放在哪里？

Answer 1

答案1:是的,这将完全正常: ga('send', 'pageview', '/register.html');

如果它们位于正在执行代码的页面上,则不需要第3个参数.如果未定义第3个参数,它将自动获取正在运行代码的当前页面.但是,此参数允许您自己设置页面,如果您需要将页面视图发送到除正在执行代码的页面之外的其他页面,这可能很有用.

改为:

<script>
(function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
  (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
  m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
  })(window,document,'script','//www.google-analytics.com/analytics.js','ga');

  ga('create', 'UA-XXXXXXX-1', 'xxxxxxxx.com');
  ga('set', 'page', '/register.html');
  ga('send', 'pageview');
</script>

在每个标签点击事件中,添加相应的代码以跟踪点击的标签:

标签1点击事件: ga('send', 'event', 'tab1', 'clicked');

标签2点击事件: ga('send', 'event', 'tab2', 'clicked');

标签3点击事件: ga('send', 'event', 'tab3', 'clicked');

标签4点击事件: ga('send', 'event', 'tab4', 'clicked');

资源