4 Simple Steps to Add Random Post in Blogger with Pictures

How to Add Random Post in Blogger with Pictures
4 Simple Steps to Add Random Post in Blogger with Pictures

Hi friends, welcome to the Izzyaccess Blogger tutorial, today I will be showing you how you can add random post in Blogger blog with thumbnail and without thumbnail with pictures.

How to Add Random Post in Blogger with Pictures

Blogger only has popular posts gadget but Blogger do not have the widget to display your old posts called Random post, so today, I will show you how to enable Random post widget that will display your older posts randomly.

Following The Below Steps:
Step 1: Go to Blogger Layout and click on the Add a Gadget button.
Step 2: Then click the HTML/JavaScript gadget.
4 Simple Steps to Add Random Post in Blogger with Pictures

Step 3: Now paste the code below and click to Save button.
4 Simple Steps to Add Random Post in Blogger with Pictures
For Random Posts with thumbnail

4 Simple Steps to Add Random Post in Blogger with Pictures

<style>

#bo-random-posts img{background:#fff;height:50px;float:left;width:50px;margin:5px 5px 0px 0px;-webkit-border-radius:50%;border-radius:50%;-moz-border-radius:50%;padding:3px;}

#bo-random-posts img:hover{opacity: 0.5;filter: alpha(opacity=50);}

ul#bo-random-posts {list-style-type: none;background-image: url("");background-repeat: no-repeat;}

#bo-random-posts li {margin: 10px 0;}

#bo-random-posts li a{padding: 5px 0;text-decoration: none;}

.bo-random-summary {display: block;}

</style>

<ul id='bo-random-posts'>

<script>

var borp_number = 5;

var borp_details = 'yes';

var borp_chars = 60;

var borp_details2 = 'no';

var borp_comments = 'Comments';

var borp_commentsd = 'Comments Disabled';

var borp_current = [];

var total_randomposts = 0;

var borp_current = new Array(borp_number);

function randomposts(json) { total_randomposts = json.feed.openSearch$totalResults.$t}

document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=randomposts\"><\/script>');

function getvalue(){for(var r=0;r<borp_number;r++){for(var n=!1,o=get_random(),t=0;t<borp_current.length;t++)if(borp_current[t]==o){n=!0;break}n?r--:borp_current[r]=o}}function get_random(){return 1+Math.round(Math.random()*(total_randomposts-1))}

</script>

<script>function random_posts(t){for(var e=0;e<borp_number;e++){var r=t.feed.entry[e],s=r.title.$t;if("content"in r)i=r.content.$t;else if("summary"in r)i=r.summary.$t;else var i="";if((i=i.replace(/<[^>]*>/g,"")).length<borp_chars)var a=i;else{var n=(i=i.substring(0,borp_chars)).lastIndexOf(" ");a=i.substring(0,n)+"&#133;"}for(var o=0;o<r.link.length;o++){if("thr$total"in r)var l=r.thr$total.$t+" "+borp_comments;else l=borp_commentsd;if("alternate"==r.link[o].rel){var m=r.link[o].href,c=r.published.$t;if("media$thumbnail"in r)var u=r.media$thumbnail.url;else u="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7fnZtrk7svp0Dtyp09y9PnGPM9goHwnmM75Wvy4NVPuQvHEQSxp8p454YQCstcEbTTTfLcUA6j38v1GhaoAhMuryGE872YxJa2JdvaK1QZMgjXRPU8-DrjJimMMfoJwR_EvAvNeklmRb_/s1600/no_thumb.png"}}document.write("<li>"),document.write('<img alt="'+s+'" src="'+u+'"/>'),document.write('<div><a href="'+m+'" rel="nofollow">'+s+"</a></div>"),"yes"==borp_details&&document.write("<span>"+c.substring(8,10)+"."+c.substring(5,7)+"."+c.substring(0,4)+" - "+l),"yes"==borp_details2&&document.write('<span class="random-summary">'+a),document.write('<div style="clear:both"></div></li>')}}getvalue();for(var i=0;i<borp_number;i++)document.write('<script type="text/javascript" src="/feeds/posts/default?alt=json-in-script&start-index='+borp_current[i]+'&max-results=1&callback=random_posts"><\/script>');</script><a href='https://rb.gy/wvm08v' rel='dofollow'>.</a>

</ul>


Random Posts without thumbnail



4 Simple Steps to Add Random Post in Blogger with Pictures

<style>

#bo-rp-box{float:left;margin-bottom:10px;margin-top:0px;}

#bo-rp-box ul{margin:0px;float:left;margin-left:20px;padding:0px;}

#bo-rp-box li{vertical-align:middle;list-style:disc outside url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinPXrZxZ2P8vqmkllYG_HdKeKVDm9_s-xgju9HZ0cnbMVlJsN61_jXFUA4NwvSuxokJCIni9T9Bt3kkXYiLHpQW8B60YSEo85YgHsBPlQqniQYY9wpRWY2K_GYlqYl1SGriVT6ejlE4owi/s1600/b1.png"); margin-bottom:0;width:auto;margin-top:0;padding:10px 0;}

#bo-rp-box a{color:#0F0F0F;text-decoration:none;font-size:14px}

#bo-rp-box a:visited {text-decoration: none;color:blue;}

#bo-rp-box a:hover{color:blue}

</style>

<script>

function rp_results_label(r){for(var e=0;e<r.feed.entry.length;e++){var l=r.feed.entry[e];rpTitles[rpTitlesNumb]=l.title.$t;for(var t=0;t<l.link.length;t++)if("alternate"==l.link[t].rel){rpUrls[rpTitlesNumb]=l.link[t].href,rpTitlesNumb++;break}}}function removeRandomDuplicate(){for(var r=new Array(0),e=new Array(0),l=0;l<rpUrls.length;l++)contains(r,rpUrls[l])||(r.length+=1,r[r.length-1]=rpUrls[l],e.length+=1,e[e.length-1]=rpTitles[l]);rpTitles=e,rpUrls=r}function contains(r,e){for(var l=0;l<r.length;l++)if(r[l]==e)return!0;return!1}function showRandomLabels(){for(e=0;e<rpUrls.length;e++)rpUrls[e]==currentposturl&&(rpUrls.splice(e,1),rpTitles.splice(e,1));var r=Math.floor((rpTitles.length-1)*Math.random()),e=0;for(rpTitles.length>1&&document.write("<ul>");e<rpTitles.length&&e<20&&e<maxresults;)document.write('<li><a href="'+rpUrls[r]+'">'+rpTitles[r]+"</a></li>"),r<rpTitles.length-1?r++:r=0,e++;document.write("</ul>")}var rpTitles=new Array,rpTitlesNumb=0,rpUrls=new Array;

</script>><a href='https://rb.gy/wvm08v' rel='dofollow'>.</a>

<div id="bo-rp-box">

<script src="/feeds/posts/default?alt=json-in-script&amp;callback=rp_results_label&amp;max-results=10"></script>

<script>

var currentposturl="";

var maxresults=10;

removeRandomDuplicate(); showRandomLabels();

</script>

</div>

Step 4: Now open the Blogger blog.

Post a Comment

0 Comments