Monday, September 19, 2016

How to add Random Post Widget in Blogger

How to add Random Post Widget in Blogger

Random Posts Widget For Blogger is great widget. Posts Widget for Blogger is random most popular flash which is useful to increase traffic. make the visitor stay on your site longer and to increase page views posts.Each time updates page of your blog posts widget random change. It can be shown in the sidebar of your blog with or without thumnails.Really this is the jewel of the flash really should show up on his blog.



In Blogger, we can add widgets or gadgets in order to make posts from the blogs appear on the sidebar. Blogger natively keeps the stats of post views and so it has an official gadget which we can use to display popular posts. Then there are ways to use the blogger post feed to display the most recent posts or even random posts.

Note: For the plugins below to work, jquery must already be included in your template.

Display Simple Random Posts in Blogger / Blogspot

  1. Go to your Layout editor of your blog, where you want to add a random posts gadget.
  2. Click on the “Add a Gadget” link, a popup will follow.
  3. In the popup, select “HTML/JavaScript”, gadget and click on its title or the ‘+’ button to add it.
  4. Give your widget a title like “Random Posts”, or “You may Like” for example.
  5. Add the following code to the “Content” area. Press save when you are done. Your Blogger blog now will now display random posts in the template.

Add Simple Random Post Widget on Blogger (without thumbnail image)

<script type="text/javascript">

var acakarray = new Array();var l=0;var flag;

var numofpost=9;function randomposts(json){

var total = parseInt(json.feed.openSearch$totalResults.$t,10);

for(i=0;i < numofpost;){flag=0;acakarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in acakarray){if(l==acakarray[j]){ flag=1;}}

if(flag==0&&l!=0){acakarray[i++]=l;}}document.write('<ul>');

for(n in acakarray){ var p=acakarray[n];var entry=json.feed.entry[p-1];

for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item = "<li>" + "<a href=" + entry.link[k].href + ">" + entry.title.$t + "</a> </li>";

document.write(item);}}

}document.write('</ul>');}

</script>

<script src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script>

Add Random Post Widget with Thumbnail in Blogger

<style type="text/css">
ul.rdpost {line-height: 1.2;}
ul.rdpost li{list-style:none;margin:0;overflow:hidden;padding: 0.7em 0px;}
ul.rdpost .rdthumbs{float:left;margin:0 5px 5px 0}
ul.rdpost strong{display:block}
ul.rdpost p{margin:5px 0 11px}
ul.rdpost .date{font-size:11px}
ul.rdpost .rdcomments{padding-left:5px;border-left:1px solid #969191}
</style>
<script type='text/javaScript'>
var rdnumposts=5;
var rdsnippet_length=150;
var rdcomment='Comments';
var rddisable='Comments Disabled';
var rdinfo='yes';
var rdcurpost=[];var rdtotal_posts=0;var rdcurpost=new Array(rdnumposts);function totalposts(json){rdtotal_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<rdnumposts;i++){var found=false;var rndValue=get_random();for(var j=0;j<rdcurpost.length;j++){if(rdcurpost[j]==rndValue){found=true;break}};if(found){i--}else{rdcurpost[i]=rndValue}}};function get_random(){var ranNum=1+Math.round(Math.random()*(rdtotal_posts-1));return ranNum};
document.write('<ul class="rdpost">');
</script>
<script type="text/javascript" src="https://googledrive.com/host/0B9VnchIrte6hYXQyQVpaZ01SSjA/"></script>

Configurable Options:

rdnumbepost=5 – The number of random posts you want to display.
rdsnippet_length=100 – Length of your post snippet alongside the thumbnail.
var rdcomment=’Comments’ – Text for your “comments”. Leave it as it is.
rdinfo=”yes”– Set this to anything else to hide the date and comments info.

0 comments

Post a Comment