April 16, 2008

YouTube in MP4 via QuickTime Plugin!

Filed under: Technical, Web — Joey @ 4:09 pm

Today I saw this link on Daring Fireball that presents a bookmarklet to add a link to the YouTube page to download a (higher quality) MP4 version of the video you’re viewing. This is great, but I dislike flash in general, so I’d rather not even watch the embedded version to begin with. I’ve crafted the following bookmarklet to replace the existing flash player with an embedded QuickTime player for the MP4 file. Go try it out on YouTube.

To install the bookmarklet, simply drag it to your Bookmarks Bar (in Firefox, Safari):



This has only been tested on a Mac. I expect it won’t work on some other OSes because it uses the <embed> tag rather than the <object> tag. I encourage someone fix up this bookmarklet to work on other platforms by using the <object> tag, and condense it a little–because it is rather long. I’d be happy to post an updated version if someone improves it. Additionally, a GreaseKit script would be great too.

Enjoy!

Update:
Seems to work in Firefox on Windows.

Update:
Comment from Kris below provides a Greasemonkey/GreaseKit Userscript.
Userscript

Update:
Comment from Jean below suggests enlarging the size of the video to accommodate the new wider YouTube format. I’ve done this to the link above, but kept the format at “18″, as “22″ is still not widely available.

Update:
Jean was also kind enough to let me host this very informative chart (pdf) of precisely the file sizes, quality, and formats of all downloading format numbers that he made. Lots of info here!

Update:
See ClickToFlash 1.4+ supports H.264 loading to automatically load H.264 video for YouTube.

