Recent Posts Widget for Blogspot Users

by | Last Updated On May 8, 2009 | Blogging | 17 comments

We had released Recent Comments Widget sometime back that turned out to be an instant hit. We were overwhelmed with the responses we received. There were a lot of requests for a similar Recent Posts widget. So, today, we are releasing Recent Posts widget for BlogSpot users.

How is it different from the other Recent Posts widget?

  1. The problem with other widgets is that the source code for them lies with the widget author and the authors often integrate it in within their own site. If because of some problem their site is down, the recent posts widget will not work.Here, I am releasing the source code so that the logic would reside within your blog itself and hence you can do away with dependency on 3rd party site not under your control.
  2. You have a number of control and customizations options available. With this widget you have the option to show:
    1. Posts Title only.
    2. Posts Title with Date.
    3. Posts Title with excerpt.
    4. Posts Title with Date and excerpt.

Why should we use this widget when we can use you the feed option provided by blogger itself?

Well, for a number of reasons.

  1. Blogger limits the recent posts to 5.
  2. There are a number of customization options I have provided which you might not find with the internal blogger system.
  3. [Trivia] The URL that appears in your Firefox bar (below) when you hover the mouse over the link, contains your feed URL and not the actual URL.

How to install Recent Posts widget for blogger?

  1. Login to the blogger dashboard.
  2. Go to ‘Page Elements’ tab page elements
  3. Click on Add a Gadget. Select HTML/JavaScript widget type. add-a-gadget
  4. Now this is the most important step. Download the corresponding code given below and paste it in the widget box you have just opened above.
    1. Right click on the button below to download code for Posts Title only.
      Download
    2. Right click on the button below to download code for Posts Title with Date.
      Download
    3. Right click on the button below to download code for Posts Title with excerpt.
      Download
    4. Right click on the button below to download code for Posts Title with Date and excerpt.
      Download
  5. Scroll down to src=http://xyz.blogspot.com and replace xyz with your blog’s name. For example if your blog’s URL is http://abc.blogspot.com then the code should become src=http://abc.blogspot.com DO NOT TOUCH any other part of the code or else it might create problems.
  6. You have the option to increase/decrease the number of posts displayed in your widget. Go to var numposts = 5; (3rd line from the top, in the code you have downloaded). Increase/Decrease the number of posts. By default 5 posts would be displayed.
  7. If you choose to show excerpt for your posts, you have the option to increase/decrease length of the excerpt. Go to var numchars = 100; (6th line from the top, in the code you have downloaded). Increase/Decrease the number of characters. By default length is set to show 100 characters.
  8. You are done! Lastly please do not remove the footer credits*.

Please let me know if you face any problem implementing the code above.

If you like the above widget. Consider donating and encourage us to come up with more such widgets.





*The code is released under the condition that footer credits should remain intact.

17 Comments

  2. fjpoblam
    fjpoblam on July 6, 2010 at 3:45 AM

    Great little app. I’m in with @2CV67 and @Jim M in saying it’s unfortunate the app picks up (lower-case) filenames instead of (mixed-case/punctuated) titles, but I suppose that’s the way it must be… At any rate, it’s much better and faster than any competitors I’ve found. Thanks much. (I’ll have to be more creative or exacting with my post titles!)

    Reply
  3. Bonnie Rost
    Bonnie Rost on June 12, 2010 at 9:06 PM

    Hello. I so excited I have found this “recent posts” widget, however, I’m experiencing problems.

    Instructions say right click the green button below. When I right click I do not get the download prompts you’ve suggested. Instead, I get the normal options when I right click. Am I not doing this correctly. Thanks

    Reply
  4. JIm M
    JIm M on June 2, 2010 at 9:26 AM

    The widget seems to pick up the file name of the post instead of the post title. The file name appears to always be in lowercase, regardless of any capitalization you may enter into the post title. If there was a way to pick up the post title and display it correctly it would have a nicer look.

    Reply
  5. ilovepink
    ilovepink on March 30, 2010 at 11:40 AM

    Once again thank you so much.
    you have good and friendly instructions to follow.

    Congrats!

    Pink

    Reply
  6. gambar hantu
    gambar hantu on January 8, 2010 at 2:49 AM

    thanks..thats great idea to increase my impression…
    i want to put this script in my site…
    thanks

    Reply
  7. Robor
    Robor on August 8, 2009 at 7:16 PM

    Interesting, I`ll quote it on my site later.
    Thank you
    Robor

    Reply
  8. Zoran
    Zoran on July 18, 2009 at 1:54 PM

    Hi, Thank you! I would now go on this blog every day!
    Thank you
    Zoran

    Reply
  9. Eremeeff
    Eremeeff on July 9, 2009 at 5:44 PM

    Hi, Thank you! I would now go on this blog every day!
    Eremeeff

    Reply
  10. 2CV67
    2CV67 on February 27, 2009 at 3:32 PM

    I temporarily used a competitor widget on my main blog 2cv67blog but left both on my test blog 2cv67blog2 for comparison…

    Reply
  11. 2CV67
    2CV67 on February 27, 2009 at 1:51 AM

    And I see it does not recognize Capital Letters & also misses out little words like “a” & “an” in my titles…

    Reply
  12. 2CV67
    2CV67 on February 27, 2009 at 1:33 AM

    Thanks!
    In fact I found out how to get single-line spacing instead of double-line for my posts list, and I also spaced your advert down a couple of lines, to avoid confusion, by deleting/adding lines:
    “document.write(”);”

    This is the end of the HTML now:
    “var re = /]*>/g;
    post = post.replace(re, “”);
    document.write(”);

    if (showposttitle == true) document.write(posttitle);

    }
    document.write(”);
    document.write(”);
    document.write(”);
    }

    Recent Posts Widget by ReviewOfWeb”
    ………………

    I have a new problem now in that some of my titles show an added number at the end, which is not in the real title.
    I don’t know where that comes from or how to remove it.
    Example; 2cv67_725 should not have _725.

    Thanks for any suggestion!

    Reply
  13. 2CV67
    2CV67 on February 23, 2009 at 2:11 AM

    Thanks!

    I am a beginner & just installed on a dummy site to test & it seems to do what you said!

    Is there any way I can compact the displayed list, by starting a title every line, instead of every 2 lines?
    Truncating titles if necessary to avoid overflow…

    Thanks for any suggestions!

    Reply
    • ROW
      ROW on February 26, 2009 at 11:21 PM

      Ya, there should be a minor tweak required to do this. Let me know exactly what you need. I “ll try to work on it this weekend.

      Reply
  14. Kurniawan
    Kurniawan on January 28, 2009 at 6:46 PM

    Thanks for sharing knowledge…
    This code working great!

    Thanks a lot again!

    Reply
  15. @LiYaNNuaR
    @LiYaNNuaR on January 27, 2009 at 4:14 PM

    hi… thanks for sharing here…. done! 😉

    Reply
  16. Chris
    Chris on January 5, 2009 at 11:51 PM

    I have put the recent posts on my site and so far it is working great! Thanks.

    Reply

Trackbacks/Pingbacks

  1. Recent Posts Widget for Blogspot Users | StereoPropaganda - [...] See more here:  Recent Posts Widget for Blogspot Users [...]

Submit a Comment

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

Pin It on Pinterest

Share This