See How do I embed sound and music in a page? for a tutorial on how to use the XSPF Web Music Player. That article covers how to make a playlist with four songs; you can add as many <track> elements as you like.
Alternate Method: For Those Who Hate FlashMaybe you dislike Flash; maybe you just want to know what the alternatives are. Well, there's another approach - supported by other players such as Windows Media Player, RealPlayer and QuickTime Player. But be warned: it's limited, and there's no way to go beyond it. Want to display the current song title, for instance? You can't reliably do that across all browsers and platforms. So I strongly recommend you use the XSPF Web Music Player method instead.
Understood? OK, here's the alternative method. Just follow these steps to create an MP3 playlist and convince Windows, MacOS X, and Linux browsers to play the songs in sequence, in the background, for as long as your page is displayed or until the end of the last song, repeating if desired. See the end of this entry for technical notes... and be sure to read them first if you think you've spotted a mistake on my part!
Step One. Upload the MP3 files to your website. I'll assume your site is called www.example.com and the files are in a folder called example with the names a.mp3, b.mp3, c.mp3 and d.mp3.
Step Two. With plain old Windows Notepad or any other text editor, create a new text file called playlist.m3u. Place the following lines in the file:
Step Three. Save the playlist.m3u file and upload it to the example folder of your website, www.example.com.
Technical NotesHow does it work? .m3u is a standard for "playlist" files. M3U files first appeared in the WinAMP MP3 player and are now supported by nearly everything under the sun. All you have to do is list the URL of one MP3 file on each line of the .m3u file. As an added bonus, the files will "stream," playing back as they download instead of forcing the user to wait. See how do I play streaming audio on my web page? for more details on how this works.
- Windows Internet Explorer with Windows Media Player
- Windows Firefox with QuickTime Player
- MacOS X Internet Explorer with QuickTime Player
- MacOS X Firefox with QuickTime
- MacOS X Safari with QuickTime
- Fedora Core 3 Linux with the MPlayer Firefox Plug-In
Got a LiveJournal account? Keep up with the latest articles in this FAQ by adding our syndicated feed to your friends list!