Blogger is one of the CMS platforms but there are a lot of drawbacks on blogger. You cannot upload an audio file or an mp3 file on the blogger. But today I will teach you the best 2 methods to embed or add audio to the blogger. Today you will be going to learn how to upload mp3 on blogger.

I will be going to explain two methods to embed your audio file to blogger easily in few steps. But before I get started let's show you a small demo that I embed audio on blogger post.




Demo





–––––––––––––––––––––––––––––– On The Line (Instrumental) by SilentCrafter https://soundcloud.com/user-907904720 Creative Commons — Attribution-ShareAlike 3.0 Unported — CC BY-SA 3.0 Free Download / Stream: https://bit.ly/silentcrafter-on-the-line Music promoted by Audio Library https://youtu.be/XsH4ktwozrs –––––––––––––––––––––––––––––– 🎵 Track Info: Title: On The Line (Instrumental) by SilentCrafter Genre and Mood: Dance & Electronic + Happy ———


I think audio embedding on site won't get me copyright calm. So I use audio directly from youtube.


Video Tutorial





Let's start with the things that we required.


Things Required



  • Blogger site.
  • Sites.Google.
  • Some free hosting provider.
  • Simple HTML Code.
  • Music File in mp3 format or obb format.


I already told you that today I am going to show you two methods to add audio files to blogger.


First Method to add mp3 player to blogger


Here we are using sites.google.If you don't know you can create a free site using sites.google in lifetime hosting. But you cannot use google ads on this type of site.

Let's move forward to the process of embedding mp3 or audio to blogger.

Step1:Go to sites.google.com.

Link: Click Me




add audio to blogger



Step2: You will redirect to those types of screens. Then at the bottom, you will see Classic Sites, Click on "Classic Sites".


add audio to blogger



Step3: You will be going to see this type of site.


add audio to blogger



Step4: At the left side click on "create".


add audio to blogger



Step5: Now, click on "classic sites".


add audio to blogger


Step6: Now again you will see this type of screen. Just follow me.




add audio to blogger




Step7: Fill the blanks with your site name (fill anything) and hit on "create site".



how to add mp3 player to blogger


Step8: Now, on the right side you see a button to create a page, click on it.



how to add mp3 player to blogger


Step9: Now you redirect to this screen,its's time to create a page.

how to add mp3 player to blogger


 Step10: Name your page anything and hit "create".



how to add mp3 player to blogger


Step11: Then you redirect to this page.

how to add mp3 player to blogger


Step12: Click on "ADD FILES".



how to add mp3 player to blogger



Step13: Now select your music file to upload.


add audio player to blogger




Step14: Now your file is uploading wait for it.



add audio player to blogger


Step15: After uploaded, click on "save" at the top.




add audio player to blogger








Step16: Now, right-click to the download button and click on the "copy link address".


add audio player to blogger



Step17: Let's go to the blogger post where you want to insert an audio file . Switch to the HTML mode.


add audio player to blogger



Step18: Then copy the code below and paste it to a blogger at first.
Code:

<audio controls>  <source src="replace with your copied url" type="audio/mpeg">
Please update your browser does not support the audio element.</audio> code-box



add audio player to blogger



Step19: Paste the code we take from the sites.google.com.Like in the example below between the [src " " ].


how to add audio file to blogger post


Step20: Publish your post now you will see working music player to blogger like below. 


how to add audio file to blogger post






 Second method to add mp3 or audio to blogger



 We upload mp3 audio on blogger with the help of sites.google.com at the first method but some of you may have problem so you can follow this second method to embed audio files to blogger.

If you don't know then I will tell you there are a lot of free hosting providers in the market. Today in this method we need Webhosting. I am using 000webhost.com for our tutorial.

Let's start with the stepwise process.

Step1: Go to the 000webhosting or link below.
Link: Click Me.



how to add audio file to blogger post


Step2: You will see the site like above , then at the right side click on the "sign-in ".


how to add audio file to blogger post

Step3: Sign-in using anythings.I use google to sign.



add audio to blogger




Step4: Skip some steps choosing anything and at this step click on "submit" without doing anything.



add audio to blogger


Step5: Now you redirect to this screen, click on "upload your site".



add audio to blogger



Step6: After that you are at the 000webhost dashboard . Click on the "Manage Website".


add audio to blogger



Step7: You redirect to this dashboard at the left side, click on the "Tools".



add audio to blogger



Step8: Then click on "File Manager" .





Step9: You will be going to see the upload button, click on "Upload Files".



how to add audio file to blogger post




Step10: Now to this site of the file manager. 


how to add audio file to blogger post

Step11: Open "public_html" folder.



how to add audio file to blogger post


Step12: At the top click on the upload button.


how to add audio file to blogger post

Step13: Then click on the "select files".




how to add audio file to blogger post


Step14: After selecting mp3 files hit on the upload button to upload your mp3 audio file.



how to add audio file to blogger post


Step15: You can see my audio file is successfully uploaded.

how to add audio file to blogger post



Step16: Now right-click on the audio file in my case I got "demo.mp3" and hit on the "view" .



how to add audio file to blogger post



Step17: Copy the URL of that file at the top.


How to upload mp3 on blogger


Step18: Now go to the blogger screen and there replace your site.google.com link with your copied link as the example below.
Code:
<audio controls>
  <source src="replace with your copied url" type="audio/mpeg">
Please update your browser does not support the audio element.
</audio> code-box




How to upload mp3 on blogger


Step19: Publish your blog post you will going to see the working music player to your post.

How to upload mp3 on blogger


Try it. It works perfectly.


Upgrade Responsive Audio Player To Blogger

First, replace the below code:


<audio controls="" style="width: 100%;"><source src="https://sites.google.com/site/musicstorenepali/musicstore/demo.mp3?attredirects=0&amp;d=1" type="audio/mpeg"></source> Please update your browser does not support the audio element.</audio> code-box


FAQs


1. How do I upload an mp3 file to Blogger?
You need to use either sites.google.com or free Webhosting to upload an mp3 file to your blogger.

2. How to add audio or mp3 in blogger post?
Create a classic site to google site and add your mp3 file then embed audio file to blogger.

3. How to add mp3 player to blogger?
To add mp3 player to blogger you need the source of audio and the audio HTML code to embed to your blog post.

4. How to add audio file to blogger post?
Blogger does not have any option to add audio so we need to embed audio using HTML code.


Conclusion


If you are searching for the music player for your lyrics or music blogger then you may get my post helpful. If you think it was a helpful comment below and suggest more to motivate me to bring this type of content for blogger.

Today I hope I teach you how to upload mp3 on blogger or add mp3 to blogger with the stepwise process.



Post a Comment

Previous Post Next Post