X Close
T Wednesday, October 01, 2014

Random Posts Widget For Blogger

fahim raza 9 Comments so far
Random posts widget for blogger

Every blogger has a popular post widget in his blog similarly many bloggers are using a new widget called Random posts widget in their blogs in order to increase page views. How does it help in increasing page views?  well because this widget is displayed on right or left side of your blog posts so when a visitor reads your posts it attracts him because of its good look and the content in which he is interested. One of its most important feature is that when one post is clicked and opened then this gadget will show new posts(it works in a way that it show random posts) so it helps you to increase your page views.

Those bloggers who want to increase their blog traffic must have this widget in their blog. So in this post I am going to share a very useful gadget with you, to add this widget to your blog follow below steps:

Screenshot:



random post widget for blogger

(1). Go to blogger and click Layout.

(2). On the layout page click add a gadget and copy the below code and paste it in Html/javascript tab. 


<ul id="random-posts">
<script>
var randomposts_number = 5;
var randomposts_chars = 0;
var randomposts_details = 'no';
var randomposts_thumbnails = 'no'
var randomposts_comments = 'Comments';
var randomposts_commentsd = 'Comments Disabled';
var randomposts_current = [];
var total_randomposts = 0;
var randomposts_current = new Array(randomposts_number);

function randomposts(json) {
    total_randomposts = json.feed.openSearch$totalResults.$t
}
document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&max-results=0&callback=randomposts\"><\/script>');

function getvalue() {
    for (var i = 0; i < randomposts_number; i++) {
        var found = false;
        var rndValue = get_random();
        for (var j = 0; j < randomposts_current.length; j++) {
            if (randomposts_current[j] == rndValue) {
                found = true;
                break
            }
        };
        if (found) {
            i--
        } else {
            randomposts_current[i] = rndValue
        }
    }
};

function get_random() {
    var ranNum = 1 + Math.round(Math.random() * (total_randomposts - 1));
    return ranNum
};
</script>
<script>
function random_posts(json) {
    for (var i = 0; i < randomposts_number; i++) {
        var entry = json.feed.entry[i];
        var randompoststitle = entry.title.$t;
        if ('content' in entry) {
            var randompostsnippet = entry.content.$t
        } else {
            if ('summary' in entry) {
                var randompostsnippet = entry.summary.$t
            } else {
                var randompostsnippet = "";
            }
        };
        randompostsnippet = randompostsnippet.replace(/<[^>]*>/g, "");
        if (randompostsnippet.length < randomposts_chars) {
            var randomposts_snippet = randompostsnippet
        } else {
            randompostsnippet = randompostsnippet.substring(0, randomposts_chars);
            var whitespace = randompostsnippet.lastIndexOf(" ");
            randomposts_snippet = randompostsnippet.substring(0, whitespace) + "&#133;";
        };
        for (var j = 0; j < entry.link.length; j++) {
            if ('thr$total' in entry) {
                var randomposts_commentsnum = entry.thr$total.$t + ' ' + randomposts_comments
            } else {
                randomposts_commentsnum = randomposts_commentsd
            }; if (entry.link[j].rel == 'alternate') {
                var randompostsurl = entry.link[j].href;
                var randomposts_date = entry.published.$t;
                if ('media$thumbnail' in entry) {
                    var randompoststhumb = entry.media$thumbnail.url
                } else {
                    randompoststhumb = "http://3.bp.blogspot.com/-5SoVe1K6JSk/Utl0OOmucAI/AAAAAAAAF6E/hQghgD_EJdQ/s1600/no_thumb.png"
                }
            }
        };
        document.write('<li>');
        document.write('<a href="' + randompostsurl + '" rel="nofollow"><img alt="' + randompoststitle + '" src="' + randompoststhumb + '"/></a>');
        document.write('<div><a href="' + randompostsurl + '" rel="nofollow">' + randompoststitle + '</a></div>');
        if (randomposts_details == 'yes') {
            document.write('<span><div  class="random-info">' + randomposts_date.substring(8, 10) + '.' + randomposts_date.substring(5, 7) + '.' + randomposts_date.substring(0, 4) + ' - ' + randomposts_commentsnum) + '</div></span>'
        };
        document.write('<br/><div class="random-summary">' + randomposts_snippet + '</div><div style="clear:both"></div></li>')
    }
};
getvalue();
for (var i = 0; i < randomposts_number; i++) {
    document.write('<script type=\"text/javascript\" src=\"/feeds/posts/default?alt=json-in-script&start-index=' + randomposts_current[i] + '&max-results=1&callback=random_posts\"><\/script>')
};
</script>
</ul>
<style>
#random-posts {padding: 0 0 0 5px;}
#adshit {text-align: center;padding-top: 10px;margin-top: 5px;padding-bottom: 5px;background:url(http://4.bp.blogspot.com/-PmbZLNtmcKg/VmVLcdY3bSI/AAAAAAAAEIA/iEAdhooZuR8/s320/ad-back.jpg);}
#random-posts li {margin-bottom: 5px;list-style-type: none;}
#random-posts img {border-radius: 100px;float: left;position: relative;bottom: 10px;box-shadow: 1px 4px 4px #DEDEDE;padding: 3px;margin-right: 5px;width: 70px;border: 1px solid #D9D9D9;height: 70px;}
ul#random-posts {list-style-type: none;padding: 0px;}
#random-posts a {font-size: 13px;position: relative;top: 5px;}
#random-posts a:hover {text-decoration: none;}
.random-summary {display: none;}
</style>

(3). Click save and you are done!

Customization:

  • I have disabled details in this gadget because it make congestion in blog, if you want to show details in this widget then in the widget's code change no to yes as shown in below piece of code:
<ul id="random-posts">
<script>
var randomposts_number = 5;
var randomposts_chars = 0;
var randomposts_details = 'no';
var randomposts_thumbnails = 'no'
  • To increase number of posts change 5 to your desired number in above piece of code.
  • To customize summery of post change 110 to your desired alphabet number.
If you like this gadget share this post with others, if you have any problem or suggestion then leave a comment below. Follow and subscribe for latest news.

Tags: gadgets for blogger, increase blog page views, 101Helper blogger tips, tricks, gadgets, Random posts widget for blogger, random posts gadget for blog, blogger gadgets.


9 comments :

  1. Replies
    1. I am using this script and its working you can see it on your right hand side in this page. There maybe some problem with your template try to reinstall it.

      Delete
  2. This comment has been removed by the author.

    ReplyDelete
  3. post summary does not plus would also like to disable date and comments when detail is enableed,
    Thanks

    ReplyDelete
    Replies
    1. You can't show dates and comments though you can show summery by removing .random-summary {display: none;} from the code and by replacing zero with hundred in this piece of code (var randomposts_chars = 0;)

      Delete
    2. WORKED JUST FINE..I APPRECIATE THE QUICK RESPONSE KEEP IT UP AND THANKS AGAIN...
      http://inimichael.blogspot.com

      Delete
    3. You are welcome and thanks for your feedback !

      Delete
  4. This is another great random posts widget. It has good cross-browser performance. Does a very nice job with thumbnails.

    ReplyDelete
    Replies
    1. Yes you are right, thumbnails attract visitors to open and read posts.

      Delete