November 20, 2012

How to Embed YouTube Audio-Only


For the times when you want to embed YouTube audio-only.



There are times when you want to share just the audio of a YouTube video e.g. for mobile users or for users without Flash.

A standard YouTube embed will play both video and audio even if the user just wanted to listen to the audio. Playing video consumes a lot of data whereas playing audio consumes a tiny amount of data.

If the user is accessing with their mobile device - a iPhone, iPad, Android etc which is on a limited data plan, say Verizon 2 GB plan - this can be a problem as playing video will consume a lot of data.

Here are the small modifications needed to embed an audio-only YouTube.

Standard YouTube Embed

<iframe width="560" height="315" src="http://www.youtube.com/embed/vM9U70HgLsQ" frameborder="0" allowfullscreen></iframe>

Audio-only YouTube Embed

Notice the changes in orange.

<iframe width="560" height="24" src="http://www.youtube.com/embed/vM9U70HgLsQ?rel=0&autohide=0&modestbranding=1" frameborder="0" allowfullscreen></iframe>


audio-only YouTube embed

height=24  shrinks the embed height to just the control-bar so no YouTube video is displayed.

To include the horizontal scroll bar, set height = 35.

rel = 0  so that no related YouTube videos are displayed after this embed finishes playing.

autohide = 0  so that the control bar is always visible and does not disappear.

Modestbranding = 1  so that the full YouTube logo is not displayed in the control bar.

For more information about the parameters, check the details of YouTube embed parameters.

The audio-only embed of an iPad mini commercial is shown above. The full iPad mini commercial is below.


Tags: embed youtube audio-only, play youtube audio-only, embed audio-only youtube, play audio-only youtube, youtube embed parameters, youtube player parameters