When you’re building social applications it’s always a good idea to include context relevant to certain information. This helps tie the experience together and makes things a lot nicer for the user. I find myself working on projects that need some sort of relevant screen shot of either the site or video someones linked to. This can be really nice for your users and is pretty simple to do.
I use a pretty standard/straightforward PHP script to get the screen shot from a Youtube or Vimeo video URL. The below is stripped down version which you can use in any of your applications.
The Code
function video_image($url){
$image_url = parse_url($url);
if($image_url['host'] == 'www.youtube.com' || $image_url['host'] == 'youtube.com'){
$array = explode("&", $image_url['query']);
return "http://img.youtube.com/vi/".substr($array[0], 2)."/0.jpg";
} else if($image_url['host'] == 'www.vimeo.com' || $image_url['host'] == 'vimeo.com'){
$hash = unserialize(file_get_contents("http://vimeo.com/api/v2/video/".substr($image_url['path'], 1).".php"));
return $hash[0]["thumbnail_small"];
}
}You’ll notice that I try to determine whether the url passed to the function is either a Youtube or Vimeo link and do the proper calculations for either. You should probably add in a fallback, specific to your use case, if neither Vimeo or Youtube are found within the link passed.
For Youtube
You can change the following line of code in my script to return a different size of Youtube image:
return "http://img.youtube.com/vi/".substr($array[0], 2)."/0.jpg";
There are variations of the thumbnails available based on the thumbs set by the user when uploading on Youtube. You can change the number to get a different screenshot. Incrementing the number on the end of the image will show you the next thumbnail available:
return "http://img.youtube.com/vi/".substr($array[0], 2)."/default.jpg"; // Small Default return "http://img.youtube.com/vi/".substr($array[0], 2)."/0.jpg"; // Large Default return "http://img.youtube.com/vi/".substr($array[0], 2)."/1.jpg"; return "http://img.youtube.com/vi/".substr($array[0], 2)."/2.jpg"; return "http://img.youtube.com/vi/".substr($array[0], 2)."/3.jpg";
For Vimeo
You can change the following line of code in my script to return a different size of Vimeo image:
return $hash[0]["thumbnail_small"];
The variations available are:
return $hash[0]["thumbnail_small"];
return $hash[0]["thumbnail_medium"];
return $hash[0]["thumbnail_large"];Conclusion
The Vimeo & Youtube API’s have a lot more information that you can pull including users avatars and so on. Hopefully this little script will help bring some nice context to your users instead of a dull static link.
8 comments
-
Posted: May 18, 2011
Is there someway to do this for screenshots of homepages?
-
Posted: Nov 7, 2011
…helpful information — nice and simple, works great, thanks.
-
Posted: Nov 22, 2011
You can also see urls from YouTube like youtu.be and that case, the video id is immediately after the host.
-
Posted: Dec 6, 2011
Hi Darcy,
here is the code for youtu.be links.
//code
function video_image($url){
$image_url = parse_url($url);
if($image_url['host'] == ‘www.youtube.com’ || $image_url['host'] == ‘youtube.com’){
$array = explode(“&”, $image_url['query']);
return “http://img.youtube.com/vi/”.substr($array[0], 2).”/default.jpg”;
} else if($image_url['host'] == ‘www.youtu.be’ || $image_url['host'] == ‘youtu.be’){
$array = explode(“/”, $image_url['path']);
return “http://img.youtube.com/vi/”.$array[1].”/default.jpg”;
} else if($image_url['host'] == ‘www.vimeo.com’ || $image_url['host'] == ‘vimeo.com’){
$hash = unserialize(file_get_contents(“http://vimeo.com/api/v2/video/”.substr($image_url['path'], 1).”.php”));
return $hash[0]["thumbnail_small"];
}
}
//codeB
-
Posted: Jan 27, 2012
Thanks for this! Really a great help!
Wish the Youtube images were a bit larger though! -
Posted: Apr 13, 2012
Hey man thanks for info
in my case, to get the image, on C# i had to put the php on a WWW, then get the text, and then start to split the text to get the image, not very efficient but it worksregards from mexico
-
Posted: Apr 26, 2012
It will be easy get youtube images with above code. But the images will be particular size here, can we get images with our dimensions,
i.e, like 4:3, 3:4 etc… from youtube . -
Posted: May 16, 2012
can i get above code for asp.net-mvc3.
in my asp.net-mvc3 project need image file of any video url like youtube, vimeo, hulu video url etc.
