YouTubeの動画のサムネイル取得が思った以上に簡単だった件

YouTubeの動画のサムネイルを取得したい

クライアントさまから、「WordPressを使って、YouTubeにアップした動画を紹介したいが、動画自体はYouTubeのサイトの方で見せたい」という要望があり、 アップした動画のIDをカスタムフィールドに入れてもらって・・等を考えてたのですが、 サムネイルはどうしようかと思いYouTube側から取れないか調べてみたら、めちゃくちゃ簡単にサムネイルが取得できました。

URLを入れるだけ

参考サイトでも紹介されているように、URLを入れるだけでサムネイルが取得出来ました。
//i.ytimg.com/vi/動画ID/画像サイズ.jpg
動画IDは
//youtube.com/watch?v=xTU0K5q7Zbo
太字の部分ですね。自分でアップした動画からサムネイルを取って、一覧にしましたので、ご参考になれば幸いです。

画像|サイズ|URL ---|---|--- 120×90|120×90|http://i.ytimg.com/vi/xTU0K5q7Zbo/default.jpg 120×90|120×90|http://i.ytimg.com/vi/xTU0K5q7Zbo/1.jpg 120×90|120×90|http://i.ytimg.com/vi/xTU0K5q7Zbo/2.jpg 120×90|120×90|http://i.ytimg.com/vi/xTU0K5q7Zbo/3.jpg 320x180|320×180|http://i.ytimg.com/vi/xTU0K5q7Zbo/mqdefault.jpg 480x360|480×360|http://i.ytimg.com/vi/xTU0K5q7Zbo/hqdefault.jpg 480x360|480×360|http://i.ytimg.com/vi/xTU0K5q7Zbo/0.jpg 640x480|640×480|http://i.ytimg.com/vi/xTU0K5q7Zbo/sddefault.jpg 1280x720|1280×720|http://i.ytimg.com/vi/xTU0K5q7Zbo/maxresdefault.jpg

動画をアップした際にYouTube側で自動的に抽出される、3つのサムネイルがそれぞれあるみたいですね。 カスタムサムネイルを入れていると、そちらがdefaultに設定されるようです。また、上下に黒い帯がついているのは、公式APIで説明されていました。

アップロードされたサムネイル画像が必要な寸法に一致しない場合、その画像はアスペクト比を変更することなく、正しいサイズに合わせてサイズ変更されます。画像はトリミングされませんが、サイズが正しくなるように黒いバーが含まれる場合があります。 Thumbnails – YouTube Google Developers より引用

Author

Michinobu Nishimoto

記事を書いてる人: 日本のWeb制作会社に約2年半フロントエンドとして働いた後、カナダのバンクーバーで語学学校->専門学校->Web制作会社にフロントエンドとして就職。 現在は現地のスタートアップでフロントエンドに従事している。

See Also