Awesome Random Posts Widget for blogger Blog

random posts widget

Random Posts widget is an awesome widget for your Blogger Blog.Most important feature of this widget is it lets your Blog visitors surf more blog posts in your blog.Surely it increases your Blog’s internal links that let your blog higher traffic.
It let your users spend more time on your Blog.
Also, it is a search engine optimisation strategy. When search engine crawlers come to crawl your pages, it sees these links to random posts and increases internal links.

Install Random posts widget

Make sure you are Sign In to your Blogger Account.

If you are a beginner in Blogger Editing, use our one click Widget

  • Click the below Add to Blogger Button to install

Manually Add Random posts Widget

  • Sign In to your Blogger Account.
  • Go to Design->Page Elements
  • Click on Add Gadget and look for HTML/Javascript take it
  • Give the title as you need(eg: Random Posts)
  • Copy and paste the below code into the content section
<style type="text/css">
.noop-random-posts ul li {
    list-style-image: url("https://2.bp.blogspot.com/-90ErnmngIVo/TyPTnufu8cI/AAAAAAAAADs/ndQtxxa6kkI/s1600/tick+list+style.png");
}
</style>
<div class="noop-random-posts"><script type="text/javascript">
    var randarray = new Array();var l=0;var flag;
    var numofpost=5;function nooprandomposts(json){
    var total = parseInt(json.feed.openSearch$totalResults.$t,10);
    for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
    if(flag==0&&l!=0){randarray[i++]=l;}}document.write('<ul>');
    for(n in randarray){ var p=randarray[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><a href="http://www.netoopsblog.com" style="font-size:0pt">Blogger Widgets</a>
<script type="text/javascript" src="/feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=nooprandomposts"></script></div>

Click on Save and its Done…If you have any doubts don’t hesitate to ask.Please Comment.
I hope you had enjoyed this post.Leave Comments…

23 Responses to “Awesome Random Posts Widget for blogger Blog

  • hey plz make it colorful as colorful popular posts. 🙂

  • Please Give me the correct working code. send or publish code that what you are using.particularly in YOUR blog please. it's good looking above. ^ asap give me the code in a text format. .

  • blog walking…:)

  • Thanks i will try and reply

  • Go to Template-> Edit HTML and find ]]></b:skin> and paste the below code above it
    .noop-random-posts ul {
    list-style-type: none;
    margin: 0;
    padding: 5px 0;
    }
    .noop-random-posts ul li {
    border: 0 none;
    margin: 5px 0;
    padding: 10px;
    position: relative;
    }
    .noop-random-posts ul li:first-child {
    background: none repeat scroll 0 0 #FF4C54;
    width: 97%;
    }
    .noop-random-posts ul li:first-child:after {
    content: "1";
    }
    .noop-random-posts ul li:first-child + li {
    background: none repeat scroll 0 0 #FF764C;
    width: 87%;
    }
    .noop-random-posts ul li:first-child + li:after {
    content: "2";
    }
    .noop-random-posts ul li:first-child + li + li {
    background: none repeat scroll 0 0 #FFDE4C;
    width: 84%;
    }
    .noop-random-posts ul li:first-child + li + li:after {
    content: "3";
    }
    .noop-random-posts ul li:first-child + li + li + li {
    background: none repeat scroll 0 0 #C7F25F;
    width: 81%;
    }
    .noop-random-posts ul li:first-child + li + li + li:after {
    content: "4";
    }
    .noop-random-posts ul li:first-child + li + li + li + li {
    background: none repeat scroll 0 0 #33C9F7;
    width: 78%;
    }
    .noop-random-posts ul li:first-child + li + li + li + li:after {
    content: "5";
    }
    .noop-random-posts ul li:first-child + li + li + li + li + li {
    background: none repeat scroll 0 0 #7EE3C7;
    width: 75%;
    }
    .noop-random-posts ul li:first-child + li + li + li + li + li:after {
    content: "6";
    }
    .noop-random-posts ul li:first-child + li + li + li + li + li + li {
    background: none repeat scroll 0 0 #F6993D;
    width: 72%;
    }
    .noop-random-posts ul li:first-child + li + li + li + li + li + li:after {
    content: "7";
    }
    .noop-random-posts ul li:first-child + li + li + li + li + li + li + li {
    background: none repeat scroll 0 0 #F59095;
    width: 69%;
    }
    .noop-random-posts ul li:first-child + li + li + li + li + li + li + li:after {
    content: "8";
    }
    .noop-random-posts ul li:first-child + li + li + li + li + li + li + li + li {
    background: none repeat scroll 0 0 #C7F25F;
    width: 66%;
    }
    .noop-random-posts ul li:first-child + li + li + li + li + li + li + li + li:after {
    content: "9";
    }
    .noop-random-posts ul li:first-child:after, .noop-random-posts ul li:first-child + li:after, .noop-random-posts ul li:first-child + li + li:after, .noop-random-posts ul li:first-child + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li + li + li + li:after, .noop-random-posts ul li:first-child + li + li + li + li + li + li + li + li:after {
    background: none repeat scroll 0 0 #353535;
    border-radius: 50% 50% 50% 50%;
    color: #FFFFFF;
    font-size: 25px;
    height: 30px;
    position: absolute;
    right: -17px;
    text-align: center;
    top: 1px;
    width: 30px;
    }

    .noop-random-posts ul li a {
    color: #444444;
    font-size: 13px;
    text-decoration: none;
    }

  • to remove list bullet style, add this with the above code
    .noop-random-posts ul li {
    list-style-image: none;
    }

  • Thank you Very much Valsaraj R.. All your blog post very helpful to me & also your blog is very beautiful 😀
    Keep it up m/

  • Hey thank u so much admin.. it looks beautiful… But there is little gap between widget heading and content…
    http://www.yogeshgamer.com/
    please take a look at "Random Games" widget. 🙂

  • Dok Simon
    6 years ago

    Works perfect for me

  • Tafaseel Ontha
    6 years ago
  • Greate work. Hi everyone. I see a template here. It is so cool. hic..But i have not enough money. Everyone can sell it for me with 15$? http://themeforest.net/item/nami-press/6166852, :(. Thanks

  • i want to add a widget on my blog side bar. Please give gudlines.
    Thanks

  • Bro,can you share widget mashable on top right side this website ??
    I've been looking arround but nothing to be found.
    Regardz.

  • admin , your blog is goody good,
    plz tell what is your template
    http://black-king-soft.blogspot.com/

  • It's working. Thank you.

  • Nice Post

    Free Download Happy New Year 2015 Wallpapers

    Happy New Year 2015 Wallpapers

  • thank you,I see a great here,every can tell me,where can download?
    http://www.myoffer.top

  • nice sharing of information from you i have applied to my blog latest updates and news online

  • well this is great website with lot of new thing i 'ev seen.Kepp it up bro very well website .
    i have also the website but not like this http://www.ilikeinfoo.com

Leave a Reply to Tech Gear Cancel reply

Your email address will not be published. Required fields are marked *