Autoscroll Recent Posts Widget for Blogger | Blogspot

Tuesday, 7 June 2011

Autoscroll Recent Posts Widget for Blogger | Blogspot

With “Autoscroll Recent Posts ” widget you can show recently posted widgets or you can say all posts in one list which may help your visitor to browse around your blog or site.

Recent Posts widget for Blogger lets you display more than 5 recent posts on your blog. It will show not only post titles but also post excerpts or snippets in scrolling,

Here’s the procedure on how to install the widget on your blog

  • Login to your blogger dashboard and go to Design -> Page Elements.
  • Click on 'Add a Gadget' on the sidebar.
  • Select 'HTML/JavaScript' and add the code given below by replacing red highlighted text with your blog URL 


    <marquee marquee id="siva" onMouseOver = "document.getElementById('siva').stop()" onMouseOut = "document.getElementById('siva').start()" direction="up" behavior="scroll" scroll="loop" scrollamount="1.5" align="top" width="360" height="150">
    <script style="text/javascript" >
    function showrecentposts(siva) {
    for (var i = 0; i < numposts; i++) {
    var entry = siva.feed.entry[i];
    var posttitle = entry.title.$t;
    var posturl;
    if (i == siva.feed.entry.length) break;
    for (var k = 0; k < entry.link.length; k++) {
    if (entry.link[k].rel == 'alternate') {
    posturl = entry.link[k].href;
    break;
    }
    }
    posttitle = posttitle.link(posturl);
    var readmorelink = "(more)";
    readmorelink = readmorelink.link(posturl);
    var postdate = entry.published.$t;
    var cdyear = postdate.substring(0,4);
    var cdmonth = postdate.substring(5,7);
    var cdday = postdate.substring(8,10);
    var monthnames = new Array();
    monthnames[1] = "Jan";
    monthnames[2] = "Feb";
    monthnames[3] = "Mar";
    monthnames[4] = "Apr";
    monthnames[5] = "May";
    monthnames[6] = "Jun";
    monthnames[7] = "Jul";
    monthnames[8] = "Aug";
    monthnames[9] = "Sep";
    monthnames[10] = "Oct";
    monthnames[11] = "Nov";
    monthnames[12] = "Dec";
    document.write('<p>');
    if ("content" in entry) {
    var postcontent = entry.content.$t;}
    else
    if ("summary" in entry) {
    var postcontent = entry.summary.$t;
    }
    else var postcontent = "";
    var re = /<\S[^>]*>/g;
    postcontent = postcontent.replace(re, "");
    document.write('<b>');
    document.write(posttitle);
    document.write('</b>');
    document.write('</br>');
    if (showpostdate == true) document.write(' - ' + monthnames[parseInt(cdmonth,10)] + ' ' + cdday);
    if (showpostsummary == true) {
    if (postcontent.length < numchars) {
    document.write(postcontent);
    }else {
    postcontent = postcontent.substring(0, numchars);
    var quoteEnd = postcontent.lastIndexOf(" ");
    postcontent = postcontent.substring(0,quoteEnd);
    document.write(postcontent + '...' + readmorelink);
    }
    }}}
    document.write('</p>');
    </script>
    <script style="text/javascript">var numposts = 5;var showpostdate = false;var showpostsummary = true;var numchars = 50;var standardstyling = false;</script>
    <script src="http://lodge4hacker.blogspot.com/feeds/posts/default?orderby=published&alt=json-in-script&callback=showrecentposts">
    </script>
    </marquee>
    • Now "Save" your widget ,that's it. . .


    !!THERE IS NO HIDDEN JAVA SCRIPT OR ADS IN OUR WIDGET !!
    !! IT'S AN SCROLLING TOWARDS UP WIDGET !!

    1 comment:

    1. Thanks, it is wonderful script. I use it for my site.
      Demo: http://www.abstravel.asia

      ReplyDelete

    Home