How can I autoplay a video using the new embed code style for Youtube?

Question

I can't work out how to autoplay a video using the new embed code style for Youtube. I tried adding &autoplay=1 to the url, which worked with the old style, but it didn't work. For example, http://www.youtube.com/embed/JW5meKfy3fY is the embed link, but http://www.youtube.com/embed/JW5meKfy3fY&autoplay=1 doesn't work. Can anyone tell me how to do it? Thanks

This is outdated. 'mute=1' is required now. See: [Answering StackOverflow Article](https://stackoverflow.com/questions/51230411/youtube-embedded-video-autoplay) — Trevor, Oct 11 '18 at 16:27
Yes, I needed to add ?autoplay=1&mute=1 for autoplay to work in chrome. Thanks — john blair, Sep 23 '19 at 09:33
So just to be clear, chrome will only allow autoplay if the video is muted? There is no way to force autoplay with the sound on? — webrightnow, Oct 24 '19 at 17:36

score 397 · Accepted Answer · edited Nov 13 '22 at 08:51

397

Just put ?autoplay=1 in the url the video will autoload.

So your url would be: http://www.youtube.com/embed/JW5meKfy3fY?autoplay=1.

In case you wanna disable autoplay, just change from 1 to 0: ?autoplay=0.

If you embed the Youtube video in an iframe, you need to add allow="autoplay" to the HTML. Example: <iframe src="http://www.youtube.com/embed/JW5meKfy3fY?autoplay=1" allow="autoplay"></iframe>

edited Nov 13 '22 at 08:51

Avatar

14,622
9
119
198

answered Aug 08 '10 at 06:16

matthewbauer

4,314
1
17
22

14

This doesn't appear to work as of right now. It worked perfectly 1 week ago. – Peeja Feb 18 '14 at 15:36
Hmm, looks like this might be an extension on my Chrome that updated in the last week. Ignore that comment. :) – Peeja Feb 18 '14 at 15:45
26

The first parameter after the video ID needs to start with "?" ,all parameters AFTER that needs to be added with "&". If you had for example "?rel=0&autoplay=1" it would be the same as "?autoplay=1&rel=0" and they would both work. – Thanos Feb 21 '14 at 01:34
9

This answer still works 2016. Just adding the info, since it's the first result that pops up on google. – Florian Rachor Jan 28 '16 at 10:06
2

Some additional explanation since this is so high in the goog results. The part of the URL following '?' is the Query String and what you need is the 'autoplay' key with value '1'. So for example, '.../embed/JW5meKfy3fY?autoplay=1?rel=1' would also be wrong because then you would have 'autoplay' with value '1?rel=1'. The Query String begins with '?' and is separated into key=value pairs by the '&' symbol. https://en.wikipedia.org/wiki/Query_string#Structure – knickum Jan 31 '17 at 19:35
12

**Update for 2017:** Now in iframe need add one more conf: allow="autoplay" acording to https://developers.google.com/web/updates/2017/09/autoplay-policy-changes so your iframe will loks like: `` – vityapro Aug 26 '19 at 14:15
it's an ordinary answer as I found in the youtube developer forum. but we must include cc_load_policy – MUHAMMAD MUBUSHER ASLAM Jan 08 '20 at 02:52
2

don't work since a youtube update end 2020 – AnnABlue Aug 17 '21 at 18:08
1

it doesn't work with only `autoplay`, but it works with `mute` - &mute=1 – Ares Feb 10 '22 at 20:49
2

it's not working – Siraj Ali Jul 05 '22 at 13:13

Sacha · Answer 2 · 2011-09-23T14:37:19.577

32

Actually, you will have to use the "?" instead of "&" for your first parameter only. If you use more than one parameter, you will then have to add "&" to the chain.

For instance, if you want to add autoplay and closed captioning, you will have to add this portion to your embedded video URL: ?autoplay=1&cc_load_policy=1.

It would look like this:

<iframe width="420" height="315" src="http://www.youtube.com/embed/
oHg5SJYRHA0?autoplay=1&cc_load_policy=1" frameborder="0"
allowfullscreen></iframe>

