Integrate with Google Analytics


This guide explains how to enable and use built-in Google Analytics features with the JWP. GA integration is supported in all versions of JWP 8.

🔑

If you are interested in sending data to another analytics system, read Analytics System Integrations in our developer documentation.



Introduction

JWP's own analytics are a great way to see how customers are consuming video. However, for more targeted video playback information, JWP supports direct integration with Google Analytics and other analytics platforms. All playback events will populate inside of the Event Category called JWP Video. A list of default Event Actions are included here:

  • Video Plays
  • Video Completes
  • Buffer events
  • Idle events
  • Pause events
  • Resume events
  • Seek events

These categories can be found in your Google Analytics dashboard under Behavior > Events or Real-Time > Events.



Event Properties

If a Category link is clicked, we can view actual Event Actions which were captured by the player. Accessing the JWP Video category will provide the following playback information:

  • Event Action: This is the event captured by the player. For example, Play, Buffer, Complete, etc.
  • Event Label: By default, the URL of the video file which was played.

As of JW 8.0.10, the player now marks events sent to Google Analytics nonInteractive:true if they are not manual view interactions. This enhancement increases bounce rate accuracy.



Supported version of Google Analytics

As of JW 8.0.10, the player supports the most recent Google Analytics embed type, gtag.js. Older types of embeds are still supported. More information about upgrading from analytics.js to gtag.js is available on the Google site.



Setting up your GA

JWP will leverage the implemented GA script from the page that it is embedded on. Therefore, an active account with Google Analytics is required to utilize this feature. After configuring your gtag.js script and player on a web page, we will track events based on your unique Google Analytics account number. This number resembles UA-XXXXXX-X.

A properly implemented gtag.js script would look like the following within your page head:

<script async src="https://www.googletagmanager.com/gtag/js?id=GA_TRACKING_ID"></script>
<script>
  window.dataLayer = window.dataLayer || [];
  function gtag(){dataLayer.push(arguments);}
  gtag('js', new Date());

  gtag('config', 'GA_TRACKING_ID');
  gtag('event', 'page_view');
</script>

Player events can captured either by enabling Google Analytics within the Dashboard or in the Player Setup code. The following sections cover integration at each level.



Dashboard

In the JWP dashboard, you can enable Google Analytics with just a click, on any of your existing or new players. To visit the configuration option, go to Players on the left sidebar of the dashboard and then click on the name of the player you would like to enable the integration.

You'll need to make sure you've placed the GA tracking code on your website before your JWP activity will appear. See Setting Up Your GA section above.



Player Setup Code

If you have the Google Analytics JavaScript on your page, the integration with JWP is straightforward. Simply include the ga: {} block in your player's options to enable it. Here is an example:

var playerInstance = jwplayer("myElement");
playerInstance.setup({
    file: "/uploads/example.mp4",
    image: "/uploads/example.jpg",
    ga: {} 
});

With this setup block added, JWP will use the Google Analytics tracking code and tracking ID to fire a tracking pixel for most playback events.


Configuration Options

The following configuration option is available to tune Google Analytics integrations:


label

Provides label customization. By default, we display the name of the video file being played. We can alter this to be another playlist property, like its title or MediaID.

Here is an example embed code that sets the configuration option:

var playerInstance = jwplayer("myElement");
playerInstance.setup({
    file: "/uploads/example.mp4",
    image: "/uploads/example.jpg",
    ga: {
        label: "mediaid"
    }
});

With this setup example, JWP does the following:

  • Track the title of videos instead of their URL in the JWP Video Plays/Completes categories
  • Fire events using the global variable called pageTracker
  • Use the MediaID property for JWP Video category