music player tutorial.
so there are two things that i have been asked
a lot about with my site, first off my dropdown navigation. second, my music player... and today we are learning how to code it!
i found the tutorial years ago, but since then the site has gone under, i ask only for a credit link from you so that
others can learn this as well! so here we go!
first you will need to download and unzip:
this folder.
next we will find the playlist.xspf file and edit it. after quickly looking over the file you can see making the tracklist is easy, between the
location tags you simply put the link to your .mp3s, in the
image tags you put the image you want displayed when each track is playing, used most commonly is album covers for each song, the image size for this needs to be
130x130 and the only format that will work is
.jpg. finally, in the
annotation tags you have your song titles. so simply change each of the details to the songs you would like to use add more tracks or remove some and then save it as
playlist.xspf now we will move on to the next step. place the following code wherever you want your music playlist to be displayed:
you
will need to modify this file in a few different places. wherever you see:
http://LINKTOYOUR/playlist.xspf&autoplay=true&repeat_playlist=true&player_title=KICK&playlist_size=6 where it says
http://LINKTOYOUR/playlist.xspf you need to insert the link to your playlist.xspf file
and where it says
playlist_size=6 you need to change the number to the number of songs you have in your playlist, if you have added or removed tracks in your playlist.xspf file you will need to modify this, if you have kept the number of tracks the same, you should not have to modify this number, however many songs you have in your playlist is the number you should put there. ex. if you have 12 songs in your playlist, you need to modify the number 6 to 12. now we upload it and
test it out!
it looks like we
officially have a cool playlist so turn the music up and give yourself a pat on the back!
if you would like to suggest a new tutorial or are having
any issues, feel free to
contact me.