Warning: include() [function.include]: URL file-access is disabled in the server configuration in /home/wenyen00/public_html/musictut.php on line 6

Warning: include(http://www.wenyen.co.uk/ver2header.txt) [function.include]: failed to open stream: no suitable wrapper could be found in /home/wenyen00/public_html/musictut.php on line 6

Warning: include() [function.include]: Failed opening 'http://www.wenyen.co.uk/ver2header.txt' for inclusion (include_path='.:/usr/lib/php:/usr/local/lib/php') in /home/wenyen00/public_html/musictut.php on line 6


Music players can be seen quite often on blogs nowadays. There are many different ways of putting music on your site. Here is my favourite one.

Firstly, the code for the music player.

<object id="darkplayer" codeBase="http://activex.microsoft.com/activex/controls/mplayer/en/nsmp2inf.cab#Version=5,1,52,701" type="application/x-oleobject" height="0" standby="Loading Microsoft Windows Media Player components..." width="0" classid="CLSID:22d6f312-b0f6-11d0-94ab-0080c74c7e95"> <param NAME VALUE> <param NAME="ShowControls" VALUE="0"> <param NAME="ShowStatusBar" VALUE="0"> <param NAME="ShowDisplay" VALUE="0"> <param NAME="DefaultFrame" VALUE="Slide"> <param NAME="Autostart" VALUE="1"> <param NAME="Loop" VALUE="True"> </object>

ShowControls, ShowStatusBar, ShowDisplay have all been set to "0". Usually people like to do their own start, stop and pause button and they only want the playlist to appear. Autostart is set to "1". If you don't want the music to start whenever your site loads then set it to "0". Adjust your loop to true/false depending on whether you want the music to repeat.

Secondly, the songs.

<script language="JavaScript"> <!-- var playstate = 1; shuffle = 1; songs=new Array(55); songs[0]=" Song URL " songs[1]=" Song URL " songs[2]=" Song URL " songs[3]=" Song URL " songs[4]=" Song URL " songs[5]=" Song URL " if (shuffle == 1) { var randsg = Math.floor(Math.random()*songs.length); document.darkplayer.FileName = songs[randsg]; document.darkplayer.scr = songs[randsg]; document.forms['form'].playlist.options[randsg].selected = true; } function play(list) { if (playstate == 2) { document.darkplayer.Play(); } else { var snum = list.options[list.selectedIndex].value document.darkplayer.FileName = songs[snum]; document.darkplayer.scr = songs[snum]; } playstate = 1; } //--> </script>

4th Line: shuffle = 1. That sets the first song the player plays when your site loads. 1 means it will randomly choose a song to play. 0 means it will play the first song. Then under songs[0]=" Song URL " add your song url. You could upload your own mp3 songs at sites like AngelFire. Then under Song URL it would be something like:

songs[9]="http://www.angelfire.com/blah/blah/yoursong.mp3"

Or you could go to this site to look for songs. They have a list of music providers. Usually they are in asf extensions. Example:

songs[18]="http://a420.v8383d.c8383.g.vm.akamaistream.net/blah/blah/1265_1.asf"

You could add as many songs as you want. Just keep adding the line songs[#] = "Song URL". Make sure in the songs[n], the n doesn't have repeating ones.

Last but not least the playlist and the controls. This is the only thing a visitor will see.

<form name="form"> <select style="FONT-SIZE: 8pt; BACKGROUND:# B3D98C; WIDTH: 150; COLOR: # 1FAD66; font-face: Courier; height:100;" name="playlist" size="1"> <option value="0"> Song title- Artist</option> <option value="1"> Song title- Artist</option> <option value="2"> Song title- Artist </option> <option value="3"> Song title- Artist </option> <option value="4"> Song title- Artist </option> <option value="5"> Song title- Artist </option> </select><br> <input TYPE="BUTTON" NAME="darkplay" VALUE="play" OnClick="play(document.forms['form'].playlist);"> <input TYPE="BUTTON" NAME="darkpause" VALUE="pause" OnClick="document.darkplayer.pause(); playstate=2;"> <input TYPE="BUTTON" NAME="darkstop" VALUE="stop" OnClick="document.darkplayer.stop(); playstate=2;"></p> </form>

Change the song titles and the artists according to the order of the song urls you put in the previous code. Make sure that the option value of the songs correspond: songs[7]="http://www.angelfire.com/blah/franzferdinand_takemeout.mp3" then the playlist entry should be:

<option value="7">Franz Ferdinand - Take Me Out</option>

Of course you can write the song name and artist name anyway you like. They are so many ways to personalize this. First, the playlist. For those who know css, then this shouldn't be a problem. Look for this part of the code:

<select style="FONT-SIZE:8pt;BACKGROUND:# B3D98C;WIDTH:150;COLOR:#1FAD66;font-face:Courier;height:100;" name="playlist" size="1">

You can change the font size, font, background colour, width and height of the playlist. color: #ffffff; changes the font colour. If you want a list of hex colour codes try this site. If you want a background image instead of a background colour, then u could do:

<select style="background:url(yourimage.jpg);" name="playlist" size="1">

Height and width of the playlist shouldn't have much effect if you have size="1" in the code above(under <select>). The value of size determines how many songs in the list to show at one time. For example, this is size="1":

An option Another option A third option

This is size="2":

An option Another option A third option

Then the play, stop and pause buttons. The 3 <input> tags are the buttons. The parameter value="play" determines the text that will appear on the button. <input type="button" value="Text here"> will give:



You could change the appearance of the buttons using css again.

<input style="font-size:10pt; background: #000000;" TYPE="BUTTON" NAME="darkplay" VALUE="play" OnClick="play(document.forms['form'].playlist);">

Change the colours, fonts, size of button to suit your site. If you do not wish to use button then remove the <input> tags.You could use text instead.

<a OnClick="play(document.forms['form'].playlist);">Play</a> <a OnClick="document.darkplayer.pause(); playstate=2;">Pause</a> <a OnClick="document.darkplayer.stop(); playstate=2;">Stop</a>

Play, Pause and Stop will appear in text and when clicked will play, pause and stop respectively. You could also use images.

<a OnClick="play(document.forms['form'].playlist);"><img src="play.jpg" border=0></a> <a OnClick="document.darkplayer.pause(); playstate=2;"><img src="pause.jpg" border=0></a> <a OnClick="document.darkplayer.stop(); playstate=2;"><img src="stop.jpg" border=0></a>

Here are some buttons I made, one set with black background, one set with white background. If you have photoshop, open the images, press Ctrl-U and colourize the buttons to suit your site.



Blogger users can ignore this. If your site has mulitple pages, then it's no use having a music player on the site cause the player loads again when u go to another page. So you could put the player on a separate window.

Put all the code above into a html page, let's say musicplyr.html, then you could put this code on your site for the visitor to open a separate music player window:

<a href="#" onClick="player=window.open('musicplyr.html', 'musicplayer', 'toolbar=no, location=no, directories=no, status=yes, menubar=no, scrollbars=yes, resizable=no, width=230, height=95'); return false;">

The height and width are just examples. Change them to suit your needs. You can also choose whether the new window has a status bar, menu bar, scrollbar and is resizable. If you have any more problems, feel free to email me at wongwy@gmail.com =D Use the music player wisely. I personally don't like putting music on a website. Most people nowadays have tons of music on their own computer so if you put one on your site, make sure it suits your site and doesn't jeopardize your loading time. WY signing off.


Warning: include() [function.include]: URL file-access is disabled in the server configuration in /home/wenyen00/public_html/musictut.php on line 196

Warning: include(http://www.wenyen.co.uk/ver2footer.txt) [function.include]: failed to open stream: no suitable wrapper could be found in /home/wenyen00/public_html/musictut.php on line 196

Warning: include() [function.include]: Failed opening 'http://www.wenyen.co.uk/ver2footer.txt' for inclusion (include_path='.:/usr/lib/php:/usr/local/lib/php') in /home/wenyen00/public_html/musictut.php on line 196