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

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.
How To Upload Songs (MP3 Files) On A Blogger Blog With Download Button
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.
upload mp3 files to blogger
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 organize 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.
create music folder for blogger
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. 
upload song to blogspot
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.

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".
blogger download button
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!.

6 Comments

All comments are moderated. Read Commenting Terms And Conditions.

Previous Post Next Post