Autoplay background music when someone visits your site is impressive but the autoplay function also helps to different advertisement networks. Google thinks that autoplay is out of control over the user or visitor side.
{tocify} $title={Table of Contents}
The different advertisement uses autoplay to display advertisement in autoplay video format which annoy many visitors. So due to this google change, the autoplay policy and many other browsers also follow the google chrome autoplay policy. So autoplay not working even in HTML.
Demo
Please update your browser does not support the audio element.
Why Audio AutoPlay Not Working?
The main reason behind audio autoplay not working is the Google Chrome Autoplay Policy. In April 2018 Google Chrome strictly implemented the Autoplay policy. Check out what is on Google Chrome Policy.
Link:{getButton} $text={Google Drive Link} $icon={link} $color={#0095ff}
If you don't understand I will explain it briefly.
Chrome's autoplay policies
- Muted autoplay is always allowed.
- Autoplay with sound is allowed if:
- User has interacted with the domain [click, tap, etc.].
- On desktop, the user's Media Engagement Index threshold has been crossed, meaning the user has previously played video with sound.
- The user has added the site to their home screen on mobile or installed the PWA on desktop.
- Top frames can delegate autoplay permission to their iframes to allow autoplay with sound.
Let's explain from point 1.
Muted autoplay is always allowed
Muted autoplay is always allowed means that if you add a muted attribute or if you mute your autoplay audio/video then the autoplay works perfectly without any issue.
Autoplay with sound is allowed
There are three points. let's describe it.
User has interacted with the domain:Whenever a user clicks or came from the same domain autoplay works.
I am going to use this point to autoplay the audio.
Other Points: You can easily understand others' points. Let's go for the solution.
Also Read:How to add Table of content in blogger {alertInfo}
Solution
As I already said I am going to use the second point that I am taking user permission to autoplay audio. Let's move towards the solution with a stepwise process.
Video Tutorial
coming soon
Steps To Fix Audio Autoplay Not Working
Here is the stepwise process to fix autoplay not working for all browsers. First, you need to add the audio tag with audio on normally. You need to create an audio player normally.
Also Read: How To Add Audio Files/Mp3 On Blogger {alertInfo}
Step 1: Add Audio Player
Normally, you can use the below code to add the audio player with an audio file on it.
Code
Please update your browser does not support the audio element.{codeBox}
Step 2: Ask Permission
We are using user permission to autoplay audio in blogger or any website. For that, you need to paste the below javascript code on the post that you want audio autoplay.
function autoplay[]{var r =confirm["Would You Like To AutoPlay Music?"];if [r == true] {document.getElementById["audio"].play[];}}autoplay[]; {codeBox}
Done. Now the autoplay works 100% as it also follows google audio autoplay policy.
Overview
Also, you can change the question according to your wish.
Conclusion
This is how you can easily fix audio autoplay not working in a browser. I hope you like this solution and comment below if you have any problems.