Html code for auto playing embedded YouTube video

Technical Q&A
1

Hi, I’ve been having trouble with my video liquid code. I want my video to autoplay in the background with out sound when someone navigates to that page, but it will not work. I’ve seen this work on other website and I’ve asked coder friends of mine to try to fix it for me but they don’t know why it isn’t working. Can someone help me with the code I need to use to allow autoplay without sound? This is what it is right now with Dawn theme:

{%- if section.settings.video_url.type == ‘youtube’ -%}

{%- else -%}
2

Try the following, I added mute=1

{%- if section.settings.video_url.type == 'youtube' -%}
<iframe src="https://www.youtube.com/embed/{{ video_id }}?enablejsapi=1&autoplay=1&mute=1&rel=0{{ loop }}" class="js-youtube" allow="autoplay; encrypted-media" allowfullscreen="" title="{{ section.settings.description | escape }}"></iframe>
{%- else -%}
3

Yeah, I’ve tried that but it still doesn’t autoplay in the background until you hit the “play botton” and it will play muted until you manually unmute it. I’ve also noticed with embedding via YouTube, no video preview shows up on my screen, and I don’t want to use a picture. I’ve opened other browsers and private tabs to make sure it’s not browser related but still no video preview. I ended up using the Shopify-hosted feature because at least it shows a preview of my video, but still will not autoplay muted. I’m not stoked on this option because it will slow down my website speed. Any other tricks I can try to make it autoplay muted in either option? Idk why Shopify doesn’t have a button to choose this autoplay feature.