I understand that the ?rel=0 does not remove recommended videos any more. instead, it only shows videos from the same channel. But how do I append the ?rel=0 to an embedded URL?
I have the following JS to embed the video
(function () { var swappers = document.querySelectorAll('[data-video-id]'); console.log('video') swappers.forEach(function (swapper) { swapper.addEventListener('click', function (e) { e.preventDefault(); var wrapper = swapper.parentNode; var videoId = swapper.dataset.videoId; var source = swapper.dataset.videoSource; while (wrapper.firstChild) { wrapper.removeChild(wrapper.firstChild); } switch (source) { case 'youtube': // add youtube api code to do autoplay in safari wrapper.innerHTML = '<div id="video-'+ videoId +'"></div>'; var tag = document.createElement('script'); tag.id = 'yt-api'; tag.src = 'https://www.youtube.com/iframe_api'; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); var checkYT = setInterval(function () { if (YT.loaded) { clearInterval(checkYT); var player = new YT.Player('video-'+ videoId, { videoId: videoId, events: { 'onReady': function (e) { e.target.playVideo(); } } }); } }, 50); break; case 'vimeo': // Add Vimeo default Enbed code wrapper.innerHTML = '<iframe src="https://player.vimeo.com/video/'+ videoId +'?autoplay=1&title=0&byline=0&portrait=0"width="640" height="360" frameborder="0" allow="autoplay; fullscreen; picture-in-picture" allowfullscreen></iframe>'; break; } }); });})();
i thought adding the ?rel=0 to the url would work but since its embedded it just removes the ?rel=0. adding the rel=0 to the url doesnt work and it ends up showing videos from random channels.
here is the html
{% set url = 'https://www.youtube.com/watch?v='~block.video_id~'?rel=0' %}<div class="video_wrap"><a href="{{ url }}" data-video-id="{{ block.video_id }}" title="Play embedded video" data-video-source="{{ block.video_source ?: "youtube" }}"> {{ image|raw }}</a></div>