Measuring User Engagement On a Landing Page

Description

To measure user engagement on a landing page, simply use the Depth tool. Depth indicates how far people scrolled down on your landing page or how many pages they viewed through your site.


To use it just add the depth script inside your landing page code. After that you can monitor the depth in the campaign report and determine which lander engages users the most.


Depth script integration to a Zeustrak Cloud landing page

Copy the following code and paste it right after opening <body> tag of your Zeustrak Cloud lander.

<script>
  function g(n,d){var v=(RegExp(n+'='+'([^&]+?)(&|$)').exec(location.search)||[,null])[1];if(v){v=decodeURI(v)}return v||d}
  function ae(i,e,f){i.addEventListener(e,f)}
  function wndsize(){
    var w=0;var h=0;if(!window.innerWidth){
      if(!(document.documentElement.clientWidth==0)){w=document.documentElement.clientWidth;h=document.documentElement.clientHeight}
      else{w=document.body.clientWidth;h=document.body.clientHeight}}
      else{w=window.innerWidth;h=window.innerHeight}
      return{width:w,height:h}}
  var beacon=function(opts){opts=opts||{};opts.url=opts.url||null;opts.vars=opts.vars||{};opts.error=opts.error||function(){};opts.success=opts.success||function(){};
  var varsArray=[];
  for(var key in opts.vars){varsArray.push(key+'='+encodeURIComponent(opts.vars[key]))}
    var qString=varsArray.join('&');
  if(opts.url){var beacon=new Image();
    if(beacon.onerror){beacon.onerror=opts.error}
      if(beacon.onload){beacon.onload=opts.success}beacon.src=opts.url+'?'+qString}};
  var Tracker=(function(){
    var clickId=0;
    var domain='';
    var _public={init:function(d){domain=d},setClickId:function(value){clickId=value},trackDepth:function(depth){
      if(!clickId){return}beacon({url:'//'+domain+'/depth/',vars:{depth:depth,cid:clickId}})}};return _public})();
  var ScrollDepthTracker=(function(){
    var bottomBoxPage=3;
    var currentPage=1;
    var windowHeight;
    function trackScroll(){
      var top=window.pageYOffset||document.documentElement.scrollTop;
      var pageNum=Math.floor(top/windowHeight)+1;
      if(pageNum>currentPage){Tracker.trackDepth(pageNum);
        if(typeof WatchTracker!='undefined'){WatchTracker.trackEvent('scrollDepth',pageNum)};
        var bottomBox=document.getElementById('bottomBox');
        if(bottomBox&&pageNum>=bottomBoxPage){bottomBox.style.display='block'}currentPage=pageNum}}
          var _public={init:function(){
            windowHeight=wndsize().height;ae(window,'scroll',trackScroll);trackScroll()}};return _public})();
            Tracker.init('{trackingdomain}');
            Tracker.setClickId('{click.id}');
            Tracker.trackDepth(1);
            ScrollDepthTracker.init();
</script>