Chris Mendez in Radio, Analytics & Insights, For Developers, Tools for Software Engineers

Measuring listening behavior using Google Tag Manager

Classical KUSC has a brand new website and one of our goals was to improve how we measure radio listening online. Specifically, how do we measure listening behavior across our website, iPhone app, Android app, and TV app using a single report system such as Google Analytics. For us, the answer was through Google Tag Manager.

I love Google Analytics. I've been tracking page views and events since 2005 and it has never failed me. In the past 7 years or so, many competitors have entered the analytics space including: Flurry, Fabric Answers, Mixpanel, etc. but you can pretty much do anything using GA. What's also interesting is the evolution of Google Tag Manager. What I specifically like about GTM is that you can use that as your tool to listen for pageviews and events, but then you can route the data to Google Analytics or even Facebook analytics so you only really need one library to rule them all.

Measuring listening behavior using

I recently created this script to help track how long a user is listening. This is particularly relevant in online radio because many listeners visit our website, hit play and then forget about the stream. This form of passive listening is very common in radio but Google Analytics wasn't designed for non-interactive listening. In fact, GA was designed to track the length of time it takes to move from one page to the next. Therefore, this script helps remedy that problem.

function() {  
  var timerE = isNaN({{timer-event-number}}) ? 0 : {{timer-event-number}};
  var timerI = isNaN({{timer-interval}}) ? 0 : {{timer-interval}};

  var elapsed = timerE * timerI / 1000;
  var min = Math.floor(elapsed/60);
  var sec = elapsed % 60;
  return min + 'm ' + sec + 's';
}
//The new Way
function() {  
  //1: This will prevent "NaN" showing up in GA reports
  var timerE = isNaN({{timer-event-number}}) ? 0 : {{timer-event-number}};
  var timerI = isNaN({{timer-interval}}) ? 0 : {{timer-interval}};
  //2: Format the data in HH:MM:SS.mmm format
  function addZ(n) {
    return (n<10? '0':'') + n;
  }
  //3: Calculate the elapsed time
  var s = timerI * timerE;
  //4: Crunch
  var ms = s % 1000;
  s = (s - ms) / 1000;
  var secs = s % 60;
  s = (s - secs) / 60;
  var mins = s % 60;
  var hrs = (s - mins) / 60;

  //return addZ(hrs) + ':' + addZ(mins) + ':' + addZ(secs) + '.' + ms;
  return addZ(hrs) + ':' + addZ(mins) + ':' + addZ(secs);
}

Source from Stackoverflow