How to Create Pages Tabs Showing Labelled Posts ~

Display Labelled Posts as Pages In 5 Steps!

Tutorial Level:Intermediate – Requires Fiddling with HTML

Blogger just rolled out a wider blog template with capability of supporting the new expanded Pages Widget, which lets you create up to 19 pages in addition to the standard blog Home page. But the multi-tasker in me, still wanted more.Wouldn't it be great if pages populated themselves? I found a great Blogger Hack and after experimenting with it, I’ve re-blogged it below with a couple of tweaks,and two variations.
Would you like tabs that will call up all the posts by particular labels? This is how I created the tabs for: Blogger Tips,Facebook Tips ,and Twitter Tips,as well as Reviews above. Give it a try, and if you run into problems, drop me a comment,or Contact Me. I can also talk you through the process,or add them to your blog for you, if you’re short on time.

5 Steps to Creating a Tab Displaying Posts with a Particular Label

Adding a Tab to your Pages list in blogger is fairly easy, if you follow the following steps::

1. First, label your posts according to subjects or categories.
2. Second, Get the label URL by clicking the label under a post,then copy the URL from the browser address bar. Paste the URL into Notepad.The URL should look like this:
   http://YOURBLOGNAME.blogspot.com/search/label/YOURLABEL
   or if the label has more than one word,like Facebook Tips, the Format will be like this:
   http://YOURBLOGNAME.blogspot.com/search/label/YOUR%20LABEL
   ie.
   http://bloggedtips.blogspot.com/search/label/Facebook%20Tips
3. Prepare your line of Code. The Pages widget is a link list.,You just need to tweak the label URL a bit to add it as a line to the Pages widget as another link. The line you will insert needs to be formatted as follows:
   <li><a href='YOURLABELURL'>YOUR TAB NAME</a></li>
   for example:
   <li><a href='http://bloggedtips.blogspot.com/search/label/Facebook%20Tips'>Facebook Tips</a></li>
4. Next,Insert the code.
   Go to Dashboard > Design > Edit HTML.
       Tick the Expand Widget Templates box on top right of the HTML window.
Put the code for the additional line, right after </b:loop> and just before the end of the unordered links list</ul>.     Look for the line of code in the Pages widget like this:

<li><a expr:href='data:link.href'><data:link.title/></a></li>
    </b:if>
    </b:loop>
    PUT THE CODE FOR THE LINKS HERE
    </ul>
    <b:include name='quickedit'/>
    </div>
    </b:includable>
    </b:widget>

    5. Finishing steps  Preview your changes before saving. If the preview will not show, delete all changes and start over, you nay have misplaced a punctuation mark. Otherwise, simply save, and enjoy!

Variations:

• To make the link open in a new window or tab, add target="_blank" attribute right after href="YourLink".
• To add the new tabs before the static pages insert the code at the beginning of the link list right after"<ul>"

So, how will you use your label Tabs to ‘sup’ up your Blogger Blog?  I’m adding it to our village eZine Omemee Pigeon eFlyer to create lists of Featured articles.
When you use this tip.please leave a comment with a link to your handiwork, so we can enjoy it too!
Looking Forward to seeing your handiwork!
Suzanne

See the Original Article: Add Label Tabs to Navigation Bar