Enable Google Analytics for C # One Pageview Website

Question

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

I am implementing a single page processing page for a site using the Kendo user interface. The site has 4 pages that are dynamically generated when the user clicks on the menu tabs. For example, when the user presses the tab1 button in the menu, then tab_1 will be entered into the app_container container.

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 in the domain: www.xxxxxxxx.com/register.html .

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

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

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

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

I took the code from 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, since I just like to track this registration page, I read the Google documentation, developers.google.com/analytics , will these codes work?

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

2) Question2, how to enable GA to get data for 4 different tab pages? Do I need to modify onlick actions to track the event? or just trace the anchor tag? I read something from Hash URL Tracking , will these codes work for my situation? Since it may take some time to show the analyst, he cannot test it now:

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

where should i put this line of code if it works for this one page application?

Answer 1

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

You do not need the third parameter if they are on the page where the code is executed. It will automatically capture the current page on which the code is executed if the third parameter is undefined. But this option allows you to set the page yourself, which can be useful if you need to send the page view to another page, except for the page on which the code is executed.

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 click tab event, add the appropriate code to track tab clicks:

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

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

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

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

Source