How to embed a YouTube video, playlist or subscribe button onto your website or blog?

Hi guys,
Today I am going to tell you how you can add/embed YouTube videos, playlists and subscribe button of your channel to your website or blog. 
First of all, to do this, you must have the access to JavaScript or HTML of your website or blog.

It is a very easy task, you an do this even if you do not know much HTML.
Here is a Demo Player you can check out as a look to how your embed player looks like.

Enter the required info your way and your embed video will appear below.



This was just a demo player, to embed a video like this, you can use the HTML code below:

    <div id="player"></div>

    <script>
      // 2. This code loads the IFrame Player API code asynchronously.
      var tag = document.createElement('script');

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

      // 3. This function creates an <iframe> (and YouTube player)
      //    after the API code downloads.
      var player;
      function onYouTubeIframeAPIReady() {
        player = new YT.Player('player', {
          height: '390',
          width: '640',
          videoId: 'example', // Enter the video id you want to embed
          events: {
            'onReady': onPlayerReady,
            'onStateChange': onPlayerStateChange
          }
        });
      }

      // 4. The API will call this function when the video player is ready.
      function onPlayerReady(event) {
        event.target.playVideo();
      }

      // 5. The API calls this function when the player's state changes.
      //    The function indicates that when playing a video (state=1),
      //    the player should play for six seconds and then stop.
      var done = false;
      function onPlayerStateChange(event) {
        if (event.data == YT.PlayerState.PLAYING && !done) {
          setTimeout(stopVideo, 6000);
          done = true;
        }
      }
      function stopVideo() {
        player.stopVideo();
      }
    </script>

Here, you will have to enter you video id in the code

  height: '390',
          width: '640',
          videoId: 'example', // Enter the video id you want to embed
          events: {
            'onReady': onPlayerReady,

You can also choose the amount of time that will load on your website rest video will not be shown. Just edit this part in the HTML above;


  if (event.data == YT.PlayerState.PLAYING && !done) {
          setTimeout(stopVideo, 6000);

          done = true;

Here, '6000' is representing the amount of time of the video that will be loaded. You can change this time as your wish.

(1000 units of it means 1 second.)

Or you can try a more basic one one:

<iframe allowfullscreen="" frameborder="0" src="https://www.youtube.com/embed/example"></iframe>

Here also, change the word 'example' with your video id.

For embedding a Subscribe button in your website or blog, try this tool.

The tool below lets you configure an embedded subscription button. You can set the button's display options, preview the button, and copy the code needed to insert that button on your page.



To embed a YouTube playlist you can use this HTML code and modify it with your playlist id:

• <iframe width="560" height="315" src="https://www.youtube.com/embed/videoseries?
• list=example" frameborder="0" allow="autoplay; encrypted-media"
• allowfullscreen></iframe>

Enter your playlist id instead of the word 'example' in the above code. 

The playlist will appear almost same as a single video but on the top left you will be able to the list of all the video in the playlist and navigate through them.

Thanks for reading my article.