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 の仕様変更により、動画再生後の関連動画表示・非表示の制御ができなくなりました。

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

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

上記の経緯を踏まえた上で、関連動画を非表示にする方法を紹介します。

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

パラメーターで ?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 動画の埋め込みをレスポンシブ対応する方法はこちらをご覧ください。