How to install a simple Random post widget on blogger blog – In my previous article, I already described the importance of the Random Post widget. You can read that article here – “Dynamic Random post widget for blogger”. So let’s move on the main topic because I’m not going to waste your time by writing boring things over here.
Before you add this simple random post on your blog, make sure to take a look of this widget by clicking on the below demo button.
After watching the demo of this widget, if you agree with it and want to install this widget, then follow the below simple steps.
At the first, visit to your blogger dashboard, Go to the “Layout” section.
Select “Add a gadget”, Choose Html/JavaScript from the popup menu.
Copy the below Html code and paste it in Html/JavaScript Box.
<ul id="random-posts"></ul>
<style scoped="" type="text/css">
#random-posts{list-style:none;margin:0;padding:0}
#random-posts li{padding:0 0 5px 0;font-size:90%;margin:5px 0;border-bottom:1px solid rgba(0,0,0,0.1)}
#random-posts li a{color:#333;font-size:12px;}
#random-posts li a:hover{color:#e73138;}
</style>
<script type='text/javascript'>
//<![CDATA[
var homePage = "ur_blog_url_here",
numPosts = 8;
function randomPosts(a){if(document.getElementById("random-posts")){var e=shuffleArray(a.feed.entry),title,link,img,content="",ct=document.getElementById("random-posts");for(var i=0;i<numPosts;i++){for(var j=0;j<numPosts;j++){if(e[i].link[j].rel=="alternate"){link=e[i].link[j].href;break}}var title=e[i].title.$t;content+='<strong><li class="random-posts"><a href="'+link+'" title="'+title+'" target="_blank">'+title+'</a></li></strong>'}ct.innerHTML=content}}function shuffleArray(arr){var i=arr.length,j,temp;if(i===0)return false;while(--i){j=Math.floor(Math.random()*(i+1));temp=arr[i];arr[i]=arr[j];arr[j]=temp}return arr}var random_post=document.createElement('script');random_post.src=homePage+'/feeds/posts/summary?alt=json-in-script&orderby=published&max-results=999&callback=randomPosts';document.getElementsByTagName('head')[0].appendChild(random_post);
//]]>
</script>Replace the above-highlighted URL with your own blog URL.
After that, save the widget, refresh your blog and see the magic.