External “Video for Everybody” v2.1
The latest release of External "Video for Everybody" (v2.1) provides a critical security upgrade of the included VideoJS toolkit to version 4.0.2.
Category: External VfE
External “Video for Everybody” v2.0
I've just released version 2.0 of External "Video for Everybody." New to this version is the option to use remote file detection so that the plugin will generate source tags and download links only for video sources whose existence it can verify. You should use this option only if some of your videos do not have all three source types (.mp4, .webm, and .ogv). If that is the case, though, and if you are using the VideoJS library, then you ought to use file detection. The External "Video for Everybody" plugin is now bundled with Video JS 3, and a missing .webm video will cause VideoJS to fail on FireFox.
Posters (EVfE v1.0)
Version 1.0 of the "External Video for Everybody" WordPress plugin addresses two issues relating to poster images for HTML5 videos:
- First-time activations will now use poster images by default. This is a reversal of the previous initial setting. Existing activations will retain their current settings, but existing users who are not using posters might want to start. (See rationale below.)
- The plugin now includes a simple and optional built-in style sheet to help posterless videos establish a visual presence in FireFox 4.
The HTML5 <video> tag can take a poster attribute, but setting a poster previously (in iOS3) caused the video to fail on iPhones and iPads, so the default for the External Video for Everybody plugin had been not to set a poster. The iPhone/iPad problem has been corrected in iOS4 so that viewers with an up-to-date iOS should not have difficulty with posters. But there is an even more compelling reason to start using poster images: Unlike FireFox 3, FireFox 4 does not automatically display the first frame of a video. Unless you preload or set a poster, viewers may well see nothing but a blank space (with controls at the bottom) where the video should be. The video will play when you click to start it, but the white space can make for an awkward layout.
If you've been uploading poster files all along in anticipation of the day when they would work across devices, you might want to throw the switch on the Media > External VfE options page. Of course, you can still override site-wide settings in your individual shortcodes.
In case you haven't been using posters and don't plan to start, the plugin's optional built-in style sheet will somewhat alleviate the blank spaces in FireFox 4 by adding a drop shadow and a background gradient. A posterless video in FireFox 4 will then look like this:
External VfE 0.9.1
This is a pretty minor release, the main point of which is to bring the VideoJS library up to the current stable version (2.0.2). The new library creates a more portable HTML structure and offers some nice updated styling.
Browsers still seem to respect preloading and autobuffering attributes unevenly, so bandwidth continues to be a concern for those with multiple videos per page or with large videos on popular pages. My own version of FireFox (3.6.13) happens to preload against the settings when I use the VideoJS library, but does not preload when I use the native controls. Chrome seems to preload no matter what I try, but Safari now seems not to preload if you don't want it to.
The hosting page on WordPress.org is:
http://wordpress.org/extend/plugins/external-video-for-everybody/
External VfE 0.9
I have just released a new version (0.9) of the "External Video for Everybody" WordPress plugin. The new version updates to Video for Everybody 0.4.2 and also includes an option to use Steve Heffernan's VideoJS JavaScript library to provide an attractive set of video controls. The global option to use VideoJS is, by default, set to "false" but you can easily change that at the Media > External VfE options page.
VideoJS provides a nicely styled set of playback controls, including a "full screen" button, a feature that I heartily welcome. VideoJS includes a range of skins, but only the default is available for this release of my plugin. You may want to know that Heffernan, the author of VideoJS, offers his own WordPress plugin:
VideoJS - HTML5 Video Player for WordPress
The version of VideoJS in my plugin includes some customizations that should facilitate integration with a wide range of themes. At least as of version 1.1.2, VideoJS builds the video controls using ul and li tags. Not a few WordPress themes include unqualified styling for these elements which can then interfere — sometimes severely — with the layout for the controls. I have converted the ul and li tags to div tags and made the accompanying adjustments to the library's style sheet. The change seems to help considerably.
I am also exercising an option the VideoJS code provides to disable the hiding of the "downloads" section when the client's browser has playback capability. There's a double negative there. What it works out to is that I am opting to have the download links display even when playback is working.
Finally, I tweaked the function that hides the controls after four seconds so that the controls instead remain visible as long as the mouse is within the video area.
External VfE 0.8
I've just released version 0.8 of the External "Video for Everybody" WordPress plugin. The plugin now supports delivery of .webm video files. The change to the HTML is minor, and it's been part of Kroc Camen's Video for Everybody for a while now. I'm just catching up, not least of all because I wanted to be able to do testing of my own before putting it out there.
A trickier question was how to handle the links for downloading files. I've decided to continue generating the .ogv and .mp4 links automatically. These two files are still required in order to play your video on as many systems as possible. The .webm file is icing for now, so you can set a shortcode attribute to include the .webm link whenever that file is also available.
To put it another way, if you are using this plugin, you should offer an .ogv and an .mp4, and you can offer a .webm if you like. If .webm is not your thing, you can just keep using the plugin as before.
A fair question to ask might be: Why use .webm at all when it doesn't increase the viewability of your video, when it takes longer to transcode (at least in my experience), when the file sizes are larger (again, in my experience), and when it means uploading and storing three sizable media files instead of two? The simple answer would be that the quality of the video seems higher to me.
Which raises another point: The order of the source elements is dictated by quirks of certain devices on which you might view the video. That's too bad. Even though .webm looks the best, .mp4 needs to be listed first and might therefore be preferred even by clients that could handle the .webm. It would be nice to find a way to privilege .webm wherever it's supported, but that's a matter for a future version.
Good News for External VfE in Safari 5
I just upgraded to Safari 5 (Mac) and was very happy to find:
- Safari 5 respects the
preload="none"attribute of the HTML5videotag - Safari 5 will play ogg/theora video
The first point is of immediate relevance to the current version (0.7.1) of my External Video for Everybody WordPress plugin. The second point holds promise for the future of open codecs in HTML5.
Neither improvement seems to be available for the Windows version.
External VfE 0.7.1
External VfE 0.7.1 makes a minor change to fix a bug pointed out by a friendly reader. Thank you.
The details
The img tag in the embedded Flash object was mistakenly pointing to an .mp4 file. It will now point to whatever type of file you indicate with the "poster_extension" attribute, either in your shortcode or on the settings page.
On a related note. Even if you are opting to omit poster attributes for your HTML5 video tag, you will still get the benefit of using a poster image with the Flash object.
Upgrade for vfe.sh
I've just updated the vfe.sh shell script to harmonize better with the latest version of the External Video for Everybody plugin.
- The poster.mp4 file will now be created only if you set a -q flag
- You can designate an output file name that differs from the input file name by providing an optional second argument
The link to the current version of the script is in the sidebar.
External VfE 0.7
I have just released External Video for Everybody 0.7 as the new stable version. The big change here is that following Video for Everybody 0.4+ I have dropped the embedded QuickTime objects.
Part of the rationale for dropping QuickTime objects is to simplify the HTML, though I would not have done it for that reason alone. After all, the plugin doesn't care about having to write some complicated markup.
I made the switch for three additional reasons:
- I think it is valuable to stay close to Video for Everybody rather than to fork off in a different direction
- Dropping QuickTime objects lowers the overhead when preparing files. There is no need now to create a "poster.mp4" file.
- I want to avoid preloading movies that will not be played, but using the "poster.mp4" was creating an odd user experience. You had to click on the movie to get it to play rather than clicking on the "play" button. So really the poster needed to have some kind of "click me" label. I'm sure I could have automated a smarter poster creation for myself, but it added to complexity for providers and consumers alike. Better to let it go.