How to Automatically show random last video from YouTube channel in Blogger

This blog will update and show you how to embed your latest video (or random) from YouTube to Blogger so it automatically updates and you don't need to update time and again.



#1. First of all, go to your blogger dashboard or your site HTML

#2. Now you just go to the Layout section

#3. Click the ad a gadget on Sidebar Right

#4. you will see there will be open a box where you can put or

 add a gadget on the blogger layout, enter this Html code


<iframe id="youtube-frame" style="width:230px"; height: 150px;" frameborder="0" allowfullscreen></iframe>


5. then add this script bellow that html code:

fullscript :


<script>

function frx_ytb_show(autoPlay, videoID) {

    var youtube = document.getElementById("youtube-frame");

    if (youtube) {

        youtube.setAttribute("id", videoID);

        youtube.style["position"] = "relative";

        if (autoPlay) youtube.setAttribute("src", "https://www.youtube.com/embed/" + youtube.id + "?autoplay=1&autohide=1&border=0&wmode=opaque&enablejsapi=1");

        else youtube.setAttribute("src", "https://www.youtube.com/embed/" + youtube.id + "?autohide=1&border=0&wmode=opaque");

    }


function randomRange(l, h) {

    var range = (h - l);

    var random = Math.floor(Math.random() * range);

    if (random === 0) { random += 1; }

    return l + random;

}


$(document).ready(function() {

  var randomID = randomRange(5,0);

  $.get(

    "https://www.googleapis.com/youtube/v3/search",{

      part : 'snippet', 

      channelId : 'YOUR CHANNEL ID',

      type : 'video',

      key: 'YOUR YOUTUBE KEY'},

      function(data) {

        $.each( data.items, function( i, item ) {

          if(i == randomID){ frx_ytb_show(false, item.id.videoId); }

        })

      }

  );

});

</script>


6. Now you can change YOUR CHANNEL ID and YOUR YOUTUBE KEY after this you can Save

7. Now you just enter in Theme area and now you need to add a jquery library for the function number 3. add this to blogger your HTML template inside <head></head> tag :


<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js'/>


8. Finally you can save and see on your front live page you will see the view and you will feel good.




Conclusion:

I hope this guide is helpful don’t forget to leave your questions and comments below, and don’t forget to share. Blogger has always become a platform that inspires us to start our own work and motivates us. Today we knew about How to Automatically show a random last video from a YouTube channel in Blogger. Hope you follow and like this article and many other blogs.


Post a Comment

0 Comments