Create a Table of Contents or Archives Page in Blogger

Add This To Del.icio.us Share on Facebook StumbleUpon This Add to Technorati Digg This

Hooray! I've finally created an Archives Page and am so exhilarated with the result, especially a long-awaited one for my Blogger blogs! Some may name it Table of Contents, Index or Sitemap Page instead. Have a peek and you too may fall for one, yes? Confident that some bloggers would, I simply couldn't resist sharing this goody here. :-)

Went on a treasure hunt a couple of days ago for a Table of Contents or Sitemap widget for Blogger and after exploring for hours through various potential sites and experimented them unsuccessfully, I finally came across some awesome widgets (scripts) created by Abu Farhan that worked like a charm and were instant successes!

Just inserting his script for the Table of Contents for archived posts with only 2 lines of code in a Blogger Page, was able to automatically generate a list of the entire collection of all my posts, with titles neatly linked and sorted or archived by dates. A picture below to illustrate the impressive result!

Isn't that marvelous and it's so simple and quick to install to any Blogger blog! Thank you so much, Abu Farhan, I'm most grateful!

An Archives Page like this with the complete contents presented together in a single page will definitely make our blog posts easily accessible and navigable, providing more options not only to readers and search engines alike, but also as a reference to blog owners ourselves, to recall whatever were published and enable easy addition of internal links to new posts, when needed.

Here's how to create a Table of Contents in an Archives Page, sorted by dates :

1. Create a Page first - go to Dashboard | Edit Posts, which will then open the Posting tab in Blogger. Select Edit Pages, click on the New Page button and type in the Page title, e.g Archives, Table of Contents or Sitemap, or whatever that you fancy. Ideally, the title should be short as that will also serve as the page tab's name in your blog.
   
2. Next, select the Edit HTML mode to prepare your post. Copy and paste the following code into the post box :
   
   <script style="text/javascript" src="http://abu-farhan.com/script/daftarisibloggerarchive/tocbyarchivemin.js">
</script>
<script src="http://jacqsbloggertips.blogspot.com/feeds/posts/default?max-results=500&alt=json-in-script&callback=loadtoc">
</script>
   
   Then, change the code in red (jacqsbloggertips.blogspot.com) to theURL of your Blogger blog.
   
   
   
3. You can add extra content, such as an introductory/explanatory paragraph above or below the script code, if you wish. Do this while in the Edit HTML mode. Then click Publish Page and you're done. Once your Archives Page is published, its tab will appear under your blog's header.
   (Tip: the Page tabs are linked to the Pages widget (gadget) at Layouts | Page Elements where you can configure the page list).

Hope the above tutorial on creating an Archives Page on a Blogger blog had helped you to create a similar page for yourself and put smiles on your face! Enjoy! :-)

For those with Wordpress-powered website, you can learn to install the WP-Archives plugin to create an Archives Page...refer to my tutorial at jaycjayc.com, if you're interested.

For Further Reading,