Want this video to be autoplay, its working on android devices but not on apple devices..
Link: https://thebadlies.com/
Topic summary
A user is experiencing an issue where a video on their Shopify store (thebadlies.com) autoplays on Android devices but not on Apple/iOS devices.
Required Solution:
Multiple respondents confirm that iOS requires specific HTML video attributes for autoplay to work:
autoplaymuted(mandatory for iOS)playsinlinelooppreload="metadata"
The recommended video tag format is:
<video playsinline autoplay muted loop preload="metadata">
Implementation Challenge:
The user identifies as a complete beginner and is unsure where to add these attributes. The video section is located in sections/video.liquid, but the theme automatically generates the video tag, meaning custom code modifications are needed rather than simple attribute additions.
Suggested Next Steps:
- One respondent suggests adding custom code above the
</body>tag intheme.liquid - Others recommend contacting the original developer who set up the store or hiring another developer for assistance
Status: Unresolved - the user still needs guidance on implementing the technical solution.
Hello @Emiway1 ,
Video should have all these attributes
If problem solved don't forget to Like it and Mark it as Solution!
And if you need help with customization/code part you can contact me for services
You can find the email in the signature below.
ThanksWhere to add this?
Use the Right Attributes: Ensure your video element includes the autoplay, muted, and playsinline attributes. This is crucial since iOS devices require videos to be muted for autoplay to function properly.
**>**
You need to verify whether the necessary attributes are correctly added to this video section. If they are not present, please add them.
Already available in your code.
You just have to cross check and add if any of them is missing attributes
i am a complete beginner bro, can i know on which file i can find?
I don’t think either I can provide instruction for it and either you can follow them.
btw I suggest calling the person who did the setup of the whole store for you. Alternatively you need to go with another developer.
Where to add this code?
Could you please provide a screenshot of the customization so I can identify which section you are using? If you’re utilizing the video section, you’ll need to open the Edit Code and locate that section first. Additionally, please share a screenshot of the video section code so I can review it.
@Selfiiee Section is sections → video.liquid
but this theme code generate this video tag automatically.
Means you need to alter the default code with a custom one.
yes its Video.liquid