Putting a Music Player on Your Blog

Due to popular request, I finally decided to do a sort of tutorial on my blog on how to get a music player on here.

My method is a bit more techy but it works just fine.

First you are gonna want to go onto your blog's "layout" settings

• basically the layout setting will give you how your blog looks without anything on it except boxes for where everything goes. 

Based on where you want your music player on your blog, you are gonna click "add a gadget"

• for example, a typical place to put your music player is at the bottom so that is where I placed mine like so
 
•  Notice how I have an HTML/Javascript gadget already on mine? well you are going to want that on yours. 
• Just click on "add gadget" then scroll down until you find the HTML/Javascript gadget and press the "+" button to add it.
• Once you click the +, it will come up as a configuration menu. you are going to want this code ---> <script type="text/javascript" src="http://o.aolcdn.com/art/merge?f=/_media/sp/sp-player.js&f=/_media/sp/sp-player-blogger.js&expsec=86400&ver=11&clicktext=Click%20to%20Play%20the%20DEMO%20Song&showplaylist=false&showplaylistbutton=false&autoplay=true&showpop=false&popup=false"></script>
• Copy the code and paste into the body part of it.  like so 

 

•  Click save and never touch it again. That code is solely for the music player itself. 

Now for the actual mp3 files that go along with the player.

Go to Open Drive and create an account there. For now go with the free version of the sign up.

• Opendrive is basically an online storage device where you are going to store the music that you will need for the blog. 

Once you made your account, upload your music files from the computer onto your opendrive. Should be fairly easy if you can find the mp3 files on your computer. Like if you buy music on iTunes then your music will be in your music ---> itunes folder

• you can upload as many songs as you want on your blog. As you can see I have many to choose from. 

 Okay now we are going to jump back to blogger for a moment. 

Add another gadget of the same "HTML/JavaScript" and copy/paste this code. 

<a href="Direct link" style="display:none;">Title</a> 

DON'T SAVE THE CONFIGUATION JUST YET! LEAVE IT OPEN FOR THE TIME BEING!

Now back to Opendrive. You are going to want to go into the options of your song and go to links. 

copy and paste the "direct link (streaming)" into the part of this code <a href="Direct link" style="display:none;">Title</a>  where it says direct link.  

  Copy that

 Paste there

 While you are doing the coding for that, you can also change the title like I did. All you have to do is delete the word "title" with what you want like penguins or something. The title is what it will show up as in the music player when people view your blog.

So there, Congratulations! You completed your music player. If you would like more songs then you can keep using the same code in the same HTML/Javascript for all the other songs. The order that you place them in in the configuration will be the order that they play in on the music player. 

So mine looks like this because I have a total of 5 songs on my music player.

Just make sure to click save when you are finished. Save the gadgets, then press "save arrangement" on the layout menu.

 There is the tumblr method which is a lot simpler than this, but I chose to go with a multiple song option which you can't achieve through the tumblr option (i think). 

Once you check your blog again, the music player should be there fully functioning if you didn't do anything wrong. 

If you guys have any questions regarding this, you can ask me via comment or email and I'll see what I can do. 

Thanks! :)