tuchawat tuchawat - 28 days ago 9
Javascript Question

Youtube API - remove bottom-right youtube logo in the IFrame Player API method?

So If I use the normal tag iframe to embed youtube to website, I can remove youtube's logo on the bottom-right by use modestbranding=1 after VideoID
like this

<iframe width="640" height="360" src="https://www.youtube.com/embed/ADgeqLVR6EY?modestbranding=1" frameborder="0" allowfullscreen></iframe>


but if I use the IFrame Player API methd I don't know how to remove youtube logo, I put the modestbranding=1 after VideoID but it did not work.

<!DOCTYPE html>
<html>
<body>
<div id="player"></div>

<script>

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('player', {
height: '360',
width: '640',
videoId: 'QyhrOruvT1c?modestbranding=1' //it did not remove logo. :(
});
}

</script>
</body>
</html>

Answer

In YT player parameters can't be passed in videoId, use playerVars for that

player = new YT.Player('player', {
   height: '360', 
   width: '640',
   videoId: 'QyhrOruvT1c',
   playerVars: {'modestbranding':1} // <-- add this
});