/ Plugin Category

/ Content Management

/ Media Library & Asset Management

/ FV Flowplayer Video Player

FV Flowplayer Video Player

By FolioVision

Content Management / Media Library & Asset Management

FV Flowplayer Video Player Review - In-Depth Analysis

FV Flowplayer Video Player is a reliable and feature-rich video player for WordPress. It supports responsive design, HTML5, playlists, and integration with Vimeo and YouTube.

Performance Overview

WPS Score

6.86/10

User Rating

4.4/5 (based on 90+ reviews)

Active Installations

20,000+

Update Frequency

Below Average It is calculated using the weighted average of same category plugins.

Security Score

1 / 10 (Very Low Risk) It is calculated using the weighted average of all versions.

What It Does

FV Flowplayer Video Player allows you to embed custom HTML5 videos on your site with a Flash fallback for older browsers. It offers a complete solution for adding FLV or MP4 videos to your posts or pages, with excellent mobile support.

This player remembers video positions for both guest users and members, includes built-in video stats, and provides an API for custom video fields. It features easy AB loop playback, improved playlists, and automated video encoding checks for admins.

FV Player is fully responsive and allows for custom start and end screens. You can enjoy unlimited instances on a single page without additional costs for advanced features, which are included in the standard license.

Other Notable Features

Here are a few other notable features of this free FV Flowplayer Video Player plugin.

Flowplayer

HTML5 Video

Video Player

Screenshots

FAQ

This should be related to your video format or mime type issues.

Each browser supports different video format, MP4 is the recommended format. In general, it’s recommended to use constant frame rate. Detailed instructions about video encoding for HTML 5.

HTML5 is pickier about what video it can play than Flash.

Please note that MP4 is just a container, it might contain various streams for audio and video. You should check what audio and video stream are you using. Read next question to find out how.

1) This can happen if your site is at www.domain.com, but the CSS is loaded from your CDN at cdn.domain.com. Based on CSS3 and HTML5 specs not all the resources can be shared between domains.

So you need to set the following on your CDN for web fonts (woff, eot, ttf, svg):

Access-Control-Allow-Origin: *

Or you can allow your domain only (but in that case it might be good to also allow it with https):

Access-Control-Allow-Origin: http://www.domain.com

Or you can exclude wp-content/plugins/fv-wordpress-flowplayer/css/flowplayer.css from CDN.

2) Second cause might be that your webfonts are served with bad mimetype

AddType application/x-font-woff woff AddType application/x-font-ttf ttf AddType application/vnd.ms-fontobject eot AddType image/svg+xml svg

Most of the issues is caused by bad mime type on the server which serves your video files. Our plugin contains an automated checked for this – just click the “Check Videos” button on the plugin Settings screen.

Here’s how to fix the mime type:

If your videos are hosted on a standard server:

You need to put the following into your .htaccess:

AddType video/mp4             .mp4 AddType video/webm            .webm AddType video/ogg             .ogv AddType application/x-mpegurl .m3u8 AddType video/x-m4v           .m4v AddType video/mp2t            .ts

If you use Microsoft IIS, add following into web.config (one should be in your root website folder) into configuration/system.webServer/staticContent section:

<remove fileExtension=".mp4" />   <mimeMap fileExtension=".mp4" mimeType="video/mp4" /> <remove fileExtension=".webm" />   <mimeMap fileExtension=".webm" mimeType="video/webm" /> <remove fileExtension=".ogg" />   <mimeMap fileExtension=".ogg" mimeType="video/ogg" /> <remove fileExtension=".m4v" />   <mimeMap fileExtension=".m4v" mimeType="video/x-m4v" /> <remove fileExtension=".ts" />   <mimeMap fileExtension=".ts" mimeType="video/mp2t" />

This can be also done in the Apache configuration. If you are on Microsoft IIS, you need to use the IIS manager.

If you host videos on Amazon AWS:

