You will first have to find a music file that is already hosted on the web, or if you have your own music file stored in your computer, upload it into a file host and then get the URL of the file. If you don't have any music file saved in your computer to upload, you can find files already hosted at freemp3mail.com, select the artist, click "Free Download" and you will be taken to the file hosted on the web. You can copy the URL from the address bar of that page. For example, this is a file already hosted on the web: Josh Aran (Blossom).
In the HTML/Javascript widget window or the post editor window, paste this code:
<embed src="URL of music file"
width="150" height="40" autostart="false" loop="false">
UPDATE 15 November 2007: A blogger commented he/she got error message "The tag isn't closed". No time to test this, but with XHTML (and HTML), opening tags without closing tags are supposed to end with a backslash /. Further, I believe with XHTML, there have to be a space as well. If you have problem, try
<embed src="URL of music file"
width="150" height="40" autostart="false" loop="false" />
and see if it helps. Please give feedback as I have no time to test.
You will have to substitute "URL of music file" with the actual URL of the music file in the script. In the script, there four attributes - width="X", height="Y", autostart="false/true" and loop="false/true". You will have to make sure that the value of width attribute X is consistent with the width of the container in which you intend to add the player into. For example, the width of the sidebar is 160 for this template, so I have to add a value less than 160 if I want to put it in the sidebar. For the autostart attribute, if you put it as true, the music will start automatically the moment your blog is loaded. Many have the opinion that this is a bad choice as the visitor may be visiting your site in the middle of the night when others are sleeping, and may be forced to quickly exit your page to stop the music. If you put the autostart attribute as false, the visitor will have to click the start button to start the music. For example, I have used the "Add a Page Element" to embed an MP3 player at the bottom of this blog Good Hobby Ideas. Try clicking on the start button to listen to the music. For this player, I have put the attribute loop="false" so that the music will stop when it is finished. If you want the music to loop continuously, you will have to put loop="true".
There are other ways of adding music to your blog. For example, you can use this site
Sonific to generate a script for putting into your post (the player will only appear in that post) or the Page Element (the player will then appear in all pages of your blog). You register for an account, verify your email address, sign in, select a songspot, and you will be taken to this page to fill in the field for the blog platform you are using and the URL of the blog you want to put the songspot in (see screenshot below, click to enlarge):

