It is about technology!
 Subscribe to Feed

HTML5 Audio and Video players for WordPress

HTML5I have been embedding many MP3 songs in my WordPress blogs using the ultra-reliable “WP-Audio Player” plugin. But when I looked at one such blog with a podcast on the iPad no audio player could be seen. Reason: no flash in iPad and the audio player uses Shockwave Flash player.

That opened my eyes. My audio embeds lose eyeballs (rather, eardrums) because of the Flash and I don’t like it a bit. Now I have to do something about it. The alternative is not difficult to spot. Yes, it is the newfound darling of the geekosphere – “HTML5“.

MP3-jPlayer Plugin for HTML5 Audio which will work in iPad

Then I zeroed in on a WordPress plugin which embeds a HTML5 jQuery plugin. In case of an old browser devoid of HTML5 support, the player falls back on Flash seamlessly. It is the “Mp3-jPlayer“. It is a veritable darling. You can embed a single file or a playlist; either from your own server or from an URL. It also supports short codes. A comprehensive option page as well as detailed help is built in. You can customize the player either on the options page or write your own CSS rules. You can embed a player in its own line or make it inline with the text flow. It has sidebar widget too.
I have embedded a sample audio here for your appreciation:

      1. Vande Matharam is the National Song of India. But may Indians feel it should have been the de jure National Anthem of the country.

More HTML5 v ideo and Audio players

Well, that is not the only plugin to embed a HTML5 player. I found a couple of others too which help embed a video or an audio.

  1. MediaElement.js – HTML5 Video & Audio Player

    This is an “all-in-one” player which plays almost all formats – MP3, MP4, OGG and WebM. Almost all parameters and options of the player can be controlled by using shortcodes: width, height, preload, autoplay, progress, volume etc. The plugin uses “MediaElement.js” HTML framework and library (more about “MediaElement.js” – a magic unicorn HTML5 video library). The unique feature of this player is as follows:

    Most HTML5 players offer one player to modern browsers and then a competely separate Flash player to older browser. This creates an inconsistent look and functionality.

    Instead, MediaElement.js upgrades older browsers, using Flash to mimic the entire HTML5 Media API. Then once all the browsers have something that looks like HTML5 Media, we build a consistent player on top using just HTML and CSS.

  2. WP YouTube Lyte

    You can embed a single Youtube video or an entire playlist or only the audio component of an Youtube video. It is “lite” because the HTML5 player loads only after you click on “Play” button. It helps fast loading of your site even if you have more than one video embed.

    You can see this plugin in action here:

    Audio alone from another Youtube video is played in this player. All you do is suffix either “v” or “a” to “http” of the Youtube URL.

Tags: , , , , , , , , , , , , , , , , , ,

Leave a Reply

Copyright © HyperCircle 2009 | Powered by Wordpress | Designed by Elegant Themes