Google Analytics plug-in

Background

For some time, vzaar has offered integration with Google Analytics with events being sent directly from the player:  Google Analytics

Unfortunately, the feature only works with the vzaar Flash player which means that information is not sent from the vzaar HTML5 player, rendering the feature less than useful for many customers who wish to gather data on viewer behavior for those viewing on non Flash-enabled, mobile devices.
We've now created a mechanism which works with both the Flash and HTML5 players, meaning viewer behavior can be tracked for all viewers, including those using mobile devices. There is a little set up involved but it's straightforward and covered here.
Implementation of this tracking requires a basic understanding of HTML and Javascript scripting.
Note: if you are using this approach, you should disable the  integrated GA feature or sent events will be duplicated.

Set up in the page

First, you need to set up your Google Analytics tracking on the page which contains the embedded vzaar video, using the current Universal Analytics JavaScript tracking snippet.
You must use the default `ga` global object variable name in order for your vzaar videos to be tracked. More information about the JavaScript tracking snippet can be found on the  Google Analytics developers site.
Second, you need to include the vzaar Google Analytics enabling script. This must be embedded on the page after the GA JavaScript tracking snippet:
<script src="//player.vzaar.com/libs/googleAnalytics/vzaarGoogleAnalytics.js" type="text/javascript"></script>
	

Set up in the iframe

For each video you wish to include in your Google Analytics you will need to add the query string `?GAOn=true` to your video embed code:

That's it. Once that's done, GA events will be sent using the tracking code specified in the GA JavaScript tracking snippet.
By default, vzaar videos will send playback progress events to Google Analytics at intervals of 10% of the video duration. You can change the progress event interval percentage using the `GAProgressInterval` in your video embed code, e.g., for 5% intervals:
<iframe src="//view.vzaar.com/{video_id}/player?GAOn=true&amp;GAProgressInterval=5" ...></iframe>
	

Actions

Here is a list of some of the actions on your videos that the plug-in sends to GA:

  • playerLoaded is a count of how many times the vzaar player has finished loading.
  • frameGrabLoaded is a count of how many times the poster frame (thumbnail) has loaded.
  • playbackStarted counts how many times the video/audio has started playing. Note: this will not be counted twice if a viewer resumes playback after pausing the video.
  • pause counts how many times the video has been paused.
  • resume counts how many times a viewer has resumed playing the video after pausing.
  • percent (10-100) counts how many times this proportion of the video has elapsed.
  • seekbar counts how many times the player seek bar area has been clicked.
  • seekbarhandle counts how many times the player seek bar handle has been clicked.
  • fullscreenon counts how many times the video has entered full screen mode.
  • fullscreenoff is a count of the number of times the video has exited full screen mode.
  • soundOff counts how many times the mute button has been pressed.
  • soundOn counts how many times the sound has been unmuted.
  • buffered (s) counts the amount of time the video has buffered (in seconds).

If there are general Google Analytics terms that you need clarifying, take a look at their  glossary here.

Google Tag Manager

It is possible to load the JS via a Google Tag Manager tag, but it has to be in the same custom HTML tag as your Universal Analytics JS.
Having the two in separate tags may cause JS timing issues but bundling them together produces page-view data as normal, while also allowing the vzaar GA integration to work. Here is a simple example:

Still need help? Contact Us Contact Us