in

Blogger Recent Posts Widget That Lists Posts Titles Without Thumbnails

The Recent Posts widget for Blogger lets you display the most recent blog posts on the sidebar of your Blogger/Blogspot blog, making it easy for your readers to see what’s new on your blog.

There are different Blogger recent posts widgets out there. Some will display posts title and thumbnails; some will display number of comments and date in addition to the posts titles and thumbnails; while some will just display the post titles.

The recent posts widget I’m sharing with you in this tutorial will list your recent posts titles. No thumbnails, no date.

Here’s an example of what it looks like:

recent posts gadget for blogger for content marketing

To add this to your Blogger blog, Sign in blogger.com, go to your blog dashboard and navigate to “Layout”

On the sidebar, click on “Add a gadget” and select “HTML/Javascript” gadget.

Copy the javascript code below and paste it in the “HTML/Javascript” gadget

<script type=”text/javascript”>
function recentpostslist(json) {
 document.write(‘<ol>’);
 for (var i = 0; i < json.feed.entry.length; i++)
 {
    for (var j = 0; j < json.feed.entry[i].link.length; j++) {
      if (json.feed.entry[i].link[j].rel == ‘alternate’) {
        break;
      }
    }
var entryUrl = “‘” + json.feed.entry[i].link[j].href + “‘”;//bs
var entryTitle = json.feed.entry[i].title.$t;
var item = “<li>” + “<a href=”+ entryUrl + ‘” target=”_blank”>’ + entryTitle + “</a> </li>”;
 document.write(item);
 }
 document.write(‘</ol>’);
 }
</script>
<script src=”http://www.ogbongeblog.com/feeds/posts/default?max-results=2&alt=json-in-script&callback=recentpostslist”></script>

Carefully replace the blog address with yours and click SAVE.

blogger recent posts widget code javascript

Proceed to view your blog and you should see it displaying the recent posts of your blog.

NB: You can change the number of posts to be displayed as seen in the image above. You can also use css to style the list. eg change font color, size etc

I hope this helps.

Please Share :

Receive Alerts In Your Email Inbox

Enter Your Email Address Below To Receive Latest Updates via Inbox, Free of Charge!

What do you think?

93 Points
Upvote Downvote

Written by Jide Ogunsanya

Pro Nigerian Blogger, Digital Marketer and Web designer. I help business owners to grow their businesses online. You can join my Facebook Group here or join my Telegram Group here.

Comments are closed.

4 Comments

How To Update Opera Browser To Latest Version Manually

Mailchimp Automation Now Free For All Users On Any Of Mailchimp Plans