How to insert audio player in blogger post?

HTML Audio Player





 I'll walk you through the process of uploading audio files to Blogger and setting them to play manually in this post. Users can simply adjust the volume, control media playback, and even download audio files using this method.


You can add audio files to Blogger in different ways. Here in this article i will guide you through one such simple and popular method i.e, the audio tag method.


How to add an mp3 audio player in Blogger?

You must first host the mp3 file in cloud storage before adding it using one of the methods in order to add an audio file to Blogger. 

Method-: HTML Audio tag


With HTML audio tag, you can include an audio file in Blogger with a download option. This approach gives the audio player a polished, understated appearance.


#1: First copy the below HTML code.

<audio controls>

  <source src="https://drive.google.com/uc?export=download&id=1blUyIowvHpBEAGuPwqJTBnYP0IxkSZl4" type="audio/mpeg"/>

</audio>

#2: Now paste the code in your blog keeping HTML view. 

#3: Now copy the Mp3 file link from Google Drive.

#4: Then replace Url of the code with Url of Mp3 copied from Drive.

#5: Finally hit Publish button and see.


To copy link of Mp3 file from Google Drive.

 See: How to copy link of Mp3 file from Google Drive?


Note: If the Google Drive Link is not working then you can use other cloud storage Like GitHub to store your Mp3 files and use that as a source Link.


Read also: How to add HTML scroll box in your blog?

That is Great! You have now a HTML Audio Player to be inserted that will appear in your blog to be played and mp3 downloaded, when your blog is visited. Please feel free to leave any constructive feedback, suggestions or questions in the comments and I'll get back to you as quick as I can with concrete solutions. Want to know more about blog writing, please mention. I will make a tutorial on. 


Thankyou
BashTec



Post a Comment

Previous Post Next Post