Embedded YouTube videos won't start playing on my website

I’m having trouble with YouTube videos not working on my website

I embedded some YouTube videos on my site but they just won’t play when visitors click on them. The videos show up fine and you can see the thumbnail, but clicking the play button does nothing.

I’ve already tried a bunch of different things to fix this:

  • Cleared my browser cache completely
  • Tested it in Chrome, Firefox, and Safari
  • Double checked my HTML embed code
  • Made sure the video URLs are correct
  • Tried different YouTube videos to see if it was just one specific video

The embed code looks something like this:

<iframe width="560" height="315" 
  src="https://www.youtube.com/embed/VIDEO_ID" 
  frameborder="0" 
  allowfullscreen>
</iframe>

I’m really stuck here and not sure what else to try. Has anyone else run into this issue before? What could be causing YouTube embeds to not play properly?

This sounds like a referrer policy issue blocking YouTube’s player. I ran into the same thing on a corporate site where the policy was too strict. Add referrerpolicy="no-referrer-when-downgrade" to your iframe tag.

Could also be your hosting provider or CDN blocking external content. I’ve seen CSS conflicts mess with YouTube’s overlay controls too - check if you’ve got global CSS rules hitting iframes or video elements that might stop click events from reaching the player.

Had the same issue about six months ago - turned out to be a Content Security Policy problem. If you’ve got CSP headers set up, they might be blocking the YouTube iframe. Check your server config or any security plugins you’re running. Could also be that your site’s on HTTPS but the YouTube embed’s still using HTTP. Try updating your embed src to https://www.youtube.com/embed/VIDEO_ID and see if that fixes it. Also check your browser console for JavaScript errors when you try playing the video - sometimes conflicting scripts mess with YouTube’s player.

sounds like a javascript conflict or z-index problem. I’ve seen this where invisible elements get layered over the youtube player and block clicks. try adding position: relative; z-index: 999; to your iframe css, or temporarily disable other scripts to see if that’s the culprit.

Sounds like a third-party cookie issue. Most browsers block these by default now, which breaks YouTube embeds. Videos load but won’t play when you click them - ran into this exact thing on a client site last month. Try adding allow="autoplay; encrypted-media" to your iframe and make sure cookies aren’t blocked. You can also swap youtube.com for youtube-nocookie.com in your embed URL. Check if you’ve got any custom JavaScript that might mess with YouTube’s player - sometimes scripts conflict with their API.

check for ad blockers or browser extensions - they sometimes block youtube embeds even when they should work. also try adding allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" to your iframe tag. fixed the same issue for me last year.