How to Embed High Quality and Higher Resolution YouTube Videos on Blog or Website

Viewers can now opt to view YouTube video clips in higher quality, or even set YouTube to playback the video in high resolution quality mode automatically by default whenever the video is watched on YouTube website. However, for YouTube video clip which embedded on blog or web page, viewers won’t have such flexibility to switch or upgrade the video playback to higher quality streaming, unless webmaster or blogger specifically embed a high quality and high resolution YouTube embed code on the website.

To allow visitors to web pages embedded with YouTube video clip to view and watch the video in high quality mode, webmaster has to use the hack below to embed the code that will stream from high quality video source, which stream as a MP4 (H264 with AAC audio) and encoded at 480×360. Similar to the hack to view high quality video on YouTube with &fmt=18 or &fmt=6 switch, publisher needs to append a switch to the YouTube embed code so that the Flash Player knows that it should play the video with high quality video streaming.

What’s the different between normal quality and high quality YouTube videos? Take a look at the 2 embedded YouTube video clips below, featuring sexy Mariah Carey singing Touch My Body, and you would amazed.


Normal quality version of YouTube video


High quality version of YouTube video

However, the default “&fmt=18″ flag for URL address bar will not work on embed code. In YouTube embed code, add and append &ap=%2526fmt%3D18 to the end of video clip’s URL specified in “param value” and “embed src”. For example, for video above, the embed code will be as below:

<object width=”425″ height=”344″><param name=”movie” value=”http://www.youtube.com/v/_w0AwGCjqnw&hl=en&rel=0″></param><embed src=”http://www.youtube.com/v/_w0AwGCjqnw&hl=en&rel=0″ type=”application/x-shockwave-flash” width=”425″ height=”344″></embed></object>

Apend the &ap=%2526fmt%3D18 to the end of two instances of http://www.youtube.com/v/xxxxxxxxxxx&hl=en&rel=0 within the original quotation mark, where xxxxxxxxxxx represents the unique video ID. The high quality YouTube embed looks like below:

<object width=”425″ height=”344″><param name=”movie” value=”http://www.youtube.com/v/_w0AwGCjqnw&hl=en&rel=0&ap=%2526fmt%3D18″></param><embed src=”http://www.youtube.com/v/_w0AwGCjqnw&hl=en&rel=0&ap=%2526fmt%3D18″ type=”application/x-shockwave-flash” width=”425″ height=”344″></embed></object>

The best part of high quality video can be enlarged to the width of 480 with affecting the viewing quality as the streaming video is encoded in 480×360 resolution.

With HD era arriving, YouTube now supports playback of YouTube hosted video in 720p HD (High Definition) picture quality resolution in near CD audio quality. Here’s how to embed video on external third party websites or blogs to play YouTube in 720p resolution or embed video to play in HD by default.

This entry was posted on Thursday, June 12th, 2008 at 1:41 am and is filed under Webmaster Resources. You can follow any responses to this entry through the RSS 2.0 feed. You can leave a response, or trackback from your own site.

