WordPress still doesn’t have a built-in HTML5 video embedding feature, and my previous attempts at using plugins that are supposed to do so failed when either they were unreliable, stupidly hard to use, or Planet GNOME just didn’t seem to like them at all. This is quite frustrating as it has been quite a few times I ended up using screenshots (or links to YouTube) because of this. I must be missing something pretty obvious. How do you guys do it?
Edit: ok, it seems the trick is to have the following installed (thankfully WordPress can search and install plugins for you):
- The videojs plugin for WordPress
- The PJW mime config plugin to add the “video/webm” mimetype in order to avoid the security warnings when trying to upload using WordPress’ native media uploader feature.
Test:
Comments
5 responses to “HTML5 videos on Planet GNOME1 min read”
I normally use videojs http://videojs.com/ and the videojs wordpress plugin.
Brian
Thanks for the pointer Brian 🙂
I just used the video tag. See my recent posts on my blog. Don’t really care about a flash fallback; furthermore Planet GNOME will strip away javascript. It only shows a download link for non-webm browsers.
Um, doesn’t wordpress bork up the manually created video tags? I remember it stripping anything that was not part of its definition of html…
Hi Nehokayo,
to pass through the video tag stripping in the WordPress editor, but that code into the function.php file of your theme (/wp-content/theme/twentyeleven/ I suppose) :
/**
* Allow HTML5 audio and video in visual editor (TinyMCE)
*/
function change_mce_options($initArray) {
$ext = ‘audio[id|class|style|src|poster|preload|autoplay|loop|controls|width|height|type],video[id|class|style|src|poster|preload|autoplay|loop|controls|width|height|type|audio],source[src|type]’;
if ( isset( $initArray[‘extended_valid_elements’] ) ) {
$initArray[‘extended_valid_elements’] .= ‘,’ . $ext;
} else {
$initArray[‘extended_valid_elements’] = $ext;
}
return $initArray;
}
add_filter(‘tiny_mce_before_init’, ‘change_mce_options’);
/* End */
by the way, I usually use the Mediaelement.js plugin :
http://wordpress.org/extend/plugins/media-element-html5-video-and-audio-player/
because it allow to do not only video but also audio…