edited Sep 23 '11 at 14:37

answered Sep 23 '11 at 14:31

Sacha

329
3
3

what do you mean by `closed captioning`? – WasiF Apr 08 '19 at 11:16

score 29 · Answer 3 · answered May 16 '21 at 13:01

29

Chrome blocks audio content being played without any user interaction.

So, a work-around is to start the video muted by adding

&mute=1

This will work 100% of the time.

answered May 16 '21 at 13:01

FacePalm

10,992
5
48
50

It works on Chrome for Desktop. It doesn't work on Chrome for Mobile nor Firefox both Desktop and Mobile. – Ivan Aug 30 '21 at 11:33
"Warning: To prevent unsolicited downloads over cellular networks at the user’s expense, embedded media cannot be played automatically in Safari on iOS — the user always initiates playback." https://developers.google.com/youtube/iframe_api_reference – Yasen Dec 13 '22 at 17:06

score 19 · Answer 4 · answered Nov 05 '18 at 16:23

19

You need to add an extra parameter, alongside the autoplay=1

allow="autoplay"

making it:

<iframe src="your-video-url?rel=0&amp;controls=0&amp;showinfo=0&amp;autoplay=1" frameborder="0" allow="autoplay; encrypted-media"></iframe>

answered Nov 05 '18 at 16:23

Andrew West

576
5
9

1

This is recommended solution for 2020 – Rahul Jun 01 '20 at 19:27

score 6 · Answer 5 · answered Apr 04 '15 at 10:26

The only way I was able to get autoplay to work was to use the iframe player api.

<div id="ytplayer"></div>
<script>
// Load the IFrame Player API code asynchronously.
var tag = document.createElement('script');
tag.src = "https://www.youtube.com/player_api";
var firstScriptTag = document.getElementsByTagName('script')[0];
firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
// Replace the 'ytplayer' element with an <iframe> and
// YouTube player after the API code downloads.
var player;
function onYouTubePlayerAPIReady() {
    player = new YT.Player('ytplayer', {
        height: '480',
        width: '853',
        videoId: 'JW5meKfy3fY',
        playerVars: {
            'autoplay': 1,
            'showinfo': 0,
            'controls': 0
        }
    });
}
</script>

score 6 · Answer 6 · edited Nov 09 '18 at 00:55

Okay this is an example for the new embed code for youtube videos.

<iframe title="YouTube video player" class="youtube-player" type="text/html" width="560" height="345" src="http://www.youtube.com/embed/8v_4O44sfjM" frameborder="0" allowFullScreen></iframe>

if you want to autoplay it, at the src="http://www.youtube.com/embed/8v_4O44sfjM" add the ?autoplay=1 parameter

So the code will look like this:

<iframe title="YouTube video player" class="youtube-player" type="text/html" width="560" height="345" src="http://www.youtube.com/embed/8v_4O44sfjM?autoplay=1" frameborder="0" allowFullScreen></iframe>

i tried this on my blog and it works ! Hope this help (:

score 5 · Answer 7 · edited Jun 11 '15 at 18:40

5

None of the above worked for me in the current youtube embed. Try this, it actually worked for me :)

Hope it helps!

<iframe width="925" height="315" src="https://www.youtube.com/embed/iD5zxjySOzw?rel=0&amp;autoplay=1&amp;controls=0&amp;showinfo=0" frameborder="0" allowfullscreen></iframe>

edited Jun 11 '15 at 18:40

josliber

43,891
12
98
133

answered Jun 11 '15 at 18:32

Kate at Gavin Academy

86
2
6

score 5 · Answer 8 · answered Aug 04 '10 at 12:01

5

YouTube Help says that &autoplay=1 has to be after the video ID - I assume, immediately after.

answered Aug 04 '10 at 12:01

Anton Gogolev

113,561
39
200
288

@Aton: Thanks for your answer. Still doesn't work though. I've updated the question with links. – ben Aug 04 '10 at 12:16

score 4 · Answer 9 · edited Dec 27 '15 at 16:18

4