They might be served with bad mime type too – “application/octet-stream”. This largely depends on the tool which you use to upload your videos. Using your Amazon AWS Management Console, you can go though your videos and find file content type under the “Metadata” tab in an object’s “Properties” pane and fix it to “video/mp4” (without the quotes, of course different video formats need different mime type, this one is for MP4). There are also tools for this, like S3 Browser Freeware, good place for start is here: https://forums.aws.amazon.com/thread.jspa?messageID=224446

Good example can be seen in our support forum: https://foliovision.com/support/fv-wordpress-flowplayer/how-to/how-to-set-correct-mime-type-on-videos-hosted-by-amazon

Also for Internet Explorer, it’s not recommended to use MPEG-4 Visual or MPEG-4 Part 2 video stream codecs.

First click the “Check template” button on the pluging settings screen. It will likely report an issue like:

It appears there are multiple Flowplayer scripts on your site, your videos might not be playing, please check. There might be some other plugin adding the script. Flowplayer script http://site.com/wp-content/themes/OptimizePress/js/flowplayer-3.2.4.min.js is old version and won't play. You need to get rid of this script.

The problem with this template is that it includes that old Flowplayer library without using the proper WordPress function to add a new script (wp_enqueue_script). You need to go through the template and make sure the script is not loading. Typically it will be in any of the header.php files – including header-myheader.php, header-singleheader.php or similar files.

There is also a workaround – on each page what is using one of the OptimizePress custom templates, check Launch Page & Sales Letter Options –> Video Options –> “Activate Video” and enter “<!– FV Flowplayer –>” into Launch Page & Sales Letter Options –> Video Options –> “External Player Code” field. That way the template thinks the video is external and will not try to put in the Flowplayer library and the video will play.

You need to copy the CSS from the Flowplayer CSS (default theme) and put it into your theme CSS. Also add some element ID in front of it to make sure it overrides the default Flowplayer CSS:

#content .is-paused.flowplayer .fp-ui{background-image:url({PATH TO YOUR IMAGE}.png)} #content .is-rtl.is-splash.flowplayer .fp-ui, #content .is-rtl.is-paused.flowplayer .fp-ui{background-image:url({PATH TO YOUR IMAGE-rtl}.png)} @media (-webkit-min-device-pixel-ratio: 2){   #content .is-splash.flowplayer .fp-ui, #content .is-paused.flowplayer .fp-ui{background-image:url({PATH TO YOUR IMAGE@2x}.png)}   #content .is-rtl.is-splash.flowplayer .fp-ui, #content .is-rtl.is-paused.flowplayer .fp-ui{background-image:url({PATH TO YOUR IMAGE-rtl@2x}.png)} }

The image needs to be 100x106px normal version nad 200x212px hi res version. You only have to include the RTL version if your site runs in such language.

You can put this into your template’s functions.php file, if you know a bit of PHP. It will disable the tooltip.

add_filter( 'fv_flowplayer_attributes', 'tweak_fv_flowplayer_attributes', 10, 2 ); function tweak_fv_flowplayer_attributes( $attrs ) {     $attrs['data-tooltip'] = 'false';     return $attrs; }

Just put this code into the template’s functions.php file. If you know a bit of PHP, it should not be a problem for you:

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

It simply adds a class “play-button” to the player DIV element and then it knows to use the play button. The other options are:

no-mute no-time no-volume

There is an possible issue with some themes: YouTube video opens in fullscreen, but after minimizing and opening fullscreen again, the video is shrinked in the left part of the screen (as in this example). You need to copy this CSS into your theme style sheet:

iframe.fvyoutube-engine {     width: 100% !important; }

You can optionally edit your theme’s JS to prevent the shrinking.

FV Player Pro comes with a money back guarantee so you can even try the commercial no-branding version risk free. Or make it work first with the free versions.

Thank you for being part of the HMTL 5 mobile video revolution!