SOURCE CODE

Here is Yet Another Table of Contents - The YATOC Gadget. It is based on the Google AJAX API. You can use it to Make a Sitemap Page for your blog. See picture below :




You can see the demo at top of posts column in My Gadget Showcase blog. It shows all the post titles in the blog linked to respective posts. It is based on official Google AJAX code. Here are the steps to install it..................

INSTALLATION

To install this gadget follow these steps :

1. Login at Blogger.com.

2. Click Layouts link under blog title on Dashboard.

3. Click 'Add Gadget' link on Layout---->Page Elements subtab.

4. In popup window scroll down and click Html/Javascript gadget.

5. Copy all the code below :


<!--
  Copyright (c) 2008 Google Inc.

  You are free to copy and use this sample.
  License can be found here: http://code.google.com/apis/ajaxsearch/faq/#license
-->
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
    <script type="text/javascript">
      google.load("gdata", "1.x", { packages : ["blogger"] });
    </script>
    <script type="text/javascript">
      function _run() {
        var content = document.getElementById('content');
        var bloggerService =
            new google.gdata.blogger.BloggerService('com.appspot.interactivesampler');
        var feedUri = 'http://MYBLOG.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=999';
        var handleBlogPostFeed = function(postsFeedRoot) {
          var posts = postsFeedRoot.feed.getEntries();
          var html = '';
          html += '<dl>'
               + '<dt><strong>Blog:</strong> '
               + '<a href="'
               + postsFeedRoot.feed.getLink('alternate').getHref()
               + '">'
               + postsFeedRoot.feed.getTitle().getText()
               + '</a></dt>';
          html += '<dd><ul>';
          for (var i = 0, post; post = posts[i]; i++) {
            var postTitle = post.getTitle().getText();
            var postURL = post.getHtmlLink().getHref();
            html += '<li><a href="' + postURL + '" target="_blank">'
                      + postTitle
                      + '</a></li>';
          }
          html += '</ul></dd>';
          content.innerHTML = html;
        };
        var handleError = function(error) {
          content.innerHTML = '<pre>' + error + '</pre>';
        };
       
        bloggerService.getBlogPostFeed(feedUri, handleBlogPostFeed, handleError);
      }
      google.setOnLoadCallback(_run);
    </script>
<div id="content" style="width:100%;">Loading...</div>
Get This Gadget at <a href="http://www.blogdoctor.me/2009/01/yet-another-table-of-contents-yatoc.html">Yet Another Table of Contents-YATOC.</a>


6. Paste in contents window on HTML gadget popup window.

7. Change 'MYBLOG' in the code to actual subdomain of your blogspot.

8. Save Gadget.

9. View Blog. Wait for page to load completely for gadget to load.

10. Enjoy your sitemap
!