52

There are a few methods suggested for doing this online, but none of them seem to work.

For example:

http://blog.makezine.com/archive/2008/11/youtube-in-720p-hd-viewin.html

That article is about making it start in 720p, but it doesn't even work on their own video.

Does anyone here know how to do it?

2
  • 9
    Well, it's for my website and there wasn't any more appropriate place to ask that I could think of. I assumed I had the highest chances of recieving an answer here. Sep 28, 2011 at 11:26
  • t1gor's answer was the same as TrySpace's. Feb 25, 2014 at 3:30

10 Answers 10

113

(This answer was updated, as the previous method using vq isn't recognized anymore.)

Specifying the height of the video will change the quality accordingly. example for html 5;

<iframe style='width:100%; height:800px;' src='https://www.youtube.com/embed/xxxxxxxx'></iframe>

If you don't want to hardcode the width and height you can add a class to the iframe for css media queries.

Tested on a working server + passes the w3.org nuhtml validator.

6
  • Thanks, that works perfectly. But it seems like you don't even need the hd, &vq=hd1080 worked for me
    – DiddiZ
    Jul 23, 2012 at 21:13
  • This works although it is not documented in the youtube player doc. Btw, the other suggestion, &hd=1, is deprecated and doesn’t work with latest iframe embed code.
    – Makzan
    Oct 27, 2012 at 3:35
  • 4
    This works as well when viewing videos stored in Google Drive - you can even add the ?vq=hd720 or ?vq=hd1080 to the URL of a folder that you have shared, and all the videos in there will open in HD by default. Jan 14, 2013 at 5:53
  • 2
    A default embed may not have anything in the query string, so don't forget to add a handy dandy ? to your source url. E.g: <iframe width="324" height="182" src="//www.youtube.com/embed/V1234580?vq=hd720" frameborder="0" allowfullscreen></iframe> Dec 16, 2013 at 18:32
  • I can't get this to work when embedding in a forum post. For example here: rpgmakervxace.net/topic/24781-datsville-rpg-currently-v050/…
    – posfan12
    Jul 23, 2014 at 4:04
24

You can do this by adding a parameter &hd=1 to the video URL. That forces the video to start in the highest resolution available for the video. However you cannot specifically set it to 720p, because not every video has that hd ish.

http://www.youtube.com/watch?v=VIDEO_ID&hd=1

http://code.google.com/apis/youtube/player_parameters.html

UPDATE: as of 2014, hd is deprecated https://developers.google.com/youtube/player_parameters?csw=1#Deprecated_Parameters

3
  • 1
    Its the same thing. If your embedding add the &hd=1 it starts up in the highest possible resolution.
    – Mob
    Sep 28, 2011 at 11:29
  • No, it does work on links. like this: youtube.com/v/l9Cg5rlSe28&hd=1 but it doesn't work on object embeds. I'll try an iframe embed and see if it makes a difference. Sep 28, 2011 at 11:34
  • 4
    Okay, I got it to work like this: <iframe width="853" height="480" src="http://www.youtube.com/v/l9Cg5rlSe28&hd=1" frameborder="0" allowfullscreen></iframe> Sep 28, 2011 at 11:38
10

Youtube doesn't support playback quality anymore

Youtube doesn't support playback quality anymore

1
8

This is an embed example of video played in HD 1080.

<iframe width="560" height="315" src="http://youtube.com/v/IplDUxTQxsE&vq=hd1080" frameborder="0" allowfullscreen="1"></iframe>

Let's break apart the code:http://youtube.com/v/ video_id &vq=hd1080

Video id for that video: IplDUxTQxsE you will see this type of random code in the link of every YouTube video.

So far so good, this trick works for playing full HD videos directly on webpages!

You can change the quality to 720 too. &vq=hd720

0
7

2021 here is my answer that works.

https://youtube.com/embed/ZkTzXrczk5M?vq=hd720p;feature=oembed&amp;controls=0&amp;hd=1&amp;modestbranding=1&amp;autohide=1&amp;showinfo=0        

The secret is in placing a "p" e.g. ?vq=hd720p not ?vq=hd720, after your desired resolution on the of the src.

2
  • This got me there, thank you so much! Here is what I had to use (the iframe width and height had to be set) <iframe width="1280" height="720" src="youtube.com/embed/xxxxxxx?vq=hd720p;hd=1" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" allowfullscreen></iframe>
    – markau
    Jul 9, 2023 at 3:50
  • Note that the query string ampersand syntax for parameters after the first one eg youtube.com/embed/NfxpqYjLrDQ?si=FaVpQR3TiXRSy6RK&vq=hd720p
    – jaycer
    Mar 3 at 23:50
6

I've managed to get this working by the following fix:

//www.youtube.com/embed/_YOUR_VIDEO_CODE_/?vq=hd720

You video should have the hd720 resolution to do so.

I was using the embedding via iframe, BTW. Hope someone will find this helpful.

0
4

The first example below does not work for me, but the second one does (in Chrome).

<iframe width="720" height="405" src="//www.youtube.com/embed/GX_c566xYcQ?rel=0&vq=hd1080" frameborder="0" allowfullscreen="1"></iframe>
<iframe width="720" height="405" src="//youtube.com/v/IplDUxTQxsE?rel=0&vq=hd1080" frameborder="0" allowfullscreen="1"></iframe>

I believe the first one uses the new HTML5 youtube player whereas the bottom one (which works) uses the older flash player. However, the second one doesn't seem to load correctly in Safari/Firefox etc so probably not usable.

0
3

None of the above solutions seem to work if the width/height is less than the line resolution of quality you select. For example, the following doesn't work for me in Chrome:

<iframe width="720" height="480" src="//youtube.com/embed/hUezoHa1ZF4?autoplay=true&rel=0&vq=hd720" frameborder="0" allowfullscreen></iframe>

I want to show the high quality video, but not use up 1280 x 720 pixels on the webpage.

When I go to youtube itself, playing 720p video in a 720x480 window looks better than 480p at the same size. I want to play 720p in a 720x480 window (downsampled better quality). There is no good solution yet afaik.

2

In case you're still wondering how to do it, then add: &feature=youtu.be&hd=1 Actually now I checked, this works only when you're sending the URL to someone else, not on embed.

0

Use this, it works 100% _your_videocode?rel=0&vq=hd1080"

Not the answer you're looking for? Browse other questions tagged or ask your own question.