How to Display Labels Near Post Title on Blogger - Tutorial

2021/Jan/21 how to show labels above or bellow post title.

In the last post, we showed you how to display labels in the article list. This time, we will show you how to place them anywhere on the article page.

How to display article labels

To show the label, just copy and paste this code where you want it to appear.


<ul>
  <b:loop index='i' values='data:post.labels' var='label'>
    <li><a expr:href='data:label.url' rel='tag'><data:label.name/></a></li>
  </b:loop>
</ul>

Displaying the label above the post title

On the "edit HTML" page, click inside the template area and press Ctrl + F. When the search box appears, paste the text <h3 class='post-title entry-title'> in the search box to find it.

After you find it, copy pasete the first code that I showed in the begining of this article. such as bellow.


<ul>
  <b:loop index='i' values='data:post.labels' var='label'>
    <li><a expr:href='data:label.url' rel='tag'><data:label.name/></a></li>
  </b:loop>
</ul>
<h3 class='post-title entry-title'>

This is it, Now you will be seeing the labels right above the post title.

Displaying the label below the post title

The process up to finding <h3 class='post-title entry-title'> is the same as described above. Then, paste the first code below it. such as bellow.


<h3 class='post-title entry-title'>
<ul>
  <b:loop index='i' values='data:post.labels' var='label'>
    <li><a expr:href='data:label.url' rel='tag'><data:label.name/></a></li>
  </b:loop>
</ul>

and that's it.

The Benefits of Displaying "Labels" at Begining of the Post

I assume that many of you have seen post category name shown bellow post title in other sites. Why not to implement labels bellow post title in blogger blog post as well when the method is really simple and easy. Placing Label links right under or above the article title is a very effective way to improve the User Experience (UX) which gives viewers an opportunity to crews your site from label names. By displaying labels near the title, you can catch readers before they leave. If they feel a post isn't exactly what they wanted, they might notice the label and click it to find a better match. On the other hand, if they enjoy the article, it encourages them to think, 'This is interesting! I want to read more from this category,' leading them to explore more of your site. So, it is surely better to place labels around post title.

Conclusion: Displaying categories under the title is not just about design. It is an important navigation tool that guides readers to the next information they want to know.

Comments