2015-01-31 164 views
0

最近我遇到了使用Google Analytics(分析)跟踪“单页网站”上的用户的问题。我想分享我的解决方案。请参阅下面的答案。使用Google Analytics(分析)跟踪单个网页上的用户

+0

你可能会分开处理成*问题*和*回答*。我注意到,当我开始发送按钮推送事件的跟踪事件时,Google Analytics会将一系列访问重新分类为单个页面计算器网站,从反弹到定期访问,因此,向Google提供更多信息并让您跟踪它的任何内容都可能有用不太明显的方式。 – Paul 2015-01-31 23:19:42

回答

0

最近,我在使用Google Analytics(分析)跟踪“单页网站”上的用户时遇到了问题。我想分享我的解决方案。

-----页面布局-----

1a. Header with logo and menu (links scroll page down to selected chapter) 
2a. Section with big paralax bakground 
2b. Chapter header <section><h2>Title 1</h2></section> 
2c. Chapter's content <div>content</div> 
3a. Section with big paralax bakground 
3b. Chapter header <section><h2>Title 2</h2></section> 
3c. Chapter's content <div>content</div> 
... 
Na. Section with big paralax bakground 
Nb. Chapter header <section><h2>Title N</h2></section> 
Nc. Chapter's content <div>content</div> 

----- -----要求

  1. 算法必须在页面滚动下来,检测所选章节对用户可见。
  2. 算法必须检测到用户实际上花了一些时间熟悉本章的内容。这个事实必须向Google Analytics报告。
  3. 算法无法报告该用户阅读该章节时,他只需滚动浏览该章节。

---- -----算法

  1. 等待页面加载
  2. 创建章节列表,它是相对于网站的上边框位置。
  3. 当用户看到章节时,必须在一段时间后重新检查该情况,以证明用户实际上花了一些时间阅读内容。
  4. 如果满足上述条件,则向Google Analytics(分析)报告此事实。

----示例代码-----

<script type="text/javascript"> 

var scrollstat = [] 

// Preparing array of chapters and positions 
$(document).ready(function() { 
    $("section").each(function() { 
     var ts = {}; 
     ts["offset"] = $(this).offset(); 
     str = $("h2", this).html(); 
     ts["name"] = "SECTION-"+str.replace(" ","-")+"/"; 
     ts["checked"] = false; 
     ts["timer"] = false; 
     scrollstat.push(ts); 
    }); 
}); 

//Checking that user is still on the same chapter 
function doublecheck(ii) { 
    scrollpos = $(window).scrollTop(); 
    max = scrollpos + 300; 
    min = scrollpos; 
    if (scrollstat[ii].checked == false && scrollstat[ii].offset.top > min 
    && scrollstat[ii].offset.top < max) { 
     _gaq.push(['_trackPageview', (location.pathname + location.search 
     + scrollstat[ii].name)]); 
     scrollstat[ii].checked = true; 
    } 
    console.log(scrollstat[ii].offset.top+','+min+','+max); 
    scrollstat[ii].timer = false; 
} 


//Separate function for setting timer to count 3s 
//If user don't scroll to other chapter within this time 
//event is reported to GA 

function settimer(ii) { 
    scrollstat[ii].timer = true; 
    setTimeout(function() {doublecheck(ii);},3000); 
} 

//Handling scrolling event 
$(window).scroll(function() { 
    scrollpos = $(window).scrollTop(); 
    max = scrollpos + 300; 
    min = scrollpos; 
    for (index = 0; index < scrollstat.length; ++index) { 
     if (scrollstat[index].checked == false && 
     scrollstat[index].timer == false && 
     scrollstat[index].offset.top > min && 
     scrollstat[index].offset.top < max) { 
       settimer(index); 
     } 
    } 
}); 

</script> 

MAX和MIN变量实验估算。在我看来,我认为章节标题必须滚动到屏幕的顶部。

正如上面的脚本的结果,每一个章节都报道GA与像地址单独的页面访问:“/ SECTION章标题/”