As you can see from the screenshot, you have various option like orientating the player horizontally or vertically, select the size, whether to start the music automatically or manually, etc. You will also have to select your blog platform (which in our case will be Blogger) and type in the URL of the blog you intend to embed the player into. When you are finished the configuration, click "Activate" and the next page will display the script for you to paste into your post or the Layout. If you paste it into your post, when you try to publish it, you will get an error message "Your HTML cannot be accepted.......". Ignore it, tick "Stop showing errors for this post" and publish.
You can see an example of the player embedded into a post at Testing Sonific. The player will only appear in this particular post. You can also see the player embedded in the footer of this blog. In this case, the player will be displayed in all the pages of the blog.
You can also use Google Gadget to add an MP3 Music Player on your blog. See post Adding a MP3 Player to your blog (click "BACK" button to return to this page).
RELATED POSTS:
Music for websites: Summary (click BACK button to get back to this page)
Easy way to add music to blog using eSnip (click BACK button to get back to this page)
eSnip music player in sidebar (click BACK button to get back to this page)
Invisible background music player for your blog
Embed Imeen music playlist into blog post
Embed Imeen music playlist into blog Part 2
Apple Quicktime to make MP3 player works
Its really nice for viewers to listen to music and surf. I think i will also put it on my blog.
ReplyDeletethank you Peter i will have a go and let you know how i get on.from gurnygob@msn.com
ReplyDeleteWow, what a great idea, thanks!
ReplyDeleteRandom, unrelated question: how does one change the amount of space between lines in a post. On my most recent post, I have a list which looks kind of ridiculous with so much space between them each line of text. Thanks in advance.
You either click the delete key or delete the <br /> tags
ReplyDeletePeter
Natural Remedies
Thanks Peter, but I still want them on separate lines. My problem is the text seems to be by default almost double spaced (or 1.5 as it would be called in Word) whereas I want one section single-spaced. I've never seen a blog arranged differently, though, so it may not be possible.
ReplyDeleteHi Ray,
ReplyDeleteSave your template first before trying anything. I may not know what i am writing. But open the template editor window and look for the following block of codes
.post h3 {
margin:.25em 0 0;
padding:0 0 4px;
font-size:140%;
font-weight:normal;
line-height:1.4em;
color:#cc6600;
}
Change line-height:1.4em;
to a value you desired.
Peter
Natural Remedies
peter i just want to thank you. i followed your advice on how to get music on my blog. i got it done at long last. i went to sonific. had a bit of a prob with working it out, but got it in the end. thank you very much
ReplyDeleteIs there a way to play the music file on demand, e.g., by clicking an icon, BUT in the background? I don't want the QuickTime plugin to show and change the current web page. I use FireFox 2.
ReplyDeleteHi Becky,
ReplyDeleteI am afraid I am not a great fan of music on websites, and have not done much work with it. Also, I don't fully understand your question. Perhaps you can try posting your question to the Google Blogger Help group and see what they come up with.
Peter a.k.a. enviroman
Enviroman Says
Found this on a google search for - what else, putting music on blogs -
ReplyDeleteThanks!
Hi jblieu,
ReplyDeleteThat is nice knowing my post can be found via a search engine. Thanks for taking the trouble to comment and let me know. Very much appreciated.
Peter a.k.a. enviroman
Enviroman Says
Thanks, I was able to use this!
ReplyDeleteI embedded audio in a blog post. Got errors in Blogger when I did not put in the closing embed tag. Took me awhile to figure that out, but now I'm enjoying.
I noticed it's different on machines with different default media players, so I'm experimenting with that now.
Thanks again! I am not technical at all (YET)!
damn, thanks mate! really helped me a lot! niw, to put it in my blog...
ReplyDeletehttp://basyarblog.blogspot.com
i tried using the code but it keeps saying additional plugins are required. what plugins am i supposed to download ? and what am i supposed to do ? i'm lost
ReplyDeleteHi Ruby,
ReplyDeleteI guess I have to be honest here. I don't have much interest in music in blogs, and what I have done is tested what I described, and if it works, I post about it. I didn't install any extra plug-in, so I really do not know what plug-in you require for your computer. Perhaps you can post your problem to the Google Blogger Help group where there are many music enthusiasts there.
Peter (Blog*Star 2006 and 2007)
Dummies Guide to Google Blogger
"online book" in progress
Hi found this post through the search engine and found it to be the best to understand. Completely new to blogging and to html coding in general and have had a difficult time with all the lingo. I understand the steps you wrote out but I don't know how to upload my music file from my itunes on my hardrive to an online host. Can you tell me how? tried the freemp3 site but it is just independent singers and not anyone I was looking for. Also my itunes song file says m4a not mp3 does that mean anything? In reading the comment file I saw that a couple people had a problem with the "closing embed tag" I don't think I can figure this out on my own since I have no idea what this is. Do you know what they mean and what the solution is/was? Thanks
ReplyDeleteHi Michelle,
ReplyDeleteTo tell you the truth, I do not really have very much interest in music, but have done some research with my limited time and have made numerous attempts at finding sites that will allow you to host a music file that is actually hosted on the web. All those that allow music upload I found only allow you to get a link to their site do download the music, which will not help in embedding the music in your post.
If only I have more interest/time, I will do further research but with the amount of things still waiting for me to do, I doubt it will be anytime in the near future.
Peter (Blog*Star 2006 and 2007)
Testing Blogger Beta (now New Blogger)
Whenever I try to add my music, all that apears is the quicktime "Q" with a question mark in the middle and the music doesn't play. I can't figure out what's wrong because I have the right code and url as far as i can see.
ReplyDeleteHi Katie,
ReplyDeleteMusic is not my strong point as I really don't have much interest in music in my blogs except Make nice music slideshow for your family and My first grandchild and This Old Man music slideshow (my grandchild and the music is used with copyright owners' permission and all play fine). I have tested all the posts related to music before they become public and all tested OK, but there had been time I went back to check and the music play intermittently, have some kind of problem, etc. I don't know what is wrong.
Peter (Blog*Star 2006 and 2007)
Testing Blogger Beta (now New Blogger)
hey peter thanks for posting these topic...but i dont know why it doesnt work for me!...i have tried a thousand times, and i cant make it work!
ReplyDeleteI think you have to install Quicktime.
ReplyDeletePeter (Blog*Star)
The easiest way to earn something for your blogging efforts
Hi mafe,
ReplyDeletePlease refer to Make MP3 player works by adding Quicktime plugin.
Peter (Blog*Star)
What a grateful blogger did for me
(no one should feel obligated. Everthing completely voluntary. However, by doing so, you may also help your visitors find helpful information and help. You may even pick up various ways of linking sites there too)
Yay, I did it! Thanks for the tip. I had to try a couple of diff songs, it worked eventually.
ReplyDeleteQuestion, can I embed a song (or loop of songs) without showing the player-thingamajigg?
Merci!
Salut Lei,
ReplyDeleteComment ça va?
"can I embed a song (or loop of songs) without showing the player-thingamajigg?"
You mean you want an invisible music player? Like this blog: Blog with invisible background music player. Surf over there with your speakers turned on and see if that is what you want.
If that is what you want, go to How to install an invisible music player and why you should not do it.
Au revoir,
Peter Blog*Star
Testing Blogger Beta (now New Blogger)
I keep getting errors stating that I need to close the tag. The tag isn't closed once I use this code?
ReplyDeleteHi pri,
ReplyDeleteHard to answer in comment. Refer back to post which I have updated (in red) and please give feedback if it helps.
Peter Blog*Star
Blogger for Dummies
It is not working for me i don't know what is it thta is lacking here, there's no music nothing.
ReplyDeleteHi,
ReplyDeleteI am neither a big fan of music on websites nor an expert but hope this may be of some help:
Add Apple Quicktime to make MP2 player works
Peter Blog*Star
The easiest way to earn something for your blogging efforts
Help, this question is off topic by the way.
ReplyDeleteWhy when I post my posts, I see the posts on my blog. The words in front are cut off. help!!
Hi 1Nf3rn....
ReplyDeleteWhat do you mean "words cut off"?
This is a really grat blog!!! helped alot
ReplyDeletecan I ask you a question?
how do you add color to the part after you posted a post.... like where it says Posted by (name) at 6:34
not changing the font color but the background of that little part
I eleted the purpose statement that was on my blog by accident. Any way to recover that?
ReplyDeleteTry How to recover accidentally deleted post
ReplyDeleteThe standard for using the " />" to end a tag doesn't appear to be recognized by Blogger for all elements. I got the same error (Tag is not closed) but was able to correct it using the syntax:
ReplyDelete<embed src="..." ...></embed>
the <embed src="..." ... /> should work, but doesn't -- or so it seems. But I'm currently listening to the song I embedded in a test post using the alternate syntax, so I know it works.
I sort of vaguely coming across a similar situation where I had to add a closing tag to make some script work although there was /> at the end and was supposed to be self closing. In any case, you are knowledgeable to solve the problem, so no problem.
ReplyDeletemy blog now says:
ReplyDeleteadditional plugins are required to display all the media on this page.
there is a button that says install missing plug ins
but when i click it it says
no suitable plug ins found
suggests several
https://addons.mozilla.org/en-US/firefox/browse/type:7
i do not want all my visitors to have to download a program to listen to my music
any suggestions?
My own experience had been when the background music I embedded into a demo blog did not play, I had to install Apple Quicktime. I have no other experience of related nature
ReplyDelete?????????????????
ReplyDeletei am sorry. i didnt understand a word u said. could u explain it step by step 2 mii.
it dosent work can u explain in detaile
ReplyDeleteWhat doesn't work?
ReplyDeleteNo sound? Perhaps you need to install Apple Quicktime
I have used your code in the past to embed songs into posts. Thanks!
ReplyDeleteFor some reason recently, it keeps autostarting although the code is "false" Let me know if you have any ideas as to why this is!
yours-truly-mj.blogspot.com
Nevermind. I figured it out! Thanks for all these tutorials an tips! SO HELPFUL!
ReplyDeleteThanks Peter, it really help.
ReplyDeleteHey Peter, sorry I just barely saw your comment! Ok, so I actually use the third code from here: http://www.hypergurl.com/music.html
ReplyDeleteand then I was embedding my files in my data nest, but lately I have not been able to use that site (it might have shut down?) so I need to find another site to host my music files as mp3s.
And using this code didn't completely solve my problem: For some reason the autostart=false only works when people are viewing my page in any browser EXCEPT chrome. Chrome likes to do it's own thing and just start the music file.
yeah working, but when we go to next page the music restarts, do we have any option like to get a continued music even browsing into pages?
ReplyDeleteNow my blog sings !
ReplyDeletethanku very much
Hey it's not working in my blog !
ReplyDeleteIt show to download plugin .
reply me ! Please.
check it out my blog
http://mycineinfo.blogspot.com
Maybe you need to install Apple Quicktime
ReplyDeleteHi, I am so glad to have found your blog.. I am a newby at this. I made my first blog and wanted music on it but danged if I can get it in my head of what to do. I have the song in "MY MUSIC" and a folder in there with the song. So can you kindly walk me through this step by baby step please. Is it too late to add the music to this page I published or should I just try it on a new page. I would love to have it on the one published if I could. http://whatsgoingoninshirleysworld.blogspot.com
ReplyDeleteI know about the gadgets but don't understand what I am to type in the box that has the http//
and where to put the code on the sidebar. Thanking you in advance.. and anxiously waiting t hear from you.
Shirley, tell us where you want that music - as background music for the whole blog, embed it in the sidebar which you have to click to get the music to play or in an individual post?
ReplyDeletethank you very much...
ReplyDeletebut the explanation is too long!
Thanks for the explanation, although it didn't have to be very long.
ReplyDeleteyou can try
http://flowplayer.org/plugins/index.html
http://www.alsacreations.fr/dewplayer
http://developer.yahoo.com/mediaplayer/
I added the feature in my blog. Really helped. Traffic was glad I used it. Now they can listen to songs before downloading
www.pawpav.blogspot.com
hello please can you do url to this song [URL=http://www.4shared.com/audio/n11LeZzN/mp3.html].mp3[/URL]
ReplyDeleteso i can put it on my blog
The code you gave is the BB code for bulletin board and some forums. For HTML refer to make active links in posts and comments
ReplyDeleteThis section contains information about who identified the specimen, how they identified it and what concept .logo design
ReplyDeleteYou will first have to find a music file that is already hosted on the web, or if you have your own music file stored in your computer, upload it into a file host and then get the URL of the file.
ReplyDeleteWhat do you mean by this, file host? Because I would like to upload my own music to my profile.
Now a file in your computer is only accessible via your computer, not via someone in the internet. To be accessible via the Internet the file must be uploaded to a server of a webhost. Via that webhost. If you want that in your blog, that webhost must allow hot linking.
ReplyDeleteVisit My Blog And Follow It Also Tell me What Can I Do To Improve My Blog
ReplyDeleteHello just wondering if its better to download free non copyrighted music from a site like www.instrumentalsfree.com and avoid copyright issues from using popular music?
ReplyDeleteThanx! Btw I set the autostart to true instead of false, so that it starts automatically.
ReplyDeleteNow I just need to know how to make it to always be on the top. Anybody knows?
http://dannesphotoshop.blogspot.se/
you put it on the side bar, or add it in the page layout as an html gadget. or you can have it play automaticly as well.
DeleteMY question is: is there anyother way than putting the music in a post on the main page, to get so you can do different music on each page? and I want different music when somone clicks a archived article or post, then when they are just on the main page with all posts. home page.
www.elliswater.blogspot.com