You are using a wrong url for youtube auto play http://www.youtube.com/embed/JW5meKfy3fY&autoplay=1 this url display youtube id as wholeJW5meKfy3fY&autoplay=1 which youtube rejects to play. we have to pass autoplay variable to youtube, therefore you have to use ? instead of & so your url will be http://www.youtube.com/embed/JW5meKfy3fY?autoplay=1 and your final iframe will be like that.

<iframe src="http://www.youtube.com/embed/xzvScRnF6MU?autoplay=1" width="960" height="447" frameborder="0" allowfullscreen></iframe>

edited Dec 27 '15 at 16:18

Freek de Bruijn

3,552
2
22
28

answered Jan 23 '13 at 17:32

Waheed ur Rehman

765
6
13

1

You forgot to change the `&` to `?` in the right way to do it. (before the iframe) – Dec 22 '15 at 08:43

score 3 · Answer 10 · edited Oct 06 '12 at 14:07

3

Just add ?autoplay=1 after url in embed code, example :

<iframe width="420" height="315" src="http://www.youtube.com/embed/
oHg5SJYRHA0" frameborder="0"></iframe>

Change it to:

<iframe width="420" height="315" src="http://www.youtube.com/embed/
oHg5SJYRHA0?autoplay=1" frameborder="0"></iframe>

edited Oct 06 '12 at 14:07

Uwe Keim

39,551
56
175
291

answered Sep 09 '12 at 13:04

Ajie Kurniyawan

41
1

score 3 · Answer 11 · answered Jun 26 '20 at 07:49

YouTube auto play works only desktop in need to work mobile just make changes in JavaScript. Like

<div id="player"></div>
                    var tag = document.createElement('script');
                    tag.src = "https://www.youtube.com/iframe_api";
                    var firstScriptTag = document.getElementsByTagName('script')[0];
                    firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);
                    var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player('player', {
      videoId: 'VideoID',
      playerVars: {   
            'autoplay': 1,   
            'rel': 0,
            'showinfo': 0,
            'modestbranding': 1,
            'playsinline': 1,
            'showinfo': 0,
            'rel': 0,
            'controls': 0,
            'color':'white',
            'loop': 1,
            'mute':1,
            // 'origin': 'https://meeranblog24x7.blogspot.com/'
      },
      events: {
        'onReady': onPlayerReady,
        // 'onStateChange': onPlayerStateChange
      }
    });
  }
  function onPlayerReady(event) {
    player.playVideo();
    player.mute();
  }var done = false;
  function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.PLAYING && !done) {
      setTimeout(stopVideo, 6000);
      done = true;
    }
  }
  function stopVideo() {
    player.stopVideo();
  }

See More :- YouTube auto play for 5 seconds

This is the solution that worked best for me. I would take it a step further and add a wrapper div `
` and add the responsive css to make the iframe responsive: `.video-container {overflow: hidden;position: relative;width:100%;} .video-container::after {padding-top: 56.25%;display: block;content: '';} .video-container iframe {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}` — nathanielperales, Mar 04 '21 at 22:41

score 3 · Answer 12 · answered Apr 20 '22 at 16:14

It's not working since April of 2018 because Google decided to give greater control of playback to users. You just need to add autoplay=1&mute=1 to your URL. Autoplay Policy Changes

<iframe id="existing-iframe-example"width="640" height="360"
  src="https://www.youtube.com/embed/-SFcIUEvNOQ autoplay=1&mute=1&enablejsapi=1" frameborder="0"
style="border: solid 4px #37474F"></iframe>

You can get more detail from the already submitted answer YouTube Autoplay not working

score 2 · Answer 13 · answered Oct 18 '15 at 16:36

None of yours are solved my problem. But, I found a good solution for me to work properly right now. In between tags write this code:

<div style="position: fixed; z-index: -99; width: 100%; height: 100%">
  <iframe frameborder="0" height="100%" width="100%" 
    src="https://youtube.com/embed/**[CHANGE HERE WITH YOUR YOUTUBE VIDEO ID]**?autoplay=1&controls=0&showinfo=0&autohide=1">
  </iframe>
</div>

How can I autoplay a video using the new embed code style for Youtube?

13 Answers13

Linked