How To Upload Songs (MP3 Files) On A Blogger Blog With Download Button

Uploading downloadable mp3 or music files is not directly possible in the blogger platform, but using Google sites, you can upload songs to a blogger blog with a download button for free without having to pay for extra hosting.

With Google Sites, a BlogSpot music blogger can upload media files such mp3, songs etc. online for free and place them on a blog for downloading using plain links or download buttons. You can also accomplish this using Dropbox.

Steps Required

These simple steps will guide you to uploading your songs to blogger and also offer them for download using download buttons.

  1. Create A Free Google Site Account
  2. Create A Music Forder
  3. Upload Files And Copy Link
  4. Add Download Button.

Create Google Site Account

Google site is a free hosting service created and managed by Google. You can upload mp3 files, video files, PDF, images and any other type of file you desire to save online.

  1. Simple Blogger Related Posts Widget With Thumbnail
  2. How To Create Free Personalised Email Address Using Zoho

Visit www.sites.google.com using your Gmail account.

Step 1
On the homepage, click  “CREATE” >> “In Classic Sites”.

Step 2
Select “Bank template” >> Choose a name (e.g bloggingprinceMP3) >> Add site location (URL) >> Add Site Description. – No need to select a theme. >> Verify that you are human >> finally “Create”.

Create Music Forder

A folder is a folder everywhere. It helps to organise your files in one place. If you are a blogger that want to upload videos, songs, and PDFs online then you should create different folders for each file type.

Step 1
On the blank page, Locate “Create Page” at the top. It has an icon that looks like a folder with a plus at the middle.

Step 2
Fill in the name and leave every other option as default. >> Hit Create.

That is all for creating a Google site with an option to upload Songs. Next is to start uploading your music files.

Uploading Music Files

On the new page, you will see an option to “ADD FILES” hit it and upload your music file from your computer. 

After uploading, locate the download icon next to the delete icon. Right click on it and “copy link address”. To test it, paste the link in a browser and it will start downloading the music file immediately.

  1. How To Properly Add Google Font To Blogger Without Affecting PageSpeed
  2. How To Show Only Post Title In Blogger Mobile Template

Now paste the link in a notepad.

What will I do with the link? – continue reading!.

Add Music File With Download Button

You can easily add the download link directly to your blogger post editor using plain links. But download buttons look better.

Adding Download Button CSS

Go to Themes >> Edit HTML >> Using CTRL + F search for </head> and paste the below CSS code just above it. Save when done.

.BPdownloadbutton{display:inline-block;border-radius:4px;background-color:#000;border:none;color:#FFFFFF;text-align:center;font-size:28px;padding:20px;width:200px;transition:all 0.5s;cursor:pointer;margin:5px;vertical-align:middle;text-decoration:none}
a.BPdownloadbutton{cursor:pointer;display:inline-block;position:relative;transition:0.5s}
a.BPdownloadbutton:hover{padding:25px;box-shadow:0 12px 16px 0 rgba(0,0,0,0.24),0 17px 50px 0 rgba(0,0,0,0.19)}
.Bpdownload{width:210px!important;height:84px!important;margin:0 auto!important;margin-top:10px;margin-bottom:10px}

Method 1 Of Adding File To Blogger

Go to post editor, switch to HTML, paste the below code inside the box.

<div class=”Bpdownload”>
<a class=”BPdownloadbutton” href=”MUSIC LINK” target=”_blank”>Download mp3</a>
</div>

Replace MUSIC LINK with the link you copied earlier. Publish the post and you should see it working.

Method 2 Of Adding MP3 File To Blogger

In your post editor, at the sidebar locate “Options” >> “Compose mode” >> Tick “Interpret typed HTML”.

Paste the below line of codes anywhere in the post body, and don’t forget to replace MUSIC LINK with the link you copied earlier.

<div class=”Bpdownload”>
<a class=”BPdownloadbutton” href=”MUSIC LINK” target=”_blank”>Download mp3</a>
</div>

What Next?
Whenever you want to upload song files to blogger, go to www.sites.google.com and you would see your Google site name shown>> after clicking, on the next page, select your folder >> You would see all your uploaded media files.

Locate “Add File” click it and upload your songs.

This is one of the easy ways to upload media files, music files, songs files or MP3 files to blogger with a download button. If you find it hard to understand, leave a feedback below.

Sharing is caring!.

Related Articles

19 Comments - Post Yours! How to? ▼

hello
  1. Thanks man, worked well… Your awesome…

    Commenting from Entspaded.blogspot.com

  2. Welcome. Am glad it worked.

  3. Welcome Rathor .. am glad it helped.

  4. beatyfully explained

  5. tahnks i can use it in my blog

    Rajo festival

  6. Anonymous says:

    Hey brother thanks for the post. Can I upload my own song there and make it Download able by other people?

  7. Worked on my Blog

  8. Olusanya Temitope says:

    Implemented it on my Gosple blog and it worked perfectly. Thank you.

  9. ayosunla says:

    Tnks man visit ayosunla.blogspot.com

  10. I don’t get the explaination

  11. omo your blog really make sense, i have learned a lot from you, nice blog, how i wish i can make mine like yours cheers mehn

    • lol.. Thanks for the compliment bro..

      the fact is we all have our space and if we work hard, our space will be glorified.

      we just have to work bro.. I once envied lot of bloggers and today I believe am getting there.


Leave a Reply