Upcoming LunaMetrics Events
San Francisco, Apr 28-30 Los Angeles, May 12-16 New York City, May 19-23 Chicago, Jun 16-18

Tracking Flash Videos in Google Analytics

Interested in easily tracking YouTube Videos? We have some updated code. Check out our post here about Easily Tracking YouTube Videos in Google Analytics

In my last post, I talked about why we’d want to track interactions with video in Google Analytics. Here’s the first example of how to actually do that.

Flash video players have been the ubiquitous way of embedding video in web pages for a long time. HTML5’s media elements are beginning to erode the use of Flash for video, but it’s still very common, and it’s really the only way to ensure compatibility with older browsers.

Flash video in a nutshell

The way Flash video works is this: there’s the video file itself (maybe an MPEG or something like that), and there’s a Flash wrapper around the video that handles the playback controls, seeking and streaming, volume control, full-screen view, etc. Ultimately, it’s a .swf file, a Flash file that you can embed in a web page. The browser’s Flash plugin interprets the file and displays it to you.

Tracking Flash in Google Analytics

Flash files are basically self-contained. They have all the content and code inside them to do whatever it is they do (in this case, play a video). So what happens if we want to track this video with Google Analytics?

Adobe actually provides a semi-official code library for doing this; it’s hosted on the Google Code site for Google Analytics. It basically works by bridging between ActionScript (which is the scripting language inside the Flash file) and JavaScript (which is the scripting language on the HTML page on which the Flash file is embedded and how our Google Analytics code is executed).

It basically works like this:

  • Something happens in ActionScript -> Tell the Google Analytics JavaScript to send some information (_trackEvent or _trackPageview)

For example:

  • The Play button is clicked -> Google Analytics _trackEvent("Video","Play")

So actually getting this to work involves working in the Flash source file and putting in some ActionScript.

What’s that you say? You don’t know ActionScript? You don’t have a dedicated Flash developer? You maybe don’t even have access to the Flash source file? Yeah, I hear you; me neither. So let’s look at an easier alternative that takes care of some of this stuff for you.

FlowPlayer

FlowPlayer is an open-source Flash video player. Basically, it’s the “wrapper” I described above that handles playback controls for a video, and you simply supply your video. (The free version is FlowPlayer-branded, but for a reasonable price you can also use your own branding on the player.)

So, two things already going for it: it’s free, and it’s attractive and configurable. But best of all for our purposes, the contributors to FlowPlayer have already created a plugin that does Google Analytics event tracking for us, automatically. (FlowPlayer is just one example that I’ve used before, but there may be other good, free, GA-supporting Flash video players out there. Leave suggestions in the comments if you’ve used one.)

You can find the details of the setup for the Google Analytics plugin on the FlowPlayer site. You want the “Bridge mode”, assuming you’re embedding videos in your own site with GA tracking code already on the pages. (There’s also “AS3 mode”, which is completely self-contained; you could track your videos embedded on other people’s websites.)

FlowPlayer tracks your video events like this:

  • Category: URL of page in which the video is embedded
  • Action: various things that happen such as Play, Pause, Finish, Mute, Full Screen, etc.
  • Label: filename of the video
  • Value: timestamp of the video at which the event occurred (in seconds)

You have some control over the Actions: which events are tracked (do you really want to know if people Mute?) and how they are labeled. You can change these with a simple configuration method right in the code.

Category, Label, and Value can’t be changed in the same way, so you get what you get. However, remember that this is open source, so if you want to alter one of those values (perhaps, especially, the Category value) to better fit in which other Events you might be tracking on your site, you can do that. It’s way easier to start with someone else’s code and make a small change than it is to build it all from scratch yourself.

Example

This is one example of the source code you might use. Consult the FlowPlayer documentation for more detailed information.

<!-- Include the FlowPlayer JavaScript --> <script src="flowplayer-3.2.4.min.js"></script> <!-- Create the container for the video --> <a href="http://e1h13.simplecdn.net/flowplayer/flowplayer.flv" style="display:block;width:425px;height:300px;" id="player"> </a> <!-- Configure the player and tell it to load the GA plugin in bridge mode --> <script type="text/javascript"> flowplayer("player", "flowplayer-3.2.5.swf", { plugins:{ gatracker: { url: "flowplayer.analytics-3.2.1.swf", trackingMode: "Bridge", } } }); </script> 

Here’s an example page including this code.

Stay Tuned

So far, we’ve covered Flash video players. I’m also going to talk specifically about the case of YouTube video embedded in your site. And I’ll come back to Flash video as a fallback for browsers that don’t support the HTML5 <video> element when we get to that as well.

Jonathan Weber

About Jonathan Weber

Jonathan Weber is the Data Evangelist at LunaMetrics. He spreads the principles of analytics through our training seminars all over the East coast. The next seminar he'll be leading will be a Google Analytics training in Boston. Before he caught the analytics bug, he worked in information architecture. He holds a Master’s degree from the University of Pittsburgh School of Information Sciences. Jonathan’s breadth of knowledge – from statistics to analysis to library science – is somewhat overwhelming.

http://www.lunametrics.com/blog/2010/11/16/tracking-flash-videos-google-analytics/

3 Responses to “Tracking Flash Videos in Google Analytics”

Ryan says:

Is it possible to get additional flash Video and audio metrics without using an adobe media server?. For example Frame Rate.

Its like you read my mind! You seem to know so much about
this, like you wrote the book in it or something. I think that you could do with
a few pics to drive the message home a bit, but
other than that, this is fantastic blog. An excellent read.
I will definitely be back.

Mercedes says:

Do you have a spam problm on this website; I also am a blogger, and I was curious about
your situation; many of us have developed some nice methods and we are looking to trade methods with other folks, why not
shoot me an email if interested.