How To Show Recent Post Titles By Labels In Blogger Blog

Labels are very important for any blog.These are keywords that categorizes your blog posts in easy way. They should be mostly based on common and specific keywords.See example If I am a Singer and I write a blog, I will make sure I label all posts written on Lyrics as "Lyrics" and those on Video Songs as "Video Songs" and so on.

This will help my blog visitors to read all posts written on Lyrics by simply hitting the Lyrics label link.

Some times you want to display recent post titles by labels in blogger blog widgets.But unfortunately blogger has not any official widget for this purpose.You can do this work manually.But manually work is so bored.Don't worry, I have a easy solution for you to add your recent posts automatically under different Labels. After installing this widget the list will automatically update itself.

Before moving on, you may like to read:

• How To Increase Page Views And Reduce Bounce Rate Of Blog
• Customize Blogger's Official Popular Posts Widget

1. Installing The First list

• Go to Blogger Dashboard > Layout Design > Click Add A Gadget
• In Add A Gadget Window, Select HTML/Javascript
• Give A Label As The Title Of Your Widget
• Copy The Code Below and Paste It Inside The Content Box
• Click Save and Its Done

 <!-- Recent Posts by Label Start -->

<script type="text/javascript">

function recentpostslist(json) {

 document.write('<ul>');

 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('</ul>

');

 }

</script>

<script src="Blog_URL_HERE/feeds/posts/summary/-/BLOG_LABEL_NAME?max-results=POST_COUNT&amp;alt=json-in-script&amp;callback=recentpostslist">

</script>

<span style="float: right; font-size: 80%;">Get this <a href="http://www.blogsdaddy.com/2012/08/how-to-show-recent-post-titles-by.html" target='_blank' rel='nofollow'>widget</a></span><!-- Recent Posts by Label End -->

Customization  

• Replace Blog_URL_HERE with your own blog URL. For example if you were to list posts from BlogsDaddy.Com, you would have to replace it with http://www.blogsdaddy.com (without the trailing slash). 
• Replace BLOG_LABEL_NAME with the label.Be careful about Labels, they are case sensitive, make sure you get it right. 
• Replace the value of POST_COUNT with the number of posts you want to display.

2. Adding Subsequent Lists

You need to add a HTML/JavaScript gadget for each label. Repeat the same steps above for each label, with a slight difference: 

• You don’t have to copy the whole code. Just copy the below code into each gadget. 

<script src="Blog_URL_HERE/feeds/posts/summary/-/BLOG_LABEL_NAME?max-results=POST_COUNT&amp;alt=json-in-script&amp;callback=recentpostslist">
</script>
<span style="float: right; font-size: 80%;">Get this <a href="http://www.blogsdaddy.com/2012/08/how-to-show-recent-post-titles-by.html" target='_blank' rel='nofollow'>widget</a></span>

• Make sure your first list (which contains the full code) is positioned on top of all other lists. 

So add this widget to your blog right now and enjoy blogging with a different way.If you have any question about this widget.Ask in comments.