Last Updated: July 07, 2022
·
41.4K
· citizenk

Get a thumbnail from a YouTube video

Are you looking for a way of doing this with Vimeo? Have a look over there:http://coderwall.com/p/fdrdmg

Let's say you need an image preview of a YouTube video.

If, for instance, this is your video: http://www.youtube.com/watch?v=LFbhGEiFWk4, simply type http://img.youtube.com/vi/LFbhGEiFWk4/0.jpg in your address bar, and voilà!

The gritty details

YouTube automatically generates (at least) three thumbnails and one image preview for every uploaded video, and you can easily get to them once you know how.

First of all, take a look at the URL of the video you're interested in. They all are formated like this:

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

Where VIDEOID is a string of letters and numbers uniquely identifying it. You may have an ampersand (&) and some arguments after that ID, but you can safely ignore them.

Take note of (or copy) that VIDEOID string.

In order to get the YouTube generated thumbnails, you'll simply use the following address:

http://img.youtube.com/vi/VIDEOID/#.jpg

Replace VIDEOID with the aforementioned string, by typing it or pasting it in. Don't it ENTER yet!

You first need to decide which thumbnail you want. Try them out for size by replacing the hash (#) with a number, like this:

http://img.youtube.com/vi/VIDEOID/0.jpg

Will give you the default large preview image (480x360). For our example, this gives us:

Picture

Similarly:

http://img.youtube.com/vi/VIDEOID/1.jpg

Will give us the first small thumbnail (120x90):

Picture

Of course:

http://img.youtube.com/vi/VIDEOID/2.jpg

Will give us the second small thumbnail (120x90) or the thumbnail chosen by the uploader for that video (this is the default thumbnail for YouTube):

Picture

And finally:

http://img.youtube.com/vi/VIDEOID/3.jpg

Will bring back the third small thumbnail (120x90):

Picture

Bringing it further

By knowing this logic behind YouTube's thumbnails and preview images, writing up a simple script able to show the images for any given video becomes rather trivial and will be left, as the saying goes, as an exercise for the reader.

Of course, Google makes it even easier by providing us with a YouTube API: http://developers.google.com/youtube/2.0/developers_guide_protocol - what you're looking for specifically is the information about the media:thumbnail tag: http://developers.google.com/youtube/2.0/reference#youtube_data_api_tag_media:thumbnail

--
N.B.: I know this is nothing new or heart-shattering, but I always seem to forget which URL gives which image. So, here it is for our reference, and if this can also help one of you, then all the better!

Have fun!

1 Response
Add your response