How to remove video play button's auto appearance on mobile?

Store Design
, , ,
1

Right now, upon entering the landing page, the video at the top will be overlayed with this layer of controls like the play and skip 10 seconds buttons, how can I make it so it doesn’t appear upon landing on the landing page like my desktop version is currently doing.

Any idea which area’s code I should check?
How can I make the controls not appear upon landing?

Thank you all so much!

IMG_9839.jpg
IMG_9839.jpg1284×903 120 KB

2

Hey @nondualreality ,

Can you share the link to your store?

3

www.kidkartz.com

4

Hey @nondualreality ,

Could you go to the Theme Customizer and replace the video section with a Custom Liquid Section

ThePrimeWeb_0-1706457018162.png
ThePrimeWeb_0-1706457018162.png558×524 29.9 KB

And in the liquid code add the following

ThePrimeWeb_1-1706457042440.png
ThePrimeWeb_1-1706457042440.png290×474 15.6 KB

Then scroll down to Custom CSS and type the following

ThePrimeWeb_2-1706457293445.png
ThePrimeWeb_2-1706457293445.png285×845 28 KB

video {
  width: 100%;
}
5

IMG_9843.png
IMG_9843.png1284×2778 210 KB

thank you so much for your speedy reply. I just tried it out and immediately a notification says something is wrong pop up. I still saved it and refreshed my page to see what would happen and the video does not seem to play automatically, but it’s good that there is no play unpause buttons anymore!

6

Hey @nondualreality ,

Good to hear, Can I also see what you pasted in the custom liquid section?

You can try the below and see if it autoplays as well.
7

Oh my gosh it worked! I love you! You are good!