How to Fetch All Labels/Categories

Display a list of all post categories to help users navigate your blog content.

In Blogger, Labels serve as categories. Displaying a list of all used labels is a fundamental feature for blog navigation. There are two main ways to achieve this.

Method 1: The Built-in Label Widget

This is the simplest approach. The `Label` widget automatically generates and displays a list of all labels used on your blog, including the number of posts for each.

  1. In your theme, define a `<b:section>` where you want the labels to appear (e.g., a sidebar).
  2. Go to the Blogger "Layout" dashboard and click "Add a Gadget" in that section.
  3. Choose the "Labels" gadget, configure its settings (e.g., display as list or cloud), and save.

Method 2: Creating a Custom Label List with `b:loop`

For full control over the HTML structure and styling, you can create a custom widget that loops through the `data:labels` global variable. This allows you to create unique designs that the default widget does not support.

Code Examples

xmlCustom HTML Widget to Loop Through All Labels
1
2
3
4
5
6
7
8
9
10
11
12
13
14
<b:widget id='HTML11' type='HTML' title='All Categories'>
  <b:includable id='main'>
    <div class='widget-content'>
      <ul>
        <b:loop values='data:labels' var='label'>
          <li>
            <a expr:href='data:label.url'><data:label.name/></a>
            <span>(<data:label.count/>)</span>
          </li>
        </b:loop>
      </ul>
    </div>
  </b:includable>
</b:widget>

Pro Tip

The `data:labels` variable is sorted alphabetically by default. If you need a different sorting order, you will have to use JavaScript to fetch the feed and sort it manually.

Was this lesson helpful?

Have feedback, found an issue, or have a suggestion? Let us know!

Send Feedback