はじめに
Youtubeの動画やプレイリスト(再生リスト)を自分のブログやWebサイトに埋め込みはしたが、
特定の位置から再生したい場合や同一の動画をループさせたい場合などがあると思います。
そこで、今回は再生ルールの設定について紹介していきたいと思います。
目次
【再生編】動画の再生方法を設定する
- 動画を途中から再生させる
- 動画を途中で停止させる
- 動画の一部分だけを切り取って再生させる
- 動画を自動で再生させる
- 動画をループ再生させる
1. 動画を途中から再生させる
<iframe width="718" height="408" src="https://www.youtube.com/embed/動画ID?start=60" frameborder="0" allowfullscreen></iframe>
?start=秒数を追記します。例では「60」と入力したので動画の60秒から再生されます。比較的よく使うので覚えておくと非常に便利。
2. 動画を途中で停止させる
<iframe width="718" height="408" src="https://www.youtube.com/embed/動画ID?end=30" frameborder="0" allowfullscreen></iframe>
?end=秒数を追記します。例では「30」と入力したので、動画始まってから30秒後に再生が止まります。これでも途中再生と同じく、非常に便利な設定です。
3. 動画の一部分だけを切り取って再生させる
<iframe width="718" height="408" src="https://www.youtube.com/embed/動画ID?start=60&end=90" frameborder="0" allowfullscreen></iframe>
?start=秒数&end=秒数を追記する。途中再生の「start」と、途中終了の「end」を組み合わせることで、動画の一部分だけを再生させることも出来る。ものすごく使えます。
4. 動画を自動で再生させる
デフォルト設定では動画を一度クリックしないと再生されません。
記事を開いて動画が読み込まれ次第、自動で再生させて欲しい場合は以下のように設定しましょう。
<iframe width="718" height="408" src="https://www.youtube.com/embed/動画ID?autoplay=1" frameborder="0" allowfullscreen></iframe>
URL部分のすぐ後ろに?autoplay=1を追記する。
※ページを開いていきなり動画が再生されます!突然音が出るとびっくりさせてしまう可能性があるため、くれぐれも注意しましょう!!
5. 動画をループ再生させる
<iframe width="718" height="408" src="https://www.youtube.com/embed/動画ID?loop=1&playlist=動画ID" frameborder="0" allowfullscreen></iframe>
?loop=1&playlist=動画URLを追記する。埋め込んだ動画が、何度も自動でループ再生されます。
再生終了後に自身のチャンネル含め関連動画を一切表示せず、同一の動画のみを再生したい場合は現状この方法しかありません。(2019/10/31時点)
まとめ
今回は再生ルールの設定についてまとめました。特に、再生位置や自動再生の設定などは動画のプロモーションを含めサイトの演出に関わる部分なのでぜひ有効に活用してみてください!
なお、パラメータによる挙動は仕様が変更されると違ったものになるので、こまめにリファレンスをチェックして最新の情報を仕入れることが運用にとって大切になります。
次回は、海外向けページへの埋め込みの際必要となる言語設定や全画面化の禁止などの少々細かな設定について
まとめたいと思います。
参考:YouTube公式リファレンス
https://developers.google.com/youtube/player_parameters?hl=ja
関連リンク
YouTubeのWebサイト埋め込みテクニック【基本編】動画の埋め込みと設定
[YouTubeのWebサイト埋め込みテクニック【表示編】&【応用編】高度な設定]
(https://qiita.com/ktr1211/items/ae0308a320fe2edca1fc)