Track Flowplayer events with google analytics

By default the plugin tracks whenever a video playback is started and the total time it has been viewed. This total time includes all view time accumulated even when the user is seeking in the video timeline back and forth.

The above demo shows Analytics in debug mode so you can see the events that are tracked as they occur. Remove the debug flag from the configuration and nothing will appear and the events will be sent to Google Analytics. They may take up to a day to show up, be patient.

If you are interested in a more detailed tracking it's possible to track more events including Pause, Resume, Seek, Mute, Unmute, Full Screen, and Full Screen Exit. An external JavaScript function allows you to customize the labels for these events as well as track only a subset of these events. Another external JavaScript function allows you to track custom events using the current clip's status time.

The plugin tracks events based on the "category" value you specify in configuration. This value corresponds to the event category you can see in the Google Analytics event tracking page.

Features

• Allows you to configure which events will be tracked
• Configurable event label names for language localization
• External function called trackEvent() to track custom events in addition to the ones Analytics normally tracks
• External function called setEventName() to change event label names at runtime, as well as turn on or off specific event tracking

Usage

To create a Google Analytics account and view event tracking for your website, visit the Google Analytics website. Visit their support site for more information on how to set up and use your Google Analytics account.

The actual event tracking info uses the following format: [the_event_category_configured_inclip], "Play", [clip_url], "time_in_seconds". For example:

"Promo video", "Start", "http://flowplayer.org/demo/video.flv", "12"

Player setup

The following snippets show how the above demo is configured:

<a
    href="http://pseudo01.hddn.com/vod/demo.flowplayervod/flowplayer-700.flv"
    style="display:block;width:426px;height:300px;"
    id="player">
 
    <!-- splash image inside the container -->
    <img src="/media/img/home/flow_eye.jpg" alt="Search engine friendly content" />
 
</a>

$f("player", "http://releases.flowplayer.org/swf/flowplayer-3.2.16.swf", {
    clip: {
        // this will be tracked under our Promo Video category
        eventCategory: 'Promo Video'
    },
    plugins:{
        gatracker: {
            url: "flowplayer.analytics-3.2.9-dev.swf",
 
            // track all possible events. By default only Start and Stop
            // are tracked with their corresponding playhead time.
            events: {
                all: true
            },
            debug: true,
            accountId: "UA-5877901-1" // your Google Analytics id here
        }
    }
});

The accountId is the Google Analytics account identifier that you can get from Google Analytics after you set up your website for tracking. The debug parameter determines whether or not the event tracking information is sent to Google or simply displayed in an overlay over your media.

By default the plugin tracks when the playback starts and stops. A "stop" gets tracked in following situations:

• the clip is played completely to the end
• user presses the stop button
• the player is unloaded (happens when the page is closed for example)

The total view time is reported to Google Analytics together with the stop events. This total time includes all the time the user has spent viewing the video. Total time gets accumulated if the user seeks backwards and repeatedly views parts of the video.

NOTE: Unloading can be tracked only when the player is embedded using the flowplayer.js script!

You can configure additional events to be tracked. For example, if you don't want to receive tracking information for mute and unmute actions and you want to rename the 'Resume' event to 'Unpause', your events object would look like this:

events: {
    // first enable all events
    all: true,
 
    // custom label for resume
    resume: "Unpause",
 
    // don't track these
    mute: false,
    unmute: false
}

If you want to differentiate the finish event from the stop event you need to give them distinct labels. The finish event is fired when the playback reaches the end of the video. By default the finish and stop events are both tracked under label 'Stop'. The following code makes these two events to be tracked separately under the labels 'Finish' and 'Stop':

events: {
    // track the finish event under label 'Finish',
    // by default it goes under label 'Stop'
    finish: 'Finish'
}

Configuration

Here is a list of all Analytics specific clip properties. These go under the gatracker object in the player configuration:

Here is a list of configuration options for the events object. See more information on player events and clip events.

The event category is defined in clips. For example here is a playlist with 2 clips using their own categories. The category value corresponds to the "Event Category" that you can see in your Google Analytics event tracking page.

playlist: {
    {
        url: 'product1.mp4',
        eventCategory: "Product videos"
    },
    {
        url: 'company.mp4',
        eventCategory: "Company videos"
    }
}

If the eventCategory is not specified the plugin uses the embedding page's URL as the category value. However, you should always specify the eventCategory explicitly when you embed Flowplayer e.g. via the OBJECT tag or in virally shared configurations.

Scripting

The Analytics plugin has the following custom methods that can be used at runtime:

setEventName(
        event:String,
        newName:Object)

$f().getPlugin("gatracker")
    .setLabel("pause", "Pausa");

$f().getPlugin("gatracker")
    .trackEvent(
        "My Custom Event Name");

Download

Get latest version of the Flowplayer Analytics plugin.

Please right-click and choose "Save link as..." (or similar)

This is a Flash plugin, and its features are therefore not available on iOS. For iOS please consult the ipad plugin.

See the version history for this tool.

Found a bug?

If you encounter problems in this script, please send a bug report to the bug reporting forum. If you have a problematic page, including a direct URL to that page is by far the most effective way of helping us to find a bug.