Musicality

Catch Me - Demi Lovato Sparks Fly - Taylor Swift You're My Only Shorty - Ariana Grande ft. Iyaz All Over Again - Big Time Rush Without You - Usher Invisible - Big Time Rush Why Don't You Love Me - Hot Chelle Rae ft. Demi Lovato Count On You - Big Time Rush ft. Jordin Sparks Together - Demi Lovato ft. Jason Derulo Fix A Heart - Demi Lovato Who's That Boy - Demi Lovato ft. Dev Heartbeat - The Fray Tell Me That You Love Me - Victoria Juastice and Leon Thomas III put Your Hearts Up - Ariana Grande Add Music To Your Blog (Thanks to http://bloggerstop.net/2009/05/add-mp3-music-player-to-your-blogspot.html):

This tutorial will help you to add a customized music player and create your own playlist. The first 2 steps of this tutorial will let you add the songs to your blog (Repeat these steps whenever you want to add more songs to your blog/posts), and step #3 will add a floating MP3 player to your blog.


For this tutorial you will have to open an account here:
1. OpenDrive (online storage).


STEP #1:
Upload songs (MP3 files) to your newly registered OpenDrive account,
right click on the file and then click on the hyperlink "links" as shown in the screenshot below:






Then copy the "DIRECT LINK" (Streaming) to that file.


STEP #2:
Now, paste it as a hyperlink in to your blog:
1. Either paste it in the sidebar (Blogger -> Design -> Page Elements -> "Add a Gadget -> HTML/JavaScript") to play the songs site-wide, 
2. Or paste it in a blog-post (anywhere in the post), if you want to play the songs only in a particular post.
(List all the songs you want to play as these hyperlinks)


The hyperlinks to the songs should look like this:

<a href="http://DIRECT_LINK_TO_SONG_1"style="display:none;">Song_1_Title</a>
<a href="http://DIRECT_LINK_TO_SONG_2"style="display:none;">Song_2_Title</a>

Replace the links highlighted in RED with the DIRECT LINKS you got from OpenDrive in STEP 
The code style="display:none;" will hide the hyperlinks (song titles). If you want to show the links to your visitors, then delete the code highlighted in BLUE, before saving the widget/post.


STEP #3
Finally, to play these songs we will add the floating MP3 player to the blog.
Go to this page: StreamPad


AAnd click on the Blogger logo:

Before copying the code, go to the bottom of the page:

And customize the player as you want: Enable Autoplay, change colors, Allow popout etc.

Finally copy the code from Step 5 in that page. 
If the code in Step 5 does not get updated when you customize the options, then simply use 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=true&autoplay=true&showpop=true&popup=false"></script>

Change the values highlighted in RED from true to false or vice-versa And paste that code in to your blog:
Go to Blogger -> Design -> Page Elements -> Add a Gadget -> HTML/JavaScript"
Paste the code and save widget.

NOTE 1 (Important): In case you want to "show" this widget only in a single post or in a group of posts, then instead of pasting the above code in the sidebar widget, paste it inside the post (anywhere in the post) where you want to display the widget (floating bar MP3 player).
NOTE 2: If you paste the code in the sidebar, then the bar is shown across all the pages on your blog and wherever (either the sidebar/blog posts) songs are detected, it will be added to the floating bar as long as the visitor remains in a particular page.
NOTE 3: As an alternative MP3 player, you may try the media Player from Yahoo (with Video support) instead of the one from Streampad (in step #3).


This widget can detect all the links to songs on any page (which you have already added in STEP #2 of this tutorial) and will start playing them as a playlist, in a floating bar from the bottom of the page.


Now sit back & Let The Music Play