How to Show Blogger Table of Contents by Label Name


One of our readers, goh left this question on the Beautiful Blogger Table of Contents tutorial:
"Wonder is this possible. Let's say if a blog post has 5 labels. Is it possible to create a TOC for each label and therefore have 5 TOC (one for each label) and in separate pages in blogspot?

I noticed that goh left a similar question on Techniqueal's post, table of contents- label sort tweak which linked to the TOC tutorial. Unfortunately Techniqueal's blog has been dormant since Dec, 2008 --- a real loss. Her tweak is about presenting the full TOC list, but sorted by label.

So, let's answer goh's query: YES!

The TOC works off the blog's RSS feed, plain and simple. It then sorts alphabetically and presents the list. If you need only certain labels then we can change the feed to specify a label instead of all.

Rather than bury the solution in comments, here are the steps:
  1. Decide which labels you want and write down the exact spelling. Anything with a blank needs to be specified with %20.  e.g "Blog Design" is "Blog%20Design" when we code the TOC.
  2. Follow step 1 of the TOC tutorial to create styling (colors, etc) used by each page of TOC you'll create.
  3. Follow step 2 of the tutorial and create a separate page(post with a very early date) for each label you intend to use in this way. Initially it shows all posts. Do this to verify you've implemented the steps correctly.
  4. Change the feed in the TOC post code to show only your label. Find this code:


    <script src="http://bpwebnews.blogspot.com/feeds/posts/default?alt=json-in-script&max-results=999&callback=loadtoc"></script>

    *** remember you've changed the bpwebnews to your blog's url!
    Replace the word in green only with


    default/-/labelname
    e.g. default/-/Blog%20Design


  5. Publish the post. Repeat step 4 above for each page of labels.
I hope others can use this information. And goh, let us know how it turns out!

image credit:by Ivan Walsh
BPWebNews Bloggerspider logo
If you found this post useful, leave a comment to let me know. Grab the BPWebnews tips button and share the luv with others. Get future posts in your RSS feed or by email.



Print this post