web-dev-qa-db-ja.com

YouTube埋め込み動画の最後に関連動画を削除する方法は？

埋め込み動画を取得して、ウェブサイトに埋め込まれたYouTube動画の最後で表示を停止しようとしています。 ?rel=0を試しましたが、機能しません。他のアイデアはありますか？

videoyoutubeurl-parameters
6
eric

2018年9月の時点で、YouTubeは関連動画を削除することを不可能にしました。これからは常に関連動画を取得します。

3
user3658931

YouTube rel=0パラメーターを変更 2018年9月の時点で、関連するビデオが完全に無効化されなくなりました。

ただし、YouTube Player APIを使用してこの問題を回避し、関連動画の代わりにカスタムHTMLを表示できます。

以下に、関連するビデオを非表示にして、ビデオが完了するとカスタムの「再生」ボタンを表示するコードの例を示します。

<style>
    #playerWrap {
        display: inline-block;
        position: relative;
    }
    #playerWrap.shown::after {
        content:"";
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        right: 0;
        cursor: pointer;
        background-color: black;
        background-repeat: no-repeat;
        background-position: center; 
        background-size: 64px 64px;
        background-image: url(data:image/svg+xml;utf8;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxMjgiIGhlaWdodD0iMTI4IiB2aWV3Qm94PSIwIDAgNTEwIDUxMCI+PHBhdGggZD0iTTI1NSAxMDJWMEwxMjcuNSAxMjcuNSAyNTUgMjU1VjE1M2M4NC4xNSAwIDE1MyA2OC44NSAxNTMgMTUzcy02OC44NSAxNTMtMTUzIDE1My0xNTMtNjguODUtMTUzLTE1M0g1MWMwIDExMi4yIDkxLjggMjA0IDIwNCAyMDRzMjA0LTkxLjggMjA0LTIwNC05MS44LTIwNC0yMDQtMjA0eiIgZmlsbD0iI0ZGRiIvPjwvc3ZnPg==);
    }
</style>
<div>
    <div id="playerWrap">
        <iframe
            width="640" height="360"
            src="https://www.youtube.com/embed/0sDg2h3M1RE?enablejsapi=1"
            frameborder="0"
        ></iframe>
    </div>
</div>
<script>
  var playerFrame = document.currentScript.previousElementSibling.children[0].children[0];

  var tag = document.createElement('script');
  tag.src = "https://www.youtube.com/iframe_api";
  var firstScriptTag = document.getElementsByTagName('script')[0];
  firstScriptTag.parentNode.insertBefore(tag, firstScriptTag);

  var player;
  function onYouTubeIframeAPIReady() {
    player = new YT.Player(playerFrame, {
      videoId: 'M7lc1UVf-VE',
      events: {
        'onStateChange': onPlayerStateChange
      }
    });
  }

  function onPlayerStateChange(event) {
    if (event.data == YT.PlayerState.ENDED) {
        document.getElementById("playerWrap").classList.add("shown");
    }
  }

  document.getElementById("playerWrap").addEventListener("click", function() {
    player.seekTo(0);
    document.getElementById("playerWrap").classList.remove("shown");
  });
</script>

詳細な説明、詳細、手順と一緒に縮小されたコードについては、 テーマに関するブログ投稿を表示 。

2
Maximillian Laumeister

これを試して ：

https://your_youtube_embeded_link?rel=0&showinfo=0

サンプル ：

<iframe src="https://www.youtube.com/embed/h-_gFbNF80s?rel=0&amp;showinfo=0" ></iframe>

rel=0は、YouTube埋め込み動画の終わりに関連動画を削除します

showinfo=0は、上部のyoutubeプレーヤー内のタイトルを削除します

詳細： YouTube埋め込みプレーヤーとプレーヤーパラメータ

1
Andhi Irawan