Shortcode: Embed HTML5 audio

HTML5 coming with several new tags that make a developer’s life a lot easier. We do agree that It is not completely furnished yet. But, Some features are already implemented by couple of browsers (chrome and safari at least). One of those feature is the HTML5 audio. You do not need third party players to play your video which also increase the page load time. This snippet will add a shortcode so you can embedded your audios anywhere your want.

You can use HTML5 Test to check if your current browser support HTML5 and specifically, which features are supported.

Add following code where you want to place your audio.


[audio5 src="http://your-site/videos/your-video.mp4" loop="true" autoplay="autoplay" preload="auto" loop="loop" controls=""]

Add following snippet to “functions.php”


add_shortcode('audio5′, 'html5_audio');
function html5_audio($atts, $content = null) {
        "src" => '',
        "autoplay" => '',
        "preload"=> 'true',
        "loop" => '',
        "controls"=> ''
    ), $atts));
	return '<audio src="'.$src.'" autoplay="'.$autoplay.'" preload="'.$preload.'" loop="'.$loop.'" controls="'.$controls.'" autobuffer />';


Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>