Blogger Label Functions (The Basics)

When publishing with Blogger, we can categorize our posts using “Labels”. Published posts which have labels attached produce a link to each label in the post-footer section which links to a page displaying all posts categorized under this label. We can also add a “Labels” widget which generates a list of all labels currently in use linking to posts in the appropriate category.

Aside from the basic categorization of blog posts, there are some other useful functions we can add to our blogs when using Blogger labels. In this post, I’ll explain some simple yet useful customizations which could be useful to enhance the organization and display of your Blogger posts.

Create a Label Cloud

“Tag Clouds” are a popular design feature often used in blogs. This enables you to display links to your labels (categories) in a cloud style, where prominent labels feature more prominently and offer readers an understanding of your blog’s subject matter.

More recently, Blogger users have been able to add a flash-based, animated tag cloud to their layout which is based on the popular WP Cumulus plugin by Roy Tanck. This stylish version can be included in a regular Labels widget to parse and display labels automatically.

Further reading for label clouds:

• Phydeaux3’s original label cloud hack
• Easy label cloud widget from Wowzio
• Blogumus: animated label cloud for Blogger

Limit the number of posts displayed on label pages

By default, label pages display 25 posts assigned to that particular category (if there are enough posts filed under that label).

For those who write long posts or use many images, this can result in long page-load times for label-based blog pages.

Here is an easy way to limit the number of posts displayed on label pages:

1. Go to Layout>Edit HTML in your Blogger dashboard and ensure you have checked the “Expand widget templates” box.
2. Using the search function of your browser, find every instance of this phrase:

   data:label.url

   and replace this with the following instead:

   data:label.url + "?max-results=n"

   where n is the number of posts you would like to display on labels pages. This can be any number between 1 and 100.

This customization offers more control over the number of posts displayed, and can help ensure your Blogger design looks and feels the way you want it to.

Use a drop-down menu for your labels

If you have a long list of labels in use, a simple labels widget would appear as a big long list.

To free up some space in your sidebar, you may want to consider using a drop-down menu instead.

This is another simple customization for your blog which can be achieved in just a few short steps:

1. Go to Layout>Edit HTML in your Blogger dashboard. This time, do not check the “expand widget templates box!
2. Using your browser’s search function, locate the following line of code:

   <b:widget id='Label1' locked='false' title='Labels' type='Label'/>

3. Replace this line with the following code instead:
   

   <b:widget id=’Label1′ locked=’false’ title=’Labels’ type=’Label’>
   <b:includable id=’main’>
   <b:if cond=’data:title’>
   <h2><data:title/></h2>
   </b:if>
   <div class=’widget-content’>

   <br />
   <select onchange=’location=this.options[this.selectedIndex].value;’>
   <option>Select a label</option>
   <b:loop values=’data:labels’ var=’label’>
   <option expr:value=’data:label.url’><data:label.name/>
   (<data:label.count/>)
   </option>
   </b:loop>
   </select>

   <b:include name=’quickedit’/>
   </div>
   </b:includable>
   </b:widget>

4. Finally, save your template.

Once you have installed this hack, you will see that your label list has been replaced with a simple drop-down menu instead, which readers can use to access label pages with ease.

Access and display posts from label feeds

A lesser known feature of Blogger is that each blog produces label feeds in addition to the regular post and comment feeds.

If a particular category of posts is of interest for your readers, it may be useful to promote certain label feeds or add a recent posts widget to display articles categorized under this label.

Label feeds can be accessed using the following format:

http://your-blog.blogspot.com/feeds/posts/default/-/LabelName

where “your-blog.blogspot.com” should be replaced with your own blog URL, and “LabelName” should be the name of the label you wish to publicize (case sensitive).

If there are spaces between words in your label names, replace these spaces with %20 instead.

For example, the label feed for “Labels Categories and Tags” in my blog, Blogger Buster, is located at the following URL:

http://www.bloggerbuster.com/feeds/posts/default/-/Labels%20Categories%20and%20Tags

Once you have located the URL for your label feed, you could burn this through FeedBurner and offer subscriptions or add as a recent posts widget to filter posts from this category. It is also a useful method of displaying a “sideblog” with Blogger.

More Label Hacks Coming Soon…

In this post, I’ve discussed only the basic methods of manipulating labels in Blogger blogs. There are also advanced techniques which we can use to filter posts depending on their label (ideal for magazine style layouts, side-blogs and similar functions), and also to generate interesting functions for label pages and particular categories of posts.

So in next week’s post, I’ll continue with the theme of Blogger labels by explaining some of the more advanced label-based functions which offer even greater control over your posts and layouts.