WebサイトにYouTubeの「最新動画」を埋め込む方法

ホームページ制作をしていると、よくYouTubeの埋め込みをそのホームページ内にすることが多いかと思います。

ただ、普通のYouTube動画の埋め込みは、その動画の埋め込みのみで、最新動画を自動的に埋め込めるようにするにはどうすればいいか、知らない方もいらっしゃるかと思います。

実は、YouTubeチャンネルの最新動画を埋め込むことは可能なので、その方法について解説していきます。

YouTubeチャンネルの最新動画を埋め込む方法

以下の手順で実現できます。

1. チャンネルIDの取得
2. チャンネルIDの先頭の文字列「UC」を「UU」に書き換える
3.「https://www.youtube.com/embed/?list=置き換えた文字列」のURLを埋め込む

そこまで難しくないので、１つずつ見ていきましょう。

1. チャンネルIDの取得

まず、YouTube動画を埋め込みたい方のYouTubeチャンネルを表示してください。

そして、このページのURLをコピーしておきます。
(僕の場合は以下のようなURLになっています。)

https://www.youtube.com/channel/UCavjtKPARTVL0JXBrFvaZFw

このURLの一番最後の部分がチャンネルIDとなり、僕の場合は以下がチャンネルIDとなります。

UCavjtKPARTVL0JXBrFvaZFw​

2. チャンネルIDの先頭の文字列「UC」を「UU」に書き換える

先ほど取得したチャンネルIDの先頭の文字列UCをUUへ置き換えます。

UUavjtKPARTVL0JXBrFvaZFw

3.「https://www.youtube.com/embed/?list=置き換えた文字列」のURLを埋め込む

最後に、2で置き換えた文字列を、以下のようなURLにします。

https://www.youtube.com/embed/?list=置き換えた文字列

僕の場合は以下のURLになりますね。

https://www.youtube.com/embed/?list=UUavjtKPARTVL0JXBrFvaZFw

後は、iframeタグで以下のように埋め込めれば完成です！

<iframe width="560" height="315" src="https://www.youtube.com/embed/?list=UUavjtKPARTVL0JXBrFvaZFw" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

ちなみに、この埋め込み方法は、アカウントにログインしなくても埋め込める方法なので、ぜひ試して見てください✨

最後まで読んでいただきありがとうございます。

仕事の生産性を上げるツールについての記事を、マガジンにまとめていますので、

「どんなものがあるんだろう？」と気になる方はぜひ見てみてください！

生産性を上げて仕事が楽しくなるツール｜たけちゃん@関わる方々を笑顔にするWebデザイナーSE｜note