Hello, In this tutorial we are going to explain you How to Add Random Posts Widget In blogger template.To keep visitors engage with your website content this is the best gadget for any blog.Whenever your webpage will refresh always the content means links of the random posts widget will be changed that means every time user will see new posts from different categories.We recommend to add this widget in blogger sidebar.
However you can install this widget anywhere inside your blogger posts.In previous post we already talked about popular posts widget.Popular post gadget display most viewed posts from your website and this random posts widget will display anypost whether it's old or new doesn't matter.So keep your users busy with your posts that will also increase the page views stay time.So to grab this widget just follow the steps mentioned below.
How to Install Random Posts Widget in Blogger Template
installation steps:
Step 1. Log in to your Blogger account and Go to your Blogger Dashboard.Step 2. Now go your Layout->Add a gadget->Select->HTML/JAVASCRIPT GADGET
Step 3. Now copy the below code and paste in your HTML/JAVASCRIPT GADGET
<ul id="bsdrandom-posts"></ul>
<style scoped="" type="text/css">
#bsdrandom-posts{list-style:none;margin:0;padding:0}
#bsdrandom-posts li{padding:0 0 5px 0;font-size:90%;margin:5px 0;border-bottom:1px solid rgba(0,0,0,0.1)}
#bsdrandom-posts li a{color:#333}
</style>
<script type='text/javascript'>
//<![CDATA[
var homePage = "http://www.bloggersstand.com",
numPosts = 5;
function randomPosts(a){if(document.getElementById("bsdrandom-posts")){var e=shuffleArray(a.feed.entry),title,link,img,content="",ct=document.getElementById("bsdrandom-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="bsdrandom-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>
Customization:
- Replace www.bloggersstand.com with your website or blog url.
- To change the posts number display on gadget,change 5 into your desired value.