All things Shopify and commerce
*Repost because there is no solution yet. Deleting "mute" code does not work, changing it to "unmute or unmuted" doesn't work. Give e the right code that works for my needs please!! Someone with code knowledge!! Can somebody please help me get my video to auto play unmuted and looped. How can I get the video to play with audio automatically without someone needing to toggle on? If this isn't possible I will be surprise, but if it isn't please suggest the solution to have controls to unmute it then. But that is last resort. I want this to autopay, looped, unmuted. Please try to use the code below if possible, it is the only one that is showing visuals for desktop and mobile versions for me.
Here is the code I am using for custom liquid on my about us page on the online store that works with desktop and mobile as far as the visuals showing up:
<<style>
video {
width: 100%;
height: auto;
display: block;
margin: 0 auto;
}
</style>
<video autoplay playsinline loop muted>
<source src="" type="video/mp4">
</video>
Here is the link to my website where the video isn't playing with audio: https://thewebwizardz.com/pages/about-us
Solved! Go to the solution
This is an accepted solution.
Hey @Bradley21,
This is a browser violation. Technically, the only way to remove the "muted" property and have the video autoplay is only if:
1. The user has interacted with the website (click, tap, etc.)
2. On desktop, the user's Media Engagement Index threshold has been crossed, meaning the user has previously played video with sound.
There's a few more you can read here: https://developer.chrome.com/blog/autoplay
Also, if by any chance you are about to say "I've seen some sites do it", Google also reviews sites so that some sites are allowed to have it if google deems it to be safe. These safety features are added because you don't want someone going into a site in public with their volume full and have an adult video play out for the entire public to hear. (Example)
Even if you do manage to get on Google's good side, unmuted autoplay will only be allowed on desktop. Mobile is always disabled by the browser.
You should enable controls on the video so that the user can unmute the video.
Code: (Added 'controls' attribute)
<video autoplay controls playsinline loop muted>
<source src="" type="video/mp4">
</video>
There are hacks that I used to do years ago, I am not sure if they work now, but when you index your site and google finds out, you'll be heavily penalised and you'll have to start your business all over again with a new domain. Don't try it, not worth it.
This is an accepted solution.
Hey @Bradley21,
This is a browser violation. Technically, the only way to remove the "muted" property and have the video autoplay is only if:
1. The user has interacted with the website (click, tap, etc.)
2. On desktop, the user's Media Engagement Index threshold has been crossed, meaning the user has previously played video with sound.
There's a few more you can read here: https://developer.chrome.com/blog/autoplay
Also, if by any chance you are about to say "I've seen some sites do it", Google also reviews sites so that some sites are allowed to have it if google deems it to be safe. These safety features are added because you don't want someone going into a site in public with their volume full and have an adult video play out for the entire public to hear. (Example)
Even if you do manage to get on Google's good side, unmuted autoplay will only be allowed on desktop. Mobile is always disabled by the browser.
You should enable controls on the video so that the user can unmute the video.
Code: (Added 'controls' attribute)
<video autoplay controls playsinline loop muted>
<source src="" type="video/mp4">
</video>
There are hacks that I used to do years ago, I am not sure if they work now, but when you index your site and google finds out, you'll be heavily penalised and you'll have to start your business all over again with a new domain. Don't try it, not worth it.
You have the level of communication I was looking for, thank you so much honestly! God Bless!
By investing 30 minutes of your time, you can unlock the potential for increased sales,...
By Jacqui Sep 11, 2024We appreciate the diverse ways you participate in and engage with the Shopify Communi...
By JasonH Sep 9, 2024Thanks to everyone who participated in our AMA with 2H Media: Marketing Your Shopify St...
By Jacqui Sep 6, 2024