Maybe sometimes we need a widget for certain features, but the widgets are not available. Blogger already provides an APIs to overcome this, so we can create our own widget by reading the blog feed using the JSON and JavaScript.

Here is the JSON feed API:

Object	Description	Example
json.feed.id.$t	Show blog ID	tag:blogger.com,1999:blog-12345
json.feed.updated.$t	Last update of a blog	2013-07-08T18:21:57.051+07:00
json.feed.category[]	Categories / label array of a blog
json.feed.category[i].term	Show the i-th category	Blogger
json.feed.title.$t	Show blog name	Danlogs
json.feed.subtitle.$t	Show description of a blog	Dan's Weblog
json.feed.author[]	Array of blog authors	Danang Probo Sayekti, Matt Cutts
json.feed.author[i].name.$t	Show the i-th blog author name	Danang Pobo Sayekti
json.feed.author[i].uri.$t	Show the i-th profile author uri	https://profiles.google.com/123456789
json.feed.openSearch$totalResults.$t	Show total posts	777
json.feed.entry[]	Posts array of a blog
json.feed.entry[i].id.$t	Show the i-th post ID	tag:blogger.com,1999:blog-8508.post-12345678
json.feed.entry[i].title.$t	Show the i-th post title	Blogger JSON Feed API
json.feed.entry[i].published.$t	Show time published of the i-th post	2013-07-07T12:56:00.000+07:00
json.feed.entry[i].updated.$t	Show when the i-th post is updated	2013-07-07T12:56:47.089+07:00
json.feed.entry[i].category[]	Show array of post categories
json.feed.entry[i].category[x].term	Show the x-th category of the i-th post	Blogger API
json.feed.entry[i].summary.$t	Show post summary	Maybe sometimes we need a widget ...
json.feed.entry[i].content.$t	Show post content	Maybe sometimes we need a widget for certain features, but the widgets are not available ...
json.feed.entry[i].link[]	Links array of a post
json.feed.entry[i].link[x].href	Show the x-th link of the i-th post	http://www.danpros.com/2013/08/blogger-api.html
json.feed.entry[i].author[]	Array of post authors
json.feed.entry[i].author[x].name.$t	Name of the x-th author on the i-th post	Danang Probo Sayekti
json.feed.entry[i].author[x].uri.$t	Show uri author profile	https://profiles.google.com/123456789
json.feed.entry[i].author[x].gd$image.src	Image uri of the x-th author profile on the i-th post	//lh4.googleusercontent.com/photo.jpg
json.feed.entry[i].media$thumbnail.url	Show image on the i-th post	http://3.bp.blogspot.com/danlogs.jpg
json.feed.entry[i].thr$total.$t	Show total threaded comments	7

Here is an example implementation of the above code:

Suppose I need 5 recent posts by a certain label, the label I want to display is "Blogger". I took the title and summary of the post.

<script type="text/javascript">
  function mycallback(json) {
    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') {
          var postUrl = json.feed.entry[i].link[j].href;
          break;
        }
      }
      var postTitle = json.feed.entry[i].title.$t;
      var postSummary = json.feed.entry[i].summary.$t;
      var item = '<div class="wrapper"><h3><a href=' + postUrl + '>' + postTitle + '</h3></a><p>' + postSummary + '</p></div>';
      document.write(item);
    }
  }
</script>
<script src="http://www.danpros.com/feeds/posts/summary/-/Blogger?max-results=5&alt=json-in-script&callback=mycallback"></script>

Note: we need to understand that json.feed.entry[i].summary.$t only available if we grab the feed URL using http://www.danpros.com/feeds/posts/summary instead of using http://www.danpros.com/feeds/posts/default.

Now how can we create a widget without unsorted recent post by a certain label? This widget also only displays 90 characters in the summary. The following is the example:

<script type="text/javascript">
  function mycallback(json) {
    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') {
          var postUrl = json.feed.entry[i].link[j].href;
          break;
        }
      }
      var postTitle = json.feed.entry[i].title.$t;
      var postAuthor = json.feed.entry[i].author[0].name.$t;
      var postSummary = json.feed.entry[i].summary.$t;
      var entryShort = postSummary.substring(0, 90);
      var entryEnd = entryShort.lastIndexOf(" ");
      var postContent = entryShort.substring(0, entryEnd) + '...';
      var item = '<div class="wrapper"><h3><a href=' + postUrl + '>' + postTitle + '</h3></a><span>'+ postAuthor + '</span><p>' + postContent + '</p></div>';
      document.write(item);
    }
  }
</script>
<script src="http://www.danpros.com/feeds/posts/summary?orderby=published&max-results=5&alt=json-in-script&callback=mycallback"></script>