Embed Online MP3 Player In Your Website, Fast & Easy

If you want a hassle-free, free mp3 player to embed any online audio in your website, you can try StangeCube’s AudioPlay.

AudioPlay is based on flash technology, and all you need to run your favorite music or podcast in your blog is to embed some html codes therein. Of course you have to have the music to be embedded already available on the net.

Watch the video below on how to go about. You may also see it on YouTube.

Download AudioPlay

You may use AudioPlay in 2 ways. Download the free codes in a zip file from their website. The present version is 0.9.9 released as on 20.10.2010 (see following image).

After you’ve downloaded and unzipped the contents, you’ll find 4 files and a folder. The folder contains the images of buttons of different designs (see following image).

Among the files, the audioplay.swf file is responsible for ‘driving’ the audio player. The config.xml file is where you can change the different parameters for altering the playing of audio. For example, you can delay the start of the audio while making it automatic; you can make the audio fade in and control its volume; you can let the mp3 audio repeat as many times or infinitely, and so on.

You can embed several mp3 players in a single webpage. In that case each player will be having a distinct identification, like ‘playerid=1’, ‘playerid=2’, and so on. The XML file will contain the path to the location of the mp3 file for each player. Take a look at the following piece of code.

<player playerid="2">
<musicfile>music.mp3</musicfile>
<repeatTimes>1</repeatTimes>
<autostart>no</autostart>
<buttondir>buttons/classic</buttondir>
<mode>playpause</mode>
<sendStop>yes</sendStop>
<listenstop>yes</listenstop>
<trackid>second</trackid>
<fadeindur>1000</fadeindur>
<mastervol>90</mastervol>
<autostartdelay>1000</autostartdelay>
<einterface>yes</einterface>
<initbuf>no</initbuf>
</player>

From the index file you’ll know the html embed code which is what you will need to embed the mp3 player in your website or blog. The html code is likely to be as under. Refer this article to know more on embedding SWF flash file.

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/
flash/swflash.cab#version=10,0,0,0" width="30" height="30"
id="player2">
<PARAM NAME=movie VALUE="audioplay.swf?playerid=2">
<PARAM NAME=quality VALUE=high>
<PARAM NAME=wmode VALUE="transparent">
<PARAM NAME="allowScriptAccess" value="always" />
<embed wmode="transparent" src="audioplay.swf?playerid=2" quality=high width="30" height="30" name="player2" allowScriptAccess="always"
align="" TYPE="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer">
</embed>
</object>

Notice, in the above html code, the reference to the mp3 audio is via the playerid parameter. In this
case it is playerid=’2’.

Once you know the purpose of the different files, the next action will be to upload the files to your web server. In particular, you should upload the button images (of the style you choose), the config.xml, the audioplay.swf file, and the mp3 file of the audio you want to embed.

The html code to embed mp3 player is given above.

Auto-Generate Code To Embed MP3 Player

Many of you may not feel comfortable to play around with codes. For them, the solution is to use the excellent online code generator provided by StrangeCube AudioPlay (see the following image).

All you need to do is to mention the absolute URL of the MP3 file to be embedded, select some of the choices like repeat, button style, player mode, etc., and then press the Generate Code button. The html code for embedding the mp3 player comes in the small box on the right.

Copy it and paste it in your blog where you want the player button to come. And there you are! Your favorite mp3 is now ready to be played.

As way of demonstration I have embedded the following button which is the mp3 player to play the audio narration of this article when clicked. Try it out.

You may like to read the following related articles:

1. Easily Transfer Embedded Audio In PowerPoint Presentation

 

2. 2 Easy Ways To Embed Podcast Player In Your WordPress Blog

 

3. How To Embed Audio Clip In PowerPoint 2010