Sunday, March 13, 2011

How to embed an MP3 audio file in a Blogger post

Sometimes it would be useful to be able to embed an MP3 file in a blogger or other blog platform post. There are a number of options including setting up a Soundcloud account.

However, if its just for a one off MP3 and you are able to host it somewhere then you can use Google Reader's audio player to play it back by using this code:

<embed height="27" src="http://www.google.com/reader/ui/3523697345-audio-player.swf?audioUrl=[MP3 URL]" type="application/x-shockwave-flash" width="320" wmode="transparent"></embed>

Replace [MP3 URL] with the full address of where the file has been uploaded, beginning with http://. The player will only play MP3 format files.

Here is an example:



Update 24th July 2012
It appears that Google have disabled this function.

However, most web browsers now support HTML5  which means you do not need an external audio player at all. You can use this code:

<audio controls="controls" height="50px" width="100px">
<source src="http://path.to/filename.mp3" type="audio/mpeg"></source>
<embed height="50px" src="" width="100px"></embed>
</audio>

Which appears like this:



I would recommend putting in a text link to the file below the player so it can be played on devices which do not support HTML5.