68 Responses to “How to Embed High Quality and Higher Resolution YouTube Videos on Blog or Website”

  1. Youtube HQ nel nostro blog | Cirillina - Programmi gratis, Blog, Tecnologia, Web 2.0
    October 21st, 2009 16:36
    68

    [...] al momento non è possibile fare è integrare nei nostri blog i video HQ. Navigando ho trovato un sito in inglese che spiega come è possibile  fare questo e integrare nelle nostre pagine i filmati [...]

  2. Dragon Blogger
    August 13th, 2009 13:48
    67

    Really good tip, I use this often even on regular quality video’s as it makes them a little clearer

  3. chet
    June 14th, 2009 14:56
    66

    Since a few days the hack doesn’t work anymore
    &ap=%2526fmt%3D18
    This is the answer from youtube

    YouTube has recently been upgrading. Here’s a statement in the uploads section of their “known Issues” website.

    “HQ disappearing / not available for videos that meet HQ standards

    We made improvements to standard quality for video uploads! Unless there is a large difference between standard quality and HQ , the upload will produce standard quality by default (and not HQ as before).”

    http://www.google.com/support/forum/p/youtube/thread?tid=391cfb2db6b3b17b&hl=en

    Anyone knows an updated hack ??

  4. Setiadi
    May 2nd, 2009 17:53
    65

    Cool..The embedded code works for my website and some friends told me that I have a different quality videos (means good quality, off course..)

    Thanks

  5. Video Blogger
    April 8th, 2009 00:18
    64

    I’d been searching all over for this, no one could tell me. I just added this to my videos and it worked.

    I was using vimeo for a long time because of this, still uploading to youtube, now I can use youtube videos on my site and not sacrifice the quality.

    Thanks a bunch!

  6. best videos in the world
    April 3rd, 2009 08:11
    63

    hey, a couple of things:

    1) The only problem I have with HQ embedding is that the little icon in the video doesn’t actually show that it is HQ or HD, which i just annoying, because visitors will always hit the button for better quality, not realizing that it doesn’t do anything. Does anyone know if there is a way to get around this???

    2) the videos in this post are dead.

    Thanks guys!

  7. Įterpkite aukštos kokybės YouTube klipus « Entellbox Blogas
    March 16th, 2009 18:28
    62

    [...] Šaltinis: My Digital Life [...]

  8. lilian
    March 11th, 2009 06:55
    61

    Is it possible to embed high quality video with YouTube Custom Player, especially that layout with many small screens display on the side? Its video ID# goes like this: =”http://www.youtube.com/cp/xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx=” I tried to append &ap=%2526fmt%3D18 to the end of the video ID# within the original quotation mark (as you have suggested above)but it doesn’t work. Please HELP! Thank you in advance.

  9. Dessa
    March 9th, 2009 10:33
    60

    Thanks! This worked! :D

  10. Dragon Blogger
    February 19th, 2009 07:27
    59

    Thanks for this post, it helped me embed high quality videos from youtube on my blogs.

  11. From YouTube HQ: HQ Video Embeds | Viral Video Maker
    February 17th, 2009 20:47
    58

    [...] video playback on its embeds. Previously, you could switch to the high-quality stream by hacking the embed code, but now YouTube provides a handy-dandy little “HQ” button in the lower-right pop-up [...]

  12. Bonus Bill
    February 7th, 2009 07:00
    57

    This is really useful, thanks a lot for the tip – the videos in low quality just look so bad, but this makes all the difference

  13. Carrie
    February 6th, 2009 14:53
    56

    Great ! I will add this to my bookmarks. TY

  14. Tim Davis
    February 3rd, 2009 07:15
    55

    Hey, thanks for the code. I couldn’t figure it out on the embed code, until I used the &ap=%2526fmt%3D18 . That helped me out, and I couldn’t find it anywhere else. Have a great day.

  15. Alex
    February 1st, 2009 20:40
    54

    Thanks for providing this tip. Works great!

  16. How to Integrate Social Media into Product Marketing « I’m Not Actually a Geek
    January 27th, 2009 23:12
    53

    [...] page or blog post, you can alter the embed code to force the video to view in high resolution. The hack described in this blog post works. It will ensure that the video’s fidelity is much higher, making it a more enjoyable [...]

  17. FanTrust » Blog Archive » From YouTube HQ: HQ Video Embeds [NewTeeVee]
    January 27th, 2009 02:00
    52

    [...] video playback on its embeds. Previously, you could switch to the high-quality stream by hacking the embed code, but now YouTube provides a handy-dandy little “HQ” button in the lower-right pop-up menu. [...]

  18. From YouTube HQ: HQ Video Embeds « NewTeeVee
    January 24th, 2009 07:30
    51

    [...] video playback on its embeds. Previously, you could switch to the high-quality stream by hacking the embed code, but now YouTube provides a handy-dandy little “HQ” button in the lower-right pop-up [...]

  19. Sebastian
    January 23rd, 2009 21:43
    50

    Do you know how to hack VIMEO for HD embedding.

    Thank you for the YouTube hack i’m already using it.

    S

  20. NosillaCast @ podfeet.com
    January 19th, 2009 11:23
    49

    [...] and hp.com. How to set your preferences on YouTube to get high quality video from mydigitallife.info. Ben Fryxell of macmaniapodcast.com does the Honda Bob commercial this week. In this week’s [...]

  21. Σε widescreen και καλύτερη ποιότητα τα embed video στο wiggler at Wiggler
    January 17th, 2009 02:14
    48

    [...] Το τελευταίο το καταφέραμε με βάση αυτό το post. [...]

  22. Chokeman
    January 13th, 2009 19:20
    47

    Thanks for the help bro, much appreciated!

  23. Helpedia - Blog » Blog Archive » The Uncultured Project oder wie man Social Media für die gute Sache einsetzen kann
    January 13th, 2009 18:07
    46

    [...] übrigens an My Digital Life, für den Tipp wie man YouTube-Videos auch in hoher Qualität in die eigene Website einbetten [...]

  24. Embedding Youtube in High Quality and HD « Rantings Of An Optometrist
    January 13th, 2009 01:11
    45

    [...] to embed high quality YouTube video clips on external website for direct viewing or playback of visitors. But to many disappointment and [...]

  25. mrdougan
    January 12th, 2009 23:30
    44

    Thanks a million this has been a life saver for me

  26. bob
    December 29th, 2008 22:59
    43

    Brilliant! Works like a treat! Well done and many thanks!!!

  27. Maksin
    December 22nd, 2008 22:10
    42

    Thank you for this priceless information.

    Cheers. :)

  28. Roy
    December 8th, 2008 05:46
    41

    Great but how do you embed high quality with youtube’s custom video player?

  29. nerddna
    December 8th, 2008 01:39
    40

    epic fail videos don’t play

  30. funderar på att emigrera till vimeo.com | nihilisten.se
    December 6th, 2008 13:47
    39

    [...] lite genom att lägga in &ap=%2526fmt%3D18 efter länknamnet i koden, beskrivs mer i detalj här. det gör faktiskt [...]

  31. Julian
    December 4th, 2008 01:16
    38

    thank you!

  32. Added some howto videos « lookpicking.com status blog
    December 2nd, 2008 01:51
    37

    [...] you find them useful, I will add more in the future. These are the first two (somehow the youtube high quality trick isn’t working from here, so you may wanna go here to watch them in better [...]

  33. Sanath
    November 28th, 2008 21:20
    36

    Do anyone knows how to embed you tube video to ppt…?

  34. Sanath
    November 28th, 2008 21:19
    35

    Do anyone knows the way to embed you tube video to powerpoint presentation?

  35. Dean
    November 28th, 2008 09:10
    34

    Here’s a link to a video that can be viewed in high and low quality.

    http://au.youtube.com/watch?v=trOG1B5UV9c

    Makes a big difference

  36. Embeding High Quality YouTube Videos No Longer Possible? | The World's Greatest Blog
    November 27th, 2008 00:33
    33

    [...] very simple explanations of how to do this can be found here and here. Or, rather, should I say, in the past this is how it was [...]

  37. jan
    November 22nd, 2008 10:40
    32

    Thanks a lot man! I’ve been frustrated for a long time about always having to put crappy videos on my websites. This is just awesome!

  38. How to Embed and Play 720p HD (High Definition) YouTube Videos (&fmt=22 Code Hack) » My Digital Life
    November 20th, 2008 15:16
    31

    [...] possible to embed high quality YouTube video clips on external website for direct viewing or playback of visitors. But to many disappointment and [...]

  39. Jaki
    November 20th, 2008 04:23
    30

    This is a great hack!!!!

    I am wondering, though, how to do this for the customized youTube video players.

    YouTube allows users to create ccustom players, but how do you get the high quality video in here?

    example : http://gwirtzmandance.com/videoplayer.html

    ideas? hacks?

  40. ● High quality YouTube video hack » Faceblog.CN_科技时代Web2.0餐厅
    November 18th, 2008 21:05
    29

    [...] Sources: Yahoo! Tech, jimmyr.com, My Digital Life. [...]

  41. darcloud
    November 18th, 2008 18:10
    28

    simply amazing, thank you.

  42. ian
    November 16th, 2008 17:46
    27

    Nice! Works PERFECTLY. Thanks….

  43. Watch and Embed YouTube Clips in High Quality
    October 31st, 2008 15:29
    26

    [...] of the hat to My Digital Life and Tobias Lind. _________ From http://generalspecialist.com/ [...]

  44. FU**ING Youtube - Call of Duty 4 Glitches
    October 25th, 2008 00:29
    25

    [...] FU**ING Youtube Guys, this is what you wanted originally right? How to Embed High Quality and Higher Resolution YouTube Videos on Blog or Website My Digital Life [...]

  45. links for 2008-10-20 < Chris Abraham
    October 21st, 2008 03:00
    24

    [...] How to Embed High Quality and Higher Resolution YouTube Videos on Blog or Website » My Digital Life [...]

  46. Mark
    October 17th, 2008 23:40
    23

    Thanks for the ‘thank you’s’ guys :)

    Have you tried the video encoder yet? It’s totally free and will encode to H.264 (X264) format for you, easily. I’ve put up some videos about it.

    Later,
    Mark

  47. Shane
    October 17th, 2008 22:04
    22

    Thanks so much for the youtube tweak. It was just the the thing that was needed.

  48. Lewie
    October 16th, 2008 01:28
    21

    Awesome tip; it really makes a difference on embedded vids. Thanks!

  49. DonsTag » Coloured Canyon (Sinai)
    October 14th, 2008 04:55
    20

    [...] Auflockerung einfach mal ein kleines Video (hab bei allen Videos in diesem Beitrag übrigens den  “&ap=%2526fmt%3D18″-Trick benutzt, um das Video in höherer Qualität einzubinden, [...]

  50. Whuh?! » MaTr3o.com
    October 8th, 2008 23:21
    19

    [...] How To Embed High Quality Videos from YouTube [...]

  51. Bruno
    October 6th, 2008 22:02
    18

    Thank you very very much for that.

  52. Mark
    October 2nd, 2008 04:47
    17

    I am not trying to plug here but I was having trouble working out how to watch, create and embed high quality video in Youtube. I found out the easist ways and have recently put up a website that explains it all.

    The site is totally free. I have even included a script that generates the high quality embed code for you with different options. So it’s even easier.

    You can take a look at:

    It’s free and I’m trying to help the guys that don’t know or make it easier for the guys that do. Thanks, Mark
    http://www.youtubehq.info

  53. Ted
    September 27th, 2008 05:55
    16

    This high quality script works fine in IE but fails to load the video using Firefox.

    I use a combination of high quality and autoplay in both script locations as follows:

    &ap=%2526fmt%3D18&autoplay=1

    Here is the Firefox issue:

    Using autoplay=1 in both locations along with the high quality script included in the first instance only and omitted from the second instance, the low quality video plays fine. However if I add the high quality script to the second instance, Firefox stalls, It appears to be continuously downloading with the following comment in the status bar:

    Transferring data from 208.117.253.83… (example, IP address varies)

    Note, the low quality version downloads from:
    v23.cache.googlevideo.com… so it appears the redirect to the HQ version is functioning OK.

    I cleared the browser cache after each test to make sure Firefox wasn’t loading the web page from cache.

    As per previous comment, this seems to be a Firefox issue as high quality functions great using IE6.

    Has anybody else experienced this when using Firefox and if so, is there a known workaround????

    Thanks.

  54. JS
    September 26th, 2008 03:44
    15

    I think Google fixed all of this…. I think.
    The new blogger just got a much needed update/upgrade(?) and now when you build and edit a new blog you will find a ton of built in “widgets” or “gadgets” or whatever you like to call them.
    One of which is a YouTube player. This player works on every system I testing it on.. iPhone, Firefox (mac & PC), Chrome, and IE.

    The only thing is.. I’m not sure if it’s that high quality player or just the same loFi stream from before.

    Point being.. Google owns/is YouTube so I imagine this might be the place for the answer. Let me repeat.. these were the only YouTube player codes that I could see on every browser and on my iPhone.*

    *And the best part is.. when you press play on the video box from one of these Google charged players it opens the thing in the phones native YouTube player. Then it can be bookmarked, added to the home screen, or sent to a “friend”.
    Pretty damn clever!

    Now what about that HQ embed issue. Go experiment with it and report your results. The future of respectable quality video depends on nerds like us.

  55. Youtube Videos mit sehr guter Qualität ins Weblog einbinden | ashility.com
    September 11th, 2008 20:02
    14

    [...] Wie binde ich ein Youtube Video mit höherer Qualität ins Blog ein? Eine genaue Beschreibung gibt es bei My Digital Life. [...]

  56. florida-erweckung-godtv.blogspot.com
    September 5th, 2008 13:23
    13

    “&ap=%2526fmt%3D18″ is very helpfull. Thanx for that!

    but i have the same question like JumpOff:

    How can i embed high quality and higher resolution youtube videos as a PLAYLIST ?

    I tried “&ap=%2526fmt%3D18″ with a playlist like
    http://www.youtube.com/view_play_list?p=9B94127A49514758 ?
    but it doesn´t work.

  57. pspargur
    August 29th, 2008 03:33
    12

    this is amazingly helpful and simple. thanks!

    your mariah video is dead, you can use our hula video in its place if you like!

  58. JumpOff.TV
    August 26th, 2008 21:02
    11

    Okay, have used this a lot now… but is there a way to force High Quality on embedded LATEST VIDEO players like this one: http://www.charliesloth.com

    I also tried the FULL SCREEN code but it too doesn’t work on these bespoke players. Any advice?

  59. Wendy
    August 26th, 2008 10:40
    10

    What a great post. Thanks!

  60. Sim
    August 7th, 2008 02:09
    9

    Thanks for the code. Worked like a charm!!

  61. Sean
    August 4th, 2008 06:22
    8

    This is great u was wondering how to embed with the high definition

  62. Bart
    July 22nd, 2008 05:15
    7

    Yoram, you’re the first guy that managed to get an AVI from Youtube. This is about embedding YouTube Flash-video. Not AVI’s.

  63. Bart
    July 22nd, 2008 05:14
    6

    You’re da man! :) Thanks!

  64. yoram
    July 20th, 2008 05:44
    5

    hi,
    i try the “&ap=%2526fmt%3D18″ code and it doesn’t work,
    my video is a avi type,
    there is a different code for avi???
    thanks in advance.

  65. JumpOff.TV
    July 18th, 2008 23:25
    4

    That was EXACTLY what I was looking for!!!! Now to figure out where the FULL SCREEN option has gone when I embed!!

  66. Sean
    July 4th, 2008 02:04
    3

    Excellent Post my friend!! It was so easy!

  67. Eternalmoonlight.net » Life tips #12
    June 20th, 2008 05:42
    2

    [...] How to Embed High Quality and Higher Resolution YouTube Videos on Blog or Website [...]

  68. Tip/Trick: Embeddiamo un video da Youtube in alta risoluzione(qualità) sul nostro sito - Geekissimo
    June 13th, 2008 20:17
    1

    [...] Via | Mydigitallife [...]

