Как скрыть связанные видео в конце кода вставки плейлиста YouTube?

Ответ 1

Вы должны использовать '&' при добавлении дополнительных параметров в URL. Обновите поле src следующим.

"https://www.youtube.com/embed/videoseries?list=PL4Zkb_7gMrOzZlVy7jIeCjwScavYp6ssm&rel=0"

Ответ 2

По состоянию на 25 сентября 2018 года невозможно отключить показ соответствующих видео.

Эффект от изменения заключается в том, что вы не сможете отключить похожие видео. Однако у вас будет возможность указать, что соответствующие видео, отображаемые в плеере, должны быть с того же канала, что и видео, которое только что воспроизводилось.

Чтобы быть более конкретным:

• До изменения, если значение параметра установлено на 0, проигрыватель не показывает похожие видео.
• После изменения, если для параметра rel установлено значение 0, проигрыватель будет показывать похожие видео с того же канала, что и только что воспроизведенное видео.

^{добавленный акцент}

Ответ 3

Я передал еще один параметр как '?rel=0' чтобы остановить связанные видео.
Это сработало для меня as-

'https://www.youtube.com/embed/'+someValiable_of_video_link+'?rel=0';

Надежда может работать и для других. & вместо ? не работает!

Ответ 4

YouTube запрещает скрывать похожие видео, используя rel=0 состоянию на сентябрь 2018 года.

Однако вы можете обойти это, используя API проигрывателя YouTube, чтобы показывать пользовательский 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>

Для получения самой последней версии кода, включая сокращенную версию, описание, демонстрацию и инструкции, просмотрите мою запись в блоге на эту тему.