53 Comments »

  1. Works perfectly for me. I tried it on this amazing video:

    http://www.youtube.com/watch?v=CiNBqEk-bRk

    Comment by Erik Hinterbichler — April 16, 2008 @ 4:26 pm

  2. Erik,
    That plug was not obvious at all!

    Comment by Joey — April 16, 2008 @ 5:19 pm

  3. joey, you constantly bring the hotness. thank you.

    Comment by afoursquarecurse — April 16, 2008 @ 5:32 pm

  4. doesn’t work for me! safari, leopard, um….aluminum keyboard

    Comment by david stolarsky — April 16, 2008 @ 6:04 pm

  5. David,
    Which video did you use it on? Not all YouTube videos are available in MP4. If you get a big Q with a question mark, the video simply isn’t available in MP4.

    -Joey

    Comment by Joey — April 16, 2008 @ 6:06 pm

  6. hi joey,

    love the plugin! great work.

    Comment by despa — April 17, 2008 @ 4:20 am

  7. It’s not working for me. I get the Quicktime “Q” logo where the video is supposed to play but after a couple minutes it just puts a question mark over it and doesn’t load!
    I did the manual “&fmt=18″ to the address and the video played fine, but not with the bookmarklet.

    Comment by Shawn — April 24, 2008 @ 10:32 am

  8. Doesn’t work for me in Safari 3.1.1, using this video:

    http://www.youtube.com/watch?v=yQP7ASBdwdo

    It is available in High Quality, but all I get is a blank area where the video should be, or a crash.

    Mulder

    Comment by Mulder — April 24, 2008 @ 11:23 am

  9. Same problem here. I wait until the YouTube video loads and tryed with the bookmarklet but I get the Quicktime “Q” logo

    Comment by c.urdaneta — April 24, 2008 @ 11:47 am

  10. Shawn and Mulder,
    I also have the same problem with that video, the Q?– but it is not clear to me at this point which videos are having this problem, it may be related to the MIME type? Hopefully we’ll be able to fix it soon.

    The crash is more concerning; I have not been able to make the bookmarklet crash my browser in any way. Mulder, do you have any additional Safari plugins (like GreaseKit) installed?

    Comment by Joey — April 24, 2008 @ 11:58 am

  11. @Joey,

    I have 1Password, amiScript (for Camino), Inquisitor, SafariScript, SafariStand, and Smart Crash Reports for Input Managers.

    For Internet Plugins, I have the usual assortment for web browsers like Adobe Reader plugin, Java, Adobe Flash, etc.; nothing exotic or strange.

    Mulder

    Comment by Mulder — April 24, 2008 @ 12:52 pm

  12. Running 1Password and iGlasses on Safari 3.1.1 - all I get is the Q and nothing else. No question mark, nothing. Do I wait for the Flash version to load first before hitting the bookmarklet?

    Comment by Rom — April 24, 2008 @ 5:29 pm

  13. Rom,
    That sounds like its just still loading; it takes longer than the flash version. Does this happen consistently on many videos, or just a couple? If none of this works, I need to suggest you try the standard things like; 1) new web browser, 2) try new user account, etc.

    Love to hear an update if you get it working.

    Comment by Joey — April 24, 2008 @ 5:34 pm

  14. Thanks, Joey! It finally worked! :) Yeah, it was loading both plug-in and the video, I guess.

    Now, I am blogging about this and expect some traffic going your way. :)

    Comment by Rom — April 24, 2008 @ 5:43 pm

  15. Rom, Cool, i’m glad to hear its working. Thanks!

    Comment by Joey — April 24, 2008 @ 5:47 pm

  16. Great work Joey!

    Comment by Paul Nowak — April 25, 2008 @ 7:23 am

  17. You can also simply set high quality at http://www.youtube.com/video_quality_settings

    Comment by Martin — April 25, 2008 @ 9:37 am

  18. This is wonderful. It worked exactly as advertised on the first piece of useless dreck I tried it on. No stuttery buffering, and amazing video quality. Those friends who IM me nothing but YouTube links just got a LOT more tolerable.

    In all seriousness, THANK YOU.

    Comment by kostia — April 25, 2008 @ 10:11 pm

  19. Thanks so much for this - so far works great in Safari and Firefox. Don’t mean to be greedy, but any ideas as to how to now get full-screen video (as we can with the inferior flash player)?

    Comment by Ed — April 27, 2008 @ 7:14 am

  20. Hi, how can iknow if a video is available in high quality?

    Comment by Ivan — April 27, 2008 @ 10:51 am

  21. Ed, the QuickTime plugin doesn’t have a fullscreen feature. I think with some work you could make a resizable player with a popup window and javascript, but i’m not sure how much would fit in a bookmarklet. I made one that fits the width of the page, or height of the browser window, but unfortunately it covers up part of the YouTube page. Perhaps with some fancier CSS this could be fixed as well?


    QTYouTube (big)

    Comment by Joey — April 27, 2008 @ 12:32 pm

  22. Ivan,
    Unfortunately, I don’t know of a good way to reliably determine this.

    Comment by Joey — April 27, 2008 @ 12:33 pm

  23. Works fine on Arch Linux + Firefox, with Totem plugin (xine backend). Infact it works better than quicktime on mac because it will play non-mp4 regular flash videos too instead of showing the question mark ;-)

    Comment by Prashant Vaibhav — April 27, 2008 @ 2:48 pm

  24. Win Safari version :

    javascript:(function%20()%20{var%20video_id%20=%20null;var%20video_hash%20=%20null;var%20video_player%20=%20document.getElementById(%27movie_player%27);if%20(video_player)%20{var%20flash_variables=video_player.attributes.getNamedItem(%27flashvars%27);if%20(flash_variables)%20{var%20flash_values=flash_variables.value;if%20(flash_values)%20{var%20video_id_match=flash_values.match(/video_id=([^(\&|$)]*)/);if%20(video_id_match!=null)%20video_id=video_id_match[1];var%20video_hash_match=flash_values.match(/t=([^(\&|$)]*)/);if%20(video_hash_match!=null)%20video_hash=video_hash_match[1];}}}if%20(video_id==null%20||%20video_hash==null)%20{var%20args=unsafeWindow.swfArgs;if%20(args)%20{video_id=args[%27video_id%27];video_hash=args[%27t%27];}}if%20(video_id==null%20||%20video_hash==null)%20return;var%20yt_mp4_path%20=%27http://www.youtube.com/get_video?fmt=18&video_id=%27+video_id+%27&t=%27+video_hash;var%20div_embed=document.getElementById(%27watch-player-div%27);if%20(div_embed)%20{div_embed.innerHTML=%27%3Cembed%20src=\%27%27+yt_mp4_path+%27\%27%20width=480%20height=400%20autoplay=”true” loop=”false” controller=”true” pluginspage=”http://www.apple.com/quicktime/download”%20scale=\%27aspect\%27%3E%3C/embed%3E%27;}})();

    Comment by Ayyoub — April 29, 2008 @ 8:50 am

  25. i just turned this into a greasemonkey/greasekit script. i’ve never wrote a greasemonkey script before, but it’s pretty easy. basically give it the appropriate header and paste in the bookmarklet code.

    Download

    Comment by Kris — June 22, 2008 @ 11:36 pm

  26. Kris,

    Thanks for the update! I’ve hosted the userscript on my website instead of rapidshare so people don’t have to click-through.

    Thanks!

    Comment by Joey — June 29, 2008 @ 5:28 pm

  27. It also works with Opera, just add it to the Personal Bar, then choose personalize and drag to any toolbar

    Comment by Sebastian Oliva — July 1, 2008 @ 9:42 pm

  28. This works awesomely on my machine after dropping in Greasekit; every video I’ve tried to watch on Youtube works fine. This may be in part because I have Perian</a< installed…

    Comment by Egypt Urnash — September 27, 2008 @ 12:38 pm

  29. Am I suppose to select “Save as Source” or “Save as QuickTime Movie?”

    Comment by Josh — November 25, 2008 @ 12:14 am

  30. I’d probably “Save as Source”, to keep it in the original .mp4 file. It doesn’t really matter, either way will work equally well, but save as QuickTime Movie will put it in a .mov container, and it’ll keep that file extension.

    Comment by Joey — November 25, 2008 @ 12:52 am

  31. I guess a new version of the script will be needed to watch the new 720p standard (1280×720) supported by YT since November 25th, 2008. Replacing fmt=18 by fmt=22 wil not be enough since the window as to be resized, or splashed full screen.

    Comment by Jean Létourneau — November 26, 2008 @ 11:10 pm

  32. Jean,
    I think that is a great idea, however, I am unprepared to edit the script. First, many movies will remain unavailable in this highest quality version, so im’ unsure if it would be useful any longer. Next, while someone might want to resize the video, I found doing so provided unsatisfactory formatting of the page rendering it over top of the sidebar on the right. There is no “pop up fullscreen” mode for QuickTime, so it isn’t possible to just make it full screen. I encourage you to modify this and release it yourself, or others to modify it, but I think i’d rather leave the main link as is for now. Thanks!

    Comment by Joey — November 27, 2008 @ 1:25 am

  33. Joey, I just did a small mod to your script. I changed the width from 480 to 640 but kept the original quality ot fmt=18. It formats the QT window nicely as the newer YT standard. You can check with this video of mine :

    http://ca.youtube.com/watch?v=jm4hyfnHu1g

    Thanks.

    Comment by Jean Létourneau — November 28, 2008 @ 2:24 pm

  34. Jean,

    Thanks for your suggestions! I did the same to the primary link above, and really like the results.

    -Joey

    Comment by Joey — December 1, 2008 @ 11:43 pm

  35. Is there a way to use QTYoutube to download youtube vids to itunes( if this has already been discussed srry pls repond n e way)

    Comment by Adrin — December 4, 2008 @ 4:08 pm

  36. Adrin,
    You can simply choose “Save As” from the quicktime video, then drag it to iTunes.
    -Joey

    Comment by Joey — December 7, 2008 @ 11:01 pm

  37. Trying to get this to work in both Safari (3.1.1) and Firefox (3.0.5) on OS X 10.4.11

    No problem dragging the link from this page to bookmark bar, however clicking the new bookmark seems to do nothing at all…

    Thanks in advance for any help you can offer :)
    (I’m really sick of the crap flash performance on my mac!)

    Comment by Andy — December 17, 2008 @ 5:49 am

  38. Andy, Sorry to hear this. I don’t have a 10.4 machine to test on, but I don’t think it should be a problem… Just to be clear– the idea is you visit the page with the video you want to watch– it must be a regular YouTube Video page, not a special page, then click the link to transform the page so that it uses the QuickTime version of the video instead. Perhaps another reader will be able to comment on 10.4 compatibility.

    Comment by Joey — December 20, 2008 @ 4:23 am

  39. Ah, I see.. thanks for explaining, I’ll give that a try tonight :)

    Happy holidays!!

    Cheers!

    Comment by Andy — December 21, 2008 @ 1:54 pm

  40. This is AWESOME! Works with Opera 9.63 + VLC 0.9.8a @ WinXP Pro Eng.

    Comment by RedSaint — January 1, 2009 @ 2:06 pm

  41. Now that YT has officially put the “View as HD” option. The window size it uses is 854×479 (in Safari, at least). I modified Joey’s script to take this new window size into account with better video quality (&fmt=22). I have now 2 different scripts in my bookmark bar. I was wondering if it could be possible to have a single script that could react properly to HQ and HD versions of the file ?

    I will try to work on it on my own, later next weekend.

    Comment by Jean Létourneau — January 16, 2009 @ 1:55 pm

  42. THANK YOU!!!!

    Comment by Robby — January 23, 2009 @ 1:23 pm

  43. FREAKING AWESOME!!! I hate Flash! I knew that there were MP4 videos and I could download them with keepvid.com, but that was kind of cumbersome. This really speeds up Flash videos on older Macs as well.

    Comment by Mike R — February 28, 2009 @ 2:21 am

  44. Joey, I’ve been using this plugin for quite some time and LOVE IT! Great work. That being said, there have been several videos lately that I won’t convert using this plugin–I get a QT logo with a “?” Any idea why this is?

    Comment by Aaron — March 8, 2009 @ 5:15 pm

  45. Joey, sorry for my question. I went back through and read your previous responses and learned that it simply means there is no MP4 version available. Thanks!

    Comment by Aaron — March 8, 2009 @ 5:19 pm

  46. Aaron, Unfortunately there are simply some videos that aren’t converted to the QuickTime H.264 codec required to use this. Some people have found installing the Perian plugin allows more videos to play, but I don’t have experience with this. Please post back here if you find it helps.
    Thank you,
    Joey

    Comment by Joey — March 8, 2009 @ 5:22 pm

  47. To Watch it in HD edit the bookmark in Safari Find & Change to:

    FIND: get_video?fmt=18
    CHANGE TO: get_video?fmt=22

    FIND: width=640%20height=500
    CHANGE TO: width=907%20height=505

    It will show the HD mode clip.

    Have Fun & Enjoy.

    Comment by BullBoyKennels — May 16, 2009 @ 5:45 pm

  48. Hello, i’ve placed the bookmark in my Mac Safari. After loading YouTube and changing it to the QTYouTube Mode, when i right click it, the Save as Quicktime Movie has the Gray wordings which means you can use it.. How to solve this problem ? what can be used it About Quicktime Plug-In, Plug-In Settings, and Connection Speed. Help pls ! Thks !

    Comment by Amin — May 19, 2009 @ 10:35 am

  49. I can’t download video too…i’m using windows xp professional and firefox…when i click right click there is option “Save as QuickTime Movie…” but it’s gray and i can’t click it. Please help me if you know hoe to solve this problem.

    Skube

    Comment by skube — May 20, 2009 @ 10:14 am

  50. Thanks So much I use the Ip 208.117.236.69 and this plug in to get to youtube on my school network thanks for this hack, the school can install flash but they can install fire fox

    Comment by Jake — May 22, 2009 @ 1:13 pm

  51. Amin and Skube,

    There are a couple of reasons you might have trouble saving the movie. The first is simply that it hasn’t yet fully downloaded. Wait for the video to fully download before attempting to save.

    Second, you might need QuickTime Pro, or a newer version of QuickTime. I’m not sure what versions you might need, but I know the newest version of QuickTime (included with iTunes) works right out of the box.

    Hope that Helps!

    Comment by Joey — May 22, 2009 @ 9:49 pm

  52. it works on Google Chrome too

    Comment by tjuytgjy — May 24, 2009 @ 10:45 am

  53. This doesn’t seem to work on Firefox 3.5 Beta 4. It works fine on Firefox 3.0.10. Any idea why?

    Comment by Jacob — June 10, 2009 @ 9:17 am

RSS feed for comments on this post.

Leave a comment

© 2009 |