Leave a Reply

You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>

Subscribe to comments feature has been disabled. To receive notification of latest comments posted, subscribe to My Digital Life Comments RSS feed or register to receive new comments in daily email digest.
« New HP DreamColor LP2480xz – The World’s First Affordable Color-Critical Display
Latest Canon EOS 1000D (EOS Rebel XS) DSLR Camera »

New Articles

Incoming Search Terms for the Article

youtube embed hq - youtube high quality - embed high quality youtube - high quality youtube - youtube embed high quality - embedded with youtube - youtube high quality code - youtube hq code - embed hq youtube - hq embed youtube - youtube hq embed - embed youtube hq - embedded youtube - youtube hd codes - youtube hq resolution - embed youtube high quality - youtube hq - high quality videos - youtube embed - embed HQ youtube video - youtube embed parameters - embed hq videos - embed youtube video hq - youtube force HQ - high quality youtube embed - upload youtube hq - EMBEDDING HQ YOUTUBE VIDEOS - embed youtube video at hq - youtube how embed hq - how to add HQ on youtube vids - how to get good quality youtube videos - youtube embed hd default - youtube embedded hq - high quality youtube videos - high quality in youtube - high quality video youtube - youtube embed quality - embed youtube video size - force embed youtube videos to play high quality - how to hq youtube - how to embed high quality youtube - youtube param hq - youtube hq resolutions - youtube hd trick - youtube hq url - embedded youtube video - embed high quality - embed youtube in high quality - how to post a youtube video in hq - how embed youtube video website -