Here are some tips on how to tweak FV Player (2.1.32+) behavior.

Using custom code to build a player

We strongly recommend you avoid this and let us know what would be your preferred way of publishing videos if you don't like our shortcodes.

If you prefer to use your own interface with custom fields (post meta), you can use a PHP code like this:

if( function_exists('flowplayer_content_handle') && $meta = get_post_meta( get_the_ID(), 'my-field', true ) ) {
  $args = array();
  $args['src'] = $meta;
  if( $splash = get_post_meta( get_the_ID(), 'my-field-for-splash-screen-url', true ) ) {
    $args['splash'] = $splash;
  echo flowplayer_content_handle( $args );

Available WordPress filters

You probably already know how WordPress filters work, you can read the Filter Reference on here.

List of available filters:

  • fv_flowplayer_ad_html - allows you to customize what's in the ad which shows once the video starts playing. You can use the global $post variable to check what post is being served.
  • fv_flowplayer_autobuffer_limit - customize how many videos should be autobuffering when the plugin option is enabled. Default is 2.
  • fv_flowplayer_amazon_expires - allows you to customize the URL expiration time in seconds. First argument is the duration and second is the file URL
  • fv_flowplayer_amazon_secure_exclude - allows you to exclude URL from the process of adding the access tokens. File URL is the argument, return true to skip the file.
  • fv_flowplayer_attributes - first parameter is an array of all attributes of the player DIV element, second is the video URL. You can use the global $post variable to check what post is being served. The most important attributes are:
    • class - CSS class of the element
    • data-cuepoints - allows you to put in cue points. Use data like [10, 30, 60, 120]
    • data-embed - set to "false" to disable embedding of video
    • data-engine - set to "flash" to prefer Flash for the video
    • data-fullscreen - set to "false" to disable fullscreen option
    • data-key - license key
    • data-keyboard - set to "false" to disable keyboard shortcuts
    • data-logo - path to your player logo. Only works with a valid license key.
    • data-rtmp - set the RTMP endpoint URL
    • style - the inline style attribute of the player container. Used for video dimensions.
  • fv_flowplayer_inner_html - allows you to insert any HTML into the player container, right after the video and popup elements
  • fv_flowplayer_popup_html - allows you to customize what's in the popup which shows at the end of video. You can use the global $post variable to check what post is being served.

Let us know if you are missing any filters!


Add a play button to control bar of the players (easily done, as it's just a CSS class):

add_filter( 'fv_flowplayer_attributes', 'tweak_fv_flowplayer_attributes', 10, 2 );
function tweak_fv_flowplayer_attributes( $attrs ) {
  $attrs['class'] .= ' play-button'; return $attrs;

Using FV Player JavaScript API

How to add your code

Use standard WordPress filter called wp_footer. Following code sample (you can either put it into a new plugin or into functions.php of your template) checks the post meta field and if it's found, it outputs a JavaScript which gets triggered when you play the video:

add_action('wp_footer', 'my_fv_flowplayer_scripts',10,3);
function my_fv_flowplayer_scripts( $script ) {
  global $post;
  if( get_post_meta( $post->ID, 'tweak_player', true ) ) {
    $args = func_get_args();
    $script .= "
    jQuery('#$args[1]').bind('ready', function() {
        alert( 'Video just started!' );
  return $script;

This could be improved to (for example) trigger a custom function to stop the video after 5 seconds of playing and show some popup. You can of course use any of the FV Player API events.

You can also put a code like this into any of your JavaScript files and affect all the players. Same example like above, but this time affecting only the first player on any page:

if( typeof(flowplayer) != "undefined" ) { 
  var api = flowplayer(0);
  api.bind('ready', function() {
    alert( 'Video just started!' );

You can also put the code into the footer of your template. But double check that it works with your Minify plugin if you use one.

Important API methods

  • disable(flag) - set flag to true to disable, false to re-enable the player
  • fullscreen() - toggle fullscreen
  • load(video) - video should be an array like: [{ mpegurl: ''}, {webm: ''}, {mp4: ''}, {ogg: ''}]
  • next() and prev() - next and previous playlist item
  • pause() - pause the video
  • play(index) - play video, use index to specify position in playlist
  • resume() - resume playback after pause
  • seek(time) - seek to time
  • stop() - stops the playback and returns to the start of video
  • unload() - unload the player
  • volume() - set player volume

Usage like in above examples:


Important API events

  • beforeseek - when the seeking process starts. The 3rd argument is the target seek time.
  • cuepoint - when a cuepoint is reached. The 3rd argument is an object with cue time and index.
  • error - when an error occurs. The 3rd argument is the object with description of the error.
  • finish - when playback has finished.
  • fullscreen and fullscreen-exit - when going into/out of fullscreen.
  • load - first player event, before the video starts playing
  • mute and volume - triggers on mute or volume change
  • pause and stop - triggers on pause/stop action
  • progress - occurs every 250 ms as the video is playing
  • ready - once the video is loaded.
  • seek - seeking was completed.
  • unload - when player goes back into the splash state.

Quick JavaScript samples

Always put your scripts into wp_footer hook or include them in footer.php below wp_footer() call.

1. Player initialization via JavaScript

Make sure the element has dimensions set or set them via JavaScript. Make sure there is no existing video tag in the element, as FV Player will use that instead:

jQuery('#your-element').flowplayer( {
  playlist: [
    [ { mp4: ""} ]
} );

If you want to replace the video with some other one, you can either remove the element and insert a new one with new player, or use some other API call to replace the playing video.

2. How to use the above API methods

Just pick your element, call flowplayer() on it along with the desired method. Like this:


3. How to track users watching video until the end with Ajax

Here’s a sample code for FV Player which detects if the user really watched the video to the end (seeking to the end won’t suffice) and send the post ID using Ajax:

Determining Video Length

How to get started

First you need to enable Integrations > Scan video length. Enabling this option puts all your posts with [fvplayer...] shortcode into a queue, and then a cron scans the videos in those posts and stores the length of each video.

Saving a post also triggers the check.

  • There is a strict time limit when saving a post - 2 seconds. If the video is not properly checked within that time (bad encoding, slow connection from server), then it's put into a queue for the scheduled cron job. So you might not see the duration of all videos right away.
  • The video duration is checked only once per URL. If you change your video substantially, we expect that you also change the file name.
  • If you really need to refresh it, you can remove _fv_flowplayer_% meta tag for your post ID in wp_postmeta table. Make sure you backup your database before proceeding, unless you really know SQL. Then disable/re-enable the Integrations > Scan video length option to run the video duration indexing again.

What videos are supported?

The video has to be properly encoded, the moov meta data must be at the beginning of the file. Currently we don't support this for RTMP or HLS streams.

How to show the video durations

Video duration is put up for:

  1. Individual videos
  2. Playlists

The time duration is hidden in CSS, to not disrupt normal users. You need to use CSS to make it visible:

  1. Invididual videos - .fvfp_duration { display: block }
  2. Playlists - .fp-playlist-external .dur { display: inline-block }

You can also use the following PHP code to show duration of the first video in a post in your templates:

echo flowplayer::get_duration_post( $post_id )

You can also use this shortcode to show duration of the previous video in the post. So if you have multiple [fvplayer] shortcodes in the post, you can put this shortcode after each and it will show the duration.