OTHER

YouTube の関連動画を非表示にする方法

YouTube の関連動画を非表示にする方法

YouTube の動画埋め込みで表示される関連動画や次の動画を非表示にする方法を紹介します。

  1. 以前の関連動画の制御の仕様
  2. 関連動画を非表示にする方法
    1. 表示している動画以外に動画をアップしないで非表示にする
    2. 動画をループ再生にして関連動画を表示させない

以前の関連動画の制御の仕様

動画埋め込みの関連動画を非表示にするには、YouTube ID の後に ?rel=0 を追加します。

<iframe width="560" height="315" src="https://www.youtube.com/embed/cKf4cqx3MXQ?rel=0" frameborder="0" allow="accelerometer; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

?rel=0 を指定した場合の表示は次のようになります。

関連動画を表示

関連動画を非表示(?rel=0追加)

以前は youtube パラメーターに ?rel=0 を指定することで、関連動画を非表示にすることができましたが、2018年9月の YouTube の仕様変更により、動画再生後の関連動画の表示・非表示の制御ができなくなりました。

現在は、パラメーターの値によって次の動作をします。

0 の場合 ?rel=0
動画をアップしたチャンネル内から関連動画表示
1 の場合 ?rel=1
外部のチャンネルから関連動画を表示

関連動画を非表示にする方法

表示している動画以外に動画をアップしないで非表示にする

パラメーターで ?rel=0 を指定した場合に、
マイチャンネルにアップした画像が関連動画として表示されるので、
表示している動画以外に動画がアップしないことで関連動画を非表示にすることができます。

動画をループ再生にして関連動画を表示させない

動画をループ再生することで関連動画を表示させないようにすることができます。
ループ再生は、src のURL指定の最後の youtubeID 指定の後に続けて、
?loop=1&playlist=youtubeID を追加します。

<iframe width="560" height="315" src="https://www.youtube.com/embed/cKf4cqx3MXQ?loop=1&playlist=cKf4cqx3MXQ" frameborder="0" allow="accelerometer; autoplay; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>

まとめ

YouTube の動画埋め込みで表示される関連動画や次の動画を非表示にする方法を紹介しました。
企業や教育関係の案件では関連動画の表示は気になるところ。埋め込み動画を使う場合の YouTube の挙動については、今後の動向もチェックしつつクライアントに詳しく説明するように心がけましょう。
そのほかYouTube 動画の埋め込みをレスポンシブ対応する方法はこちらをご覧ください。