Embed Youtube vids – quick setup

Home » Embed Youtube vids – quick setup

Okay real quick – this is a whittled down bit of started code from the Youtube docs. But I do find myself searching around for a while to find it every time I need to remember where to start with the Youtube api. Anyway, all I wanted was an embedded video player that I can control. Here’s how you get one going real quick!

<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('vidplayer', {
        height: '390',
        width: '640',
        videoId: 'add the youtube ID here, or the variable that houses the id',
        playerVars: { 
        'autoplay': 0,
        'controls': 0, 
        'rel' : 0,
        'fs' : 0,
        },
        events: {
        'onReady': onPlayerReady
        }
        });
      }

     //this can play the video when the player is ready to go. It's referenced above in the 'events'.
      function onPlayerReady(event) {
        // event.target.playVideo();
      }

        //this function stops the player, in case you didn't figure that out, you big smelly genius.
      function stopVideo() {
        player.stopVideo();
      }

    </script>

Your video will now be playing in the container element ‘vidplayer’

<div id="vidplayer"></div>