使用# view为单个页面站点启用谷歌分析

I've read the similar questions, but my question is slightly different.

我读过类似的问题，但我的问题略有不同。

I am implementing a single page registration processing page for a site using Kendo UI. The site has 4 pages which was generated dynamically when user clicks menu tabs. For example, when user clicks tab1 on the menu, then tab_1 would be injected into app_container container.

我正在使用Kendo UI为一个站点实现一个单页注册处理页面。该站点有4个页面，用户单击菜单选项卡时动态生成这些页面。例如，当用户单击菜单上的tab1时，将把tab_1注入app_container容器。

templates as below:

模板如下:

<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>

The page is under the domain: www.xxxxxxxx.com/register.html.

该页面位于以下域:www.xxxxxx.com/register.html。

when user clicks the tabs in menu, then the http link address changed to this: www.xxxxxxxx.com/register.html#/p1

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

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

www.xxxxxxxx.com/register.html / p2

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

www.xxxxxxxx.com/register.html / p3

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

www.xxxxxxxx.com/register.html / p4

I've grabbed the code from GA:

我从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) Question1, as I just only like to track this registration page, I've read google's documentation, developers.google.com/analytics,will this codes work?

1)问题1，因为我只想跟踪这个注册页面，我读了谷歌的文档，developers.google.com/analytics，这些代码能正常工作吗?

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

2) Question2, how to enable GA to get data for 4 different tab pages? Do I have to modify onlick actions to track the event? or just simple track the anchor tag? I've read something from Tracking Hash URLs, will this codes work for my situation? As it may take some time to show analystic, can't test it now:

2)问题2，如何使GA获得4个不同标签页的数据?我需要修改onlick动作来跟踪事件吗?或者只是简单地跟踪锚标签?我读过一些关于追踪哈希url的文章，这些代码对我的情况有用吗?由于可能需要一些时间来展示分析，现在不能测试它:

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

where shall I put this line of code to if it is working for this single page application?

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

1 个解决方案

#1

Answer 1: Yes this will work perfectly fine: ga('send', 'pageview', '/register.html');

回答1:是的，这样做很好:ga('send'， 'pageview'， '/register.html');

You don't need the 3rd parameter if they are on the page where the code is being executed. It will automatically grab the current page where the code is being ran from if the 3rd parameter is undefined. But than this parameter allows you to set the page yourself, which could be useful if you need to send a pageview to a different page other than the page that the code is being executed on.

如果在执行代码的页面上，则不需要第三个参数。如果第三个参数未定义，它将自动抓取当前正在运行代码的页面。但是，这个参数允许您自己设置页面，如果您需要将pageview发送到代码正在执行的页面之外的另一个页面，这将非常有用。

change to this:

改变:

<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>

And in each tabs click event, add the corresponding code to track which tabs are clicked:

在每个选项卡点击事件中，添加相应的代码来跟踪哪个选项卡被点击:

Tab 1 click event: ga('send', 'event', 'tab1', 'clicked');

表1点击事件:ga(‘send’、‘event’、‘tab1’、‘click’);

Tab 2 click event: ga('send', 'event', 'tab2', 'clicked');

表2点击事件:ga(‘send’、‘event’、‘tab2’、‘click’);

Tab 3 click event: ga('send', 'event', 'tab3', 'clicked');

表3点击事件:ga(‘send’、‘event’、‘tab3’、‘click’);

Tab 4 click event: ga('send', 'event', 'tab4', 'clicked');

表4点击事件:ga(‘send’、‘event’、‘tab4’、‘click’);

Source

源

#1