Blogger Random Post Widget with Thumbnail and ScrollBar

Scrollable Random post widget with small thumbnail for adding more most names in less space of right side bar.

Random post Widget is one of most important widget for a blogger blog to connect different post pages to any single page.

It helps to display a set of custom generated post names from your published post without and sorting like popular posts or recently posted ones. It alternately displays all published posts, but a minimum number at a time, which you can set for

                                                                   eg: 10 or 15

Right sidebar is a place where to display more widgets, so space is an important problem here, so we had adder a limited space for this random post widget but the same time added scroll bar to adjust maximum number of posts within a limited space. 

How to install Random Post Widget 

• Go to Blogger Layout
• Add new Widget, HTML/JS widget
• Paste the Below Code In it Click Save

<div style="overflow:auto;width:340px;   height:400px;  padding:12px;">


<style>#random-posts img{float:left;margin-right:10px;border:1px solid #999;background:#FFF;width:30px;height:30px;padding:3px}</style>
<ul id='random-posts'>
<script type='text/javaScript'>
var rdp_numposts=15;
var rdp_snippet_length=150;
var rdp_info='yes';
var rdp_comment='Comments';
var rdp_disable='Comments Disabled';
var rdp_current=[];var rdp_total_posts=0;var rdp_current=new Array(rdp_numposts);function totalposts(json){rdp_total_posts=json.feed.openSearch$totalResults.$t}document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=totalposts\"><\/script>');function getvalue(){for(var i=0;i<rdp_numposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<rdp_current.length;j++){if(rdp_current[j]==rndValue){found=true;break}};if(found){i--}else{rdp_current[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(rdp_total_posts-1));return ranNum};
</script>
<script type='text/javaScript'>
function random_posts(json){for(var i=0;i<rdp_numposts;i++){var entry=json.feed.entry[i];var rdp_posttitle=entry.title.$t;if('content'in entry){var rdp_get_snippet=entry.content.$t}else{if('summary'in entry){var rdp_get_snippet=entry.summary.$t}else{var rdp_get_snippet="";}};rdp_get_snippet=rdp_get_snippet.replace(/<[^>]*>/g,"");if(rdp_get_snippet.length<rdp_snippet_length){var rdp_snippet=rdp_get_snippet}else{rdp_get_snippet=rdp_get_snippet.substring(0,rdp_snippet_length);var space=rdp_get_snippet.lastIndexOf(" ");rdp_snippet=rdp_get_snippet.substring(0,space)+"&#133;";};for(var j=0;j<entry.link.length;j++){if('thr$total'in entry){var rdp_commentsNum=entry.thr$total.$t+' '+rdp_comment}else{rdp_commentsNum=rdp_disable};if(entry.link[j].rel=='alternate'){var rdp_posturl=entry.link[j].href;var rdp_postdate=entry.published.$t;if('media$thumbnail'in entry){var rdp_thumb=entry.media$thumbnail.url}else{rdp_thumb="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihZVI1JrbokP3ZyHmIQynIGc6FUuIjwz5iSnT7-NCRXDfWP-qG-RF7gnAtAQ0LlNbY1ue3m8T8cu0ZoUhol3uUBc7LXNgI5As9m7KnyVZDGNqfBPKCU_dv8FyvRSAw3m4oS3cWYXWa9AA/s1600/na_image.jpg"}}};document.write('<li>');document.write('<img alt="'+rdp_posttitle+'" src="'+rdp_thumb+'"/>');document.write('<div><a href="'+rdp_posturl+'" rel="nofollow" title="'+rdp_snippet+'">'+rdp_posttitle+'</a></div>');if(rdp_info=='yes')
document.write('<div style="clear:both"></div></li>')}};getvalue();for(var i=0;i<rdp_numposts;i++){document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index='+rdp_current[i]+'&max-results=1&callback=random_posts\"><\/script>')};</script></ul><center><a href="http://makegeeks.blogspot.com/2013/12/blogger-random-post-widget-with.html" target="_blank"> Get This Widget �</a></center></div>                                                                                                                        

Customization

• Change 15 for setting number of posts names to be displayed in the widget.
• You can set the  width:340px;   height:400px; according to the size of your right sidebar. 
• You are Done