I’m currently using a Shopify theme and I want a YouTube video to start playing automatically when someone visits my site. I have the video URL set up in my JSON configuration like this:
I have tried appending ‘?autoplay=1’ to the YouTube link, but it hasn’t worked. Can anyone provide some guidance on how to make the video play as soon as the page loads?
Hit this same issue on a client project months ago - wasted way too much time debugging it. The parameter syntax fixes above are spot on, but here’s what nobody mentions: mobile performance gets wrecked. Autoplay starts downloading video immediately, which kills page load speeds on mobile. I ended up using a hybrid approach - check connection speed with the Network Information API and only autoplay on fast connections. Slow connections or mobile users get a static poster image instead. Just check navigator.connection.effectiveType and only add autoplay if it’s 4g. Desktop users with good connections get the autoplay experience, mobile stays smooth.
Had this exact problem last month. Luna’s right about the autoplay parameter placement, but there’s another issue - browsers are way stricter about autoplay now. Chrome and Safari block it unless users have clicked around your site first. I switched to a click-to-play overlay since autoplay’s unreliable across browsers and devices. If you really need autoplay, use YouTube’s Player API to catch when it fails and show a play button instead. Also check if your theme’s CSP headers are blocking autoplay.
You’re right about those parameter fixes, but there’s more to it. YouTube blocks autoplay if users haven’t interacted with your site before - doesn’t matter if your code’s perfect. Found this out the hard way when a client’s homepage video worked great in testing but bombed for new visitors. Fixed it by using YouTube’s iframe API to catch autoplay failures and switch to a poster image with a play button instead. Also heads up - autoplay videos can tank your Core Web Vitals, especially Largest Contentful Paint. That’ll hurt your SEO and conversions. Check PageSpeed Insights after you implement this.
Browser policies are one thing, but you might be hitting another technical issue. Your allow="autoplay; encrypted-media" attribute needs to be more specific. Change it to allow="autoplay; fullscreen; encrypted-media" and add the autoplay attribute directly to the iframe tag. Some Shopify themes have JavaScript that messes with video autoplay - especially if there’s lazy loading or intersection observers running. Check your theme’s main JS file for any video functions that might override the autoplay behavior. Here’s a workaround that worked for me: wrap the iframe in a div with data-autoplay="true" and handle it with custom JavaScript after DOM load.
Had this exact same headache before. Yeah, you can fix the iframe parameters like everyone’s saying, but manually managing all these video integrations gets annoying fast.
I built an automation with Latenode that handles this whole thing. It watches my Shopify store, catches new video content automatically, and optimizes all the YouTube embed parameters. Even adjusts autoplay based on what browser and device people are using.
Best part? When autoplay gets blocked, it switches to a custom thumbnail with a play button overlay. No more wondering if your videos will actually work.
It also tracks which videos convert best and rotates featured ones based on performance data. Takes 10 minutes to set up, then it’s hands-off.
honestly the autoplay thing is kinda annoying for users anyway. ive seen way better engagement when i just use a nice thumbnail with a play overlay instead. but if u really want it, try adding &rel=0&controls=0 too - sometimes helps with the autoplay trigger
you need &autoplay=1 not ?autoplay=1 since there’s already parameters in the url. also throw in &mute=1 - most browsers won’t autoplay unless it’s muted. your iframe src should look like ...embed/{{id}}?enablejsapi=1&autoplay=1&mute=1