Extension:HTML5video

A multipurpose video player for HTML5 video. This video player is self-contained entirely to the local site, in that all video is stored on the local site. There are no required links to video that is hosted on other 3rd party sites (such as YouTube) — although you can also play a YouTube video if you want. But the strength of this extension is the ability to play HTML5 video stored locally on your site (in .mp4, .ogv, or .webm format). The extension is cross-platform compatible and will work on Internet Explorer, Safari, Opera, Firefox, and Chrome. It will also play video on iPads, iPods, and Android devices. Lastly, you can set the arguments of Width, Height, Loop, and Autoplay. This extension is maintained by Stamps Howard.

A multipurpose video player for HTML5 video. This video player has the following features:

Typical usage is:

In this case, 640 is the video width in pixels, 480 is the video height in pixels, autoplay is set for immediate start, and the name of video file is “Blue_Whale” (with no extension). It is important that 1) you do not add the file extension (e.g. .mp4, .ogv or .webm) because the program automatically selects the correct file extension, and 2) there cannot be any spaces on either side of the file name. The allowable arguments are:

If you are using HTML5 video (rather than the YouTube option), note that width can be set as a percentage, in which case the height argument is ignored so that the aspect ratio of the video is maintained. For example, the following code (which can be seen at Where to See Whales ) will play the video clip at 100% width of the available screen:

Finally, you can also play YouTube video by setting the type argument to ‘youtube’ as shown in the following example, where “O2FInaOCqoo” is the YouTube ID of the video:

Download the file HTML5video.tar from the following link: HTML5video.tar and uncompress the HTML5video folder. Then upload the HTML5video folder to your extensions folder of your MediaWiki installation. Note that the download contains the files Blue_Whale.mp4, Blue_Whale.ogv, and Blue_Whale.webm to allow testing of the extension without having to create your own HTML video files.

To install this extension, add the following to LocalSettings.php:

For best results, you need to upload two copies of your video, one in .mp4 format and one in .webm format. Both files need to be uploaded to your site in the “videos” directory. In the following example, the root Mediawiki directory is assumed to be “wiki”

Unfortunately there is no single format for video files that will play in all cases. iPads and iPods do not play flash video, but they will play.mp4 video. Unfortunately, some browsers (such as Firefox) will not play .mp4 — but Firefox, Chrome and others will play .webm video. Firefox, Chrome and others will also play .ogv files (also known as Theora), but this is an older standard and the video file size is much larger than .webm.

By choosing to use at least two HTML5-compatible video formats (.mp4 AND .webm), this allow nearly any updated browser to play the video, including any browser updated to or beyond the following list: Internet Explorer 9, Firefox 4.0, Chrome 3.0, Safari 3.1 and Opera 10.60.

Fortunately, it isn’t very hard to convert video files. There are lots of free converters available and it is relatively straightforward to convert most video into .mp4 format. And when you have created the .mp4 file, there are plenty of converters to convert .mp4 video into .webm video. It only takes a few seconds.

I personally use Miro Video Converter, which is a free app on the Mac (the Mac App Store, and it is also available for PC users). It is a super simple way to convert almost any video to HTML5 format video including MP4, and WebM. I highly recommend it. See Miro Video Converter

Since so many users still use Internet Explorer 6, 7, and 8 — which do not support HTML5 video — I’ve added a flash fallback player. Now the videos will play on Internet Explorer 6, 7, and 8.

Note that, with Internet 6, 7, and 8 the video defaults to loop=”true” and autoplay=”true”. And the volume is initially set to OFF.