How to Add an mp3 Audio player in Blogger | Upload Mp3 file in Blogger (Updated )
HTML-код
- Опубликовано: 12 сен 2024
- In this video, I will show you how you can add an Mp3 audio player to the Blogger website. Here, I have prepared 3 different styled audio players using HTML & CSS only.
As you know we don't have an option to upload mp3 audio in blogger, that's why we need to host the audio file in third-party storage like Google Drive. (Not working properly in 2024)
👉👉 Updated Audio Player for Blogger : • How to Add HTML MP3 Au... (Working in 2024)
After watching this video, you will be able to add an audio file in blogger. Here, you will learn how to add a card-style responsive audio player in Blogger.
✅ Previously I made a video on a simple HTML 5 Audio player which you can watch here. • How To Add Audio File ...
Here, I have explained how to set the audio player to autoplay, mute, loop, and other properties of the audio tag.
This is the updated version of that, where you can add the image, audio file name, artist name, and a short description of the audio.
✅ Download the codes: www.techyleaf....
Google Drive Direct Link Generator: www.techyleaf....
Watch More
----------------------
✅ Responsive HTML table: • How to Add a Responsiv...
✅ Useful Chrome extensions: • 11 Best Chrome Extensi...
✅ Pros and cons Table: • How to Add a Pros and ...
✅ Customize Blogger theme: • How to Customize Blogg...
Social Media
---------------------------------------------------
► Twitter: / key2blogging
► Telegram: t.me/techyleaf...
► Pinterest: / abhishekpadhi666
► Blog: key2blogging.com
Gear I Use
---------------------------------------------------
🎤 Mic: amzn.to/3tOnN7Q
🐁 Wireless mouse: amzn.to/3uP9DVB
⌨ Keyboard: amzn.to/3fk0MVc
Don't forget to Like & Subscribe #key2blogging for more videos like this.
#blogger #audioplayer #html #CSS
👉👉Updated Audio Player for Blogger : ruclips.net/video/DZc1ZuIcr1s/видео.html (Working in 2024)
👉👉How to Remove Download option from HTML Audio Player: ruclips.net/video/8z3MKBRpw68/видео.html
Thank you so much.. You are doing a great job! Good luck with your channel.
Welcome 🙂
J'ai oublié de vous dire, que le lecteur parait sur mon blog blogger, mais il est bloqué, rien ne fonctionne.
Really helpful ❤️
Glad it was helpful!
Sabas bro...
How to give image url or imag adress?
Thank you bro..
Very useful video.....
Thanks again
You are welcome 🙂
"Error in the code snippet, audio is not displaying."
good information thank you
Help me.
Bro, I want to add audio player file more than 4. How can I add, please help me.
image link kaise laga thi hai
how to auto stop when other song play thank you for Great post
Thank You, brother. I use your code with captions. I have changed the audio ID only and the caption words. I haven't used any direct link generator. It workd on Mobile but the audios are not available on a desktop browser. What could be the problem
Hey, sometimes the audio player doesn't work in desktop, it happens with chrome sometimes, browser problem
@@Key2Blogging how to add multiple songs ? i tried copying code and repeating but the second one couldnt render the song from my drive
thanks
How can I add multiple song making a playlist in place of a single song ?
how to auto stop when other song play
Please make a video with lyrics as like gaana app
Nice video👍🏾.. How can I remove the download button and replace it with replay button??
I didn't understand, reply button in mp3 player ???
@@Key2Blogging I mean the loop button. I don't want the audio or song to be downloadable so how can I remove the download option and replace it with the loop button. Thanks
Amazing and most useful video my dear sir...
And sir can you please tell me this theme name? 😍
It is Fletro pro theme
Thanks sir..aur sir
Can you please make a video how to customise Fletro pro or median UI theme for a music download website..😍😍
Using this html codes
You can add this code in blog posts or in the homepage using the html/javascript widgets.
Just add the widget where you want to show the audio player.
downloding problem plz guid us.. downlod error
Hi, Its working on PC, but in mobile its not playing.
Not working on phone
Thank you mate , but there is a problème when i put my audiofile link from gdrive ( direct link ), MEGA or other hosters i can’t play audio also is there any solution to disable download button from player thank you again.
I have given the download button solution in this article www.techyleaf.in/2021/06/how-to-add-audio-file-to-blogger.html
Bro, I want to talk with you, need your help🙏🙏
It does not work.
Can you will please suggest me best free theme for ringtone website...??
Please
You can consider any theme from Templateify like Newspeed, freebify or new ones..
if want to change the image then where to upload the image to get its URL ??
Create a new page or post and upload the image and then right click on it and copy image URL.
No need to publish the page.
@@Key2Blogging thanks :)
Audio player ko Home page pare kaise lagaya
Use the custom html / javascript widgets to add in homepage
@@Key2Blogging sir ye audio player Ko Home Page par kaise laga sakte hai mujhe ringtone download website banai hai blogger me
Please 🙏 Sir video bana do short video bhia chal jayega
Me coding nahi Jantaa hu sir
Hey, contact me on Telegram, so I can guide you how to do that
Bro do you have other audio player script....?
I have designed this three and a simple basic one i have posted a video earlier.
but how we add our own voice in it
Record the audio and upload it to Google drive and use the link...
@@Key2Blogging thank you so much
hey bro, can i use youtube link instead of Google drive link bcz i want to convert youtube video in audio, how can i ??
Actually i don't know how to get the link of only the audio part of a RUclips video.
Please thus it work for only this theme?
It worked for all themes. Unless some theme CSS code interfere the audio player.
@@Key2Blogging ok it does not appear like yours in my theme thus why
@@Key2Blogging can you help me please
Send me the screenshot in Telegram, so I can check what is the issue
Ok
THX but how image
what is the problem with image ?
@@Key2Blogging where to upload the image to get its URL ??
Music not support
You have to modify the drive link as shown in the video, otherwise it will not work
@@Key2Blogging how to add own song url.i was add in RUclips song but not support
You have to convert the RUclips link to an mp3 link, ask me in telegram and i will help you in that.
@@Key2Blogging ok bro how to RUclips link convert mp3
Check telegram
Sir how to change text color?
You mean text color of paragraph used in the music player
@@Key2Blogging song name and singer text
.HTML_Audio_player a{
color: black;
}
Add this css code above the closing style tag and change the color name or use a hex code in it.