Add a Table of Contents to Main Blog Posts Column. ~ The Blog Doctor.

Add a Table of Contents to Main Blog Posts Column.

New Visitor? Like what you read? Then please subscribe to my Blog Feed or sign up for Free Email Updates. Thanks for Visiting!

A Table of Contents can be added to your main Blog Posts column. This Table of Contents will list all your posts titles as links. You can arrange this Table to appear before your Blog Posts or after..............

To do this you will first have to add extra Page Elements to your Blog Posts column. Login to Dashboard and click on Layouts of the blog you want to modify. Then click on Edit Html subtab.

First Download your template by using Download Full Template link.
Then scroll down in Edit Template text box till you come to :

<div id='main-wrapper'>
<b:section class='main' id='main'>

Modify the second line in above code to :

<b:section class='main' id='main' maxwidgets='5' showaddelement='yes'>

This will add a Add Page Element (showaddelement='yes') link to your Blog Posts section on the Page Elements tab and allow you to add a maximum of five widgets/Page Elements (maxwidgets='5') to your Blog Posts column. Save Template.

Go to Page Elements tab where you will see a Add Page Element link on top of your Blog posts column as in below picture.

Click on Image to see bigger view.

Now we will convert your blog RSS feed to javascript. For this go to In the URL box at the top enter your blog feed which in case of the new blogger is :

Substitute actual blog name in place of yourblogname. Since we want to display only the title of our posts choose No to most of the options like : Show Channel, Show "Simplified" Channel, Show Item Descriptions and Show Item Posting Date. Enter zero for Number of items to show all available items and Yes to Use List Elements. Hit the Preview button to check that your titles are shown.
If the Preview does not tally go to Settings------>Site Feed in your blog and turn on the site feed.
Click on Generate Javascript button to generate the code. Copy that Javascript code by selecting all.

Login to your Dashboard and click on Layouts beside your blog name. On the Page Elements tab click on add Page Element link in the Blog Posts section. In the new window which opens choose the Html/Javascript option and paste the Javascript code in the contents window. In the Titles window type Table of Contents. Save the Page Element. This is saved on top of your blog posts. If you want it to appear below click and drag that page element from the top to the bottom of your blog posts. Click on Save.

Technorati Tags:, , , ,


Clacby said...

Great tip! I tested it in my new blog and have two comments that could help others doing so:
1- The RSS feed to JavaScript service you mentioned was not working. I used the one in

2- I had to change my blog feed url to end as "default?alt=Atom" instead of "default?alt=rss"

Best regards,

Angie's Recipes said...

Hi Vin

Since my post titles contain non-English language (in my case is Chinese language), so they show up as some unreadable signs. Any idea how could I fix them? (sometimes the german Umlaut(äöüß)also can be a problem for me, first 2 work, and the rest just refuse to cooperate.

Have a wonderful weekend!

Kathleen said...

Kept getting an error message that said I hadn't "closed" with / or >; which of course I had. Then I just tried to copy paste the link into my html and it still didn't work. I'm just trying to add a link-able Table of Contents and so far........nothing has worked.....any suggestions.

Thank you

Vin said...


What is the blog address?

Selvi said...


I would like to create a table of content which shows the latest post in the front content page, followed by Updated Post and Old Post. I want this content to be appear in my main blog page... which when the title is click it will direct to the post.

Currently all my latest posts automatically appears on my main page, i want to replace it with the content with title. How do i do that?


Selvi said...

How do i create a content section on recent post on my blog ?

Vin said...

R. Thamilselvi,

Add the Blogger Archives Google Gadget to blog post.


Skip to top of post.

Search Blog Before Commenting


Post a Comment

Please use the above search box to search this blog before posting your valuable comments.

Comments posted on Dummies Guide to Google Blogger (Beta) are moderated and will be approved only if they are on-topic and not abusive. Try not to include website URLs/links in your comments. You can email me : drbhatns at gmail dot com for any blogging question. Thanks,


The Blog Doctor The Blog Doctor2 Blog Doctor Home


Tips On Blogger and Latest News.

Skip to top of post.