Are you looking to get the thumbnail of the YouTube, Vimeo, and Dailymotion videos? These 3 are the most popular video sharing websites on the internet. Each of these platforms allows users to fetch the video thumbnail of their videos. In this article, we see how to get the thumbnail using the video URL of these platforms.
When you integrate a video gallery on the websites, you should display the video thumbnails. And then on click of the thumbnail, a related video should play. Embedding videos using an iframe tag is not recommended. It takes a lot of bandwidth of a server and increases the page size.
I am going to write a code that gets the thumbnail of the video through a video URL. On click of these thumbnails, you can play your videos using the fancybox or any other custom solutions you prefer.
Having said that, let’s see one by one how to get thumbnails of YouTube, Vimeo, and Dailymotion videos.
Get Thumbnail from YouTube Video URL
For our tutorial, I assume you are passing the video URL to get the thumbnail of a video. In the case of YouTube, there are several types of valid URLs available. Below are the valid URLs of YouTube video:
- https://youtu.be/VIDEO_ID
- https://www.youtube.com/embed/VIDEO_ID
- https://www.youtube.com/watch?v=VIDEO_ID
The below method extracts the video id from any of the above URL formats.
<?php function extractVideoID($url){ $regExp = "/^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/"; preg_match($regExp, $url, $video); return $video[7]; } ?>
Once you extracted the video id from the URL, you can easily get thumbnail of video using the below method:
<?php function getYouTubeThumbnailImage($video_id) { return "//i3.ytimg.com/vi/$video_id/hqdefault.jpg"; } ?>
Here, we are fetching the default thumbnail with hqdefault.jpg
. One can pass different values like 0.jpg
, 1.jpg
to get different thumbnail size.
So, our final code to get thumbnail from YouTube video URL is:
<?php function extractVideoID($url){ $regExp = "/^.*((youtu.be\/)|(v\/)|(\/u\/\w\/)|(embed\/)|(watch\?))\??v?=?([^#\&\?]*).*/"; preg_match($regExp, $url, $video); return $video[7]; } function getYouTubeThumbnailImage($video_id) { return "https://i3.ytimg.com/vi/$video_id/hqdefault.jpg"; //pass 0,1,2,3 for different sizes like 0.jpg, 1.jpg } $video_url = 'YOUTUBE_VIDEO_URL'; $video_id = extractVideoID($video_url); $thumbnail = getYouTubeThumbnailImage($video_id); echo "<img src='$thumbnail' />"; ?>
Get Thumbnail from Vimeo and Dailymotion Videos
While searching for solution on extracting video id from Vimeo and Dailymotion video URLs I found this resource. I used their method to extract video id from video URLs of Vimeo and Dailymotion. This method supports all valid URL formats of Vimeo and Dailymotion videos.
In case of fetching thumbnail of Vimeo videos, the code will be as follows:
<?php function getVimeoId($url) { if (preg_match('#(?:https?://)?(?:www.)?(?:player.)?vimeo.com/(?:[a-z]*/)*([0-9]{6,11})[?]?.*#', $url, $m)) { return $m[1]; } return false; } function getVimeoThumb($id) { $arr_vimeo = unserialize(file_get_contents("https://vimeo.com/api/v2/video/$id.php")); return $arr_vimeo[0]['thumbnail_small']; // returns small thumbnail // return $arr_vimeo[0]['thumbnail_medium']; // returns medium thumbnail // return $arr_vimeo[0]['thumbnail_large']; // returns large thumbnail } $video_url = 'VIMEO_VIDEO_URL'; $video_id = getVimeoId($video_url); $thumbnail = getVimeoThumb($video_id); echo "<img src='$thumbnail' />"; ?>
For Vimeo video, we can use 3 values like thumbnail_small, thumbnail_medium, thumbnail_large to get small, medium, and large sizes of thumbnail respectively.
Finally, the code to get the thumbnail of the Dailymotion video is as follows.
<?php function getDailyMotionId($url) { if (preg_match('!^.+dailymotion\.com/(video|hub)/([^_]+)[^#]*(#video=([^_&]+))?|(dai\.ly/([^_]+))!', $url, $m)) { if (isset($m[6])) { return $m[6]; } if (isset($m[4])) { return $m[4]; } return $m[2]; } return false; } function getDailymotionThumb($id) { $thumbnail_large_url = 'https://api.dailymotion.com/video/'.$id.'?fields=thumbnail_360_url'; //pass thumbnail_360_url, thumbnail_480_url, thumbnail_720_url, etc. for different sizes $json_thumbnail = file_get_contents($thumbnail_large_url); $arr_dailymotion = json_decode($json_thumbnail, TRUE); $thumb = $arr_dailymotion['thumbnail_360_url']; return $thumb; } $video_url = 'DAILYMOTION_VIDEO_URL'; $video_id = getDailyMotionId($video_url); $thumbnail = getDailymotionThumb($video_id); echo "<img src='$thumbnail' />"; ?>
I hope you understand how to get the thumbnail of YouTube, Vimeo, and Dailymotion Videos. If you are using any other method to achieve this, please let me know in the comment section below.
Related Articles
- Get YouTube Video List By Keywords Using YouTube Search API and JavaScript
- YouTube API – How to Get List of YouTube Videos of Your Channel
- How to Use YouTube API to Upload Video on YouTube Channel
If you liked this article, then please subscribe to our YouTube Channel for video tutorials.
Thanks a lot!!!
How to create script in spreadsheet for grab vimeo thumnail based o vimeo link in cell?
how to download dailymotion video?
Hi! Nice tutorial!
Just to say that “fields=thumbnail_large_url” is now deprecated for Dailymotion.
You should replace it with “thumbnail_360_url” or “thumbnail_480_url”, etc. (depends on size you want)
(API reference link : https://developer.dailymotion.com/api#video)
Thanks for the updates. Will go through it and update the article.