Welcome to Inkbunny...
Allowed ratings
To view member-only content, create an account. ( Hide )

Website Gurus! I need your help!!

I think I found the answer to my problem. First, here is the problem:

I have a bunch of mp3s I want to make simple for those who wish to, to listen to, one after the other. Why? They consist of chapters in an audio drama with music. It would be so simple to make a website that one simply visits, and it automatically starts playing the list of mp3s. Made correctly, this website could be brought up on a cell phone web browser and played the same way.

Here, I think, is the answer: a flash mp3 player in a website. There are quite a few available. Simply set it up to autoplay when you visit. If it can be made so you can skip forward to the last chapter you listened to, so much the better The total length of the story is over ten hours so far, so it's becoming almost necessary.

I found a website that lists twenty-one free flash mp3 players.

Problem is, all the code to set it up is gobbledygook to me. I need someone who knows the language they are speaking to create this simple website. The end result should be not only a website that will automatically play the story on your computer, but one that will also play on your cell phone, whether it be Android or iPhone.

Anyone out there that can help me?
Viewed: 13 times
Added: 6 years, 8 months ago
6 years, 8 months ago
Considering Flash won't work on an iPhone(nor my mom's Android phone), the player would have to have an html5 option for mobile phones. jPlayer is a very flexible open-source player with such a feature. You can see the audio playlist demo here: http://jplayer.org/latest/demo-02/
Really nice website with demos & a quickstart guide. If you use Wordpress or Drupal, they even have plugins.
6 years, 8 months ago
At the very least, you can use a demo page in the zip file as a stand-alone page(you can rename the htm file to whatever you want). Make sure to upload the .js files as well, into a subfolder named "js", like it is in the demo zip file(same with the skin folder).

Looking at the demos zip file, demo-02-bm.htm might be the one to copy the code from, just replacing the file names with your own file names in the <head> section and adding more "{title, filename}," portions as needed(copy-paste will be your friend). If you don't have any ogg vorbis files(99% chance you're only using mp3's), you can just remove the references to oga files, making sure to also remove the comma after the mp3 filename.

To insert into an existing page, you'll have to copy the code between the demo page's <head> & </head> area to the existing page's head section(if your page has none, copy the <head> tags above the <body> tag), and copy the code between the demo's <body> and </body> tags to wherever you want the player to be(if your page has none, put a <body> tag before the page's content, after the </head> tag, & a </body> tag after the page's content).

I know most of that will also look like gobbldygook, but hopefully it tells you where to put which gobbldygook where.(wow, that sounds gross)
6 years, 8 months ago
It doesn't have to be fancy. I can fancy it up as I go along. I just want to understand how it works. And the more simple, the better. If there is something free available that will work on all computers and cell phones, that would be ideal.
6 years, 8 months ago
jPlayer seems ideal since it's compatible with computers and cell phones, and you can just edit the demo file to point to your own files. For me, this is the simplest, but I'm very comfortable with code, too.

Another option is YouTube. This might be the easiest to set up, although you'd have to turn them into videos(just add cover art). Many video editors even have YouTube export, which might make that easy(Windows Live Movie Maker). YouTube lets you create playlists, and it's compatible with everything as well. Plus it's more discoverable AND you can embed the player even more easily. On a side note, I wouldn't advise using their monetization option for cover songs, since they would detect that and not consider it completely yours.
New Comment:
Move reply box to top
Log in or create an account to comment.