Youtubeの関連動画、その他の動画の非表示対策

Youtubeの埋め込み動画が終了、途中停止で関連動画、その他の動画が表示する。

以前は埋め込みコードに以下の設定を行うことで制御できていた。

?rel=0

Youtubeの仕様変更によるものだそう。

解決として、埋め込みコードをカスタムするのではなく、apiで表示の制御をするとできた。（2020/07現在）

<div class="youtube">
    <div id="iframe_player"></div>
</div>
<script>
    var tag = document.createElement('script');
    tag.src = "https://www.youtube.com/iframe_api";
    var iframePlayerApiScriptTag = document.getElementsByTagName('script')[0];
    iframePlayerApiScriptTag.parentNode.insertBefore(tag, iframePlayerApiScriptTag);

var player;
function onYouTubeIframeAPIReady() {
player = new YT.Player(‘iframe_player’, {
videoId: “Youtube動画ID”,
playerVars: {
‘modestbranding’: 1,
‘autohide’: 1,
‘controls’: 0,
‘showinfo’: 0,
‘rel’: 0,
‘autoplay’: 1
},
events: {
‘onReady’: onPlayerReady,
‘onStateChange’: onPlayerStateChange
}
});
}
function onPlayerReady(){
}
function onPlayerStateChange(event){
switch(event.data){
case YT.PlayerState.ENDED:
break;
case YT.PlayerState.PLAYING:
break;
case YT.PlayerState.BUFFERING:
break;
case YT.PlayerState.CUED:
break;
}
}
</script>

daigo.designのブログ記事「【コピペでOK】2020年版 Youtube関連動画を非表示にするソースコード」を参考