简体   繁体   中英

Redirect page with Google analytics

I have a page that redirects the user to three different pages with this script:

<html>
<body>
</body>
<script src="jquery.js"></script>
<script>
$(document).ready(function (){
        var redirected = false;
       if(navigator.userAgent.toLowerCase().indexOf("android") > -1){
           redirected = true;
           console.log("hello andorid");

           window.location.href = 'http://android.web.site.com';
        }
        if(navigator.userAgent.toLowerCase().indexOf("iphone") > -1){
            redirected = true;
            console.log("hello iphone");
            window.location.href = "http://iphone.web.site.com";
        }
        if(navigator.userAgent.toLowerCase().indexOf("ipad") > -1){
            redirected = true;
            console.log("hello ipad");
            window.location.href = "http://ipad.web.site.com";
        }
        if(navigator.userAgent.toLowerCase().indexOf("ipod") > -1){
            redirected = true;
            console.log("hello iphone");
            window.location.href = "http://ipod.web.site";
        }
        else if(redirected==false){
            console.log("hello windows");
            window.location.href = "app.html";

        }
    });
</script>
</html>

So it checks if the user is on a mobile phone. Now the customer wants to track how many users clicks on that page, and how many users that lands on the "app.html" page.

I was thinking on setting the Google analytics script inside the <body> tags. Is that correct? Do I need to set a timeout on the redirect script so GA can have time to launch properly?

I'm quite fresh with analytics, and I've seen this page: https://support.google.com/analytics/answer/1009614?hl=en but I don't know if that is suitable for me.

Grateful for any help.

That's a nice setup. You can use "if $(document).ready(function ()" for every if to make sure the query is sent to GA before redirecting. This should make it unnecessary to add an annoying delay. Hope it helps!

$(document).ready let's the user wait until the HTML structure has rendered before he is redirected. This is not necessary.

Do the redirect in the header before anything else. Measure the users after they have arrived at their destination pages, not before you do the redirect (if you insist on doing it before the redirects then do a virtual pageview within your respective if-clauses and pass the destination page as page designation).

As per documentation GA belongs in the head section immediately before the body-tag, although GA will measure things (with varying degrees of accuracy) not matter how in the page you put it.

Added: Here is a complete example:

<html>
<head>

<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-XXXXXXXX-X', 'auto');


</script>

</head>
<body>

<script>

 // no need for $document.ready or jQuery

       if(navigator.userAgent.toLowerCase().indexOf("android") > -1){
           redirected = true;
           console.log("hello andorid");
           ga('send', 'pageview', {
            'page': '/my-android-page',
            'hitCallback': function() {
            window.location.href = 'http://android.web.site.com';
           }
           });           
        }
        if(navigator.userAgent.toLowerCase().indexOf("iphone") > -1){

            console.log("hello iphone");
            ga('send', 'pageview', {
            'page': '/my-iphone-page',
            'hitCallback': function() {
            window.location.href = "http://iphone.web.site.com";
           }
           });                       
        }
        if(navigator.userAgent.toLowerCase().indexOf("ipad") > -1){

            console.log("hello ipad");
            ga('send', 'pageview', {
            'page': '/my-ipad-page',
            'hitCallback': function() {
            window.location.href = "http://ipad.web.site.com";
           }
           });                      

        }
        if(navigator.userAgent.toLowerCase().indexOf("ipod") > -1){

            console.log("hello iphone");
            ga('send', 'pageview', {
            'page': '/my-ipod-page',
            'hitCallback': function() {
            window.location.href = "http://ipod.web.site";
           }            
        }
        else if(redirected==false){
            console.log("hello windows");
            ga('send', 'pageview', {
            'page': '/app.html',
            'hitCallback': function() {
            window.location.href = "app.html";
           }
        }
    });
</script>


</body>
</html>

You do not need jQuery since you do not need to wait for the DOM to render. You do not need the "redirected" var because everytime you set it to true you redirect to another page (so the "true" case is never evaluated anywhere). The virtual pageviews for the various conditions take a page path that you can choose yourself (you can also overwrite other fields like location (the full url including hostname) - look up the field reference for Universal Analytics). After the virtual pageview is recorded the visitor is redirected in the hit callback.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM