How to display labels bellow post title in the post page of Blogger Template

witten2021/1/20

How to display labels bellow post title in the post page of Blogger Template

This article explains how to display a label under the title of an article page. In the past, we have explained how to display labels under article titles on feed pages of Emporio templates in a similar issue, but this time, the difference is that the code to output the label is added by editing HTML rather than changing CSS, and this time it is an article page, and furthermore, it can be adapted to all templates. So let's start.

Method of How to Add Label Bellow Post Title in Blog Post Page

Go to HTML editor and search for this code headerBylineOverride. If you find more than 1 then go to the last one. Now you are seeing something like this.


<b:if cond='data:view.isSingleItem and data:widget.type == "Blog"'>
  <b:include name='super.headerByline'/>
<b:else/>
  <b:include data='{ items: ["author", "timestamp", "labels"] }' name='headerBylineOverride'/>
</b:if>

The first column of text is a conditional tag that specifies what is to be displayed if the page is an article page.

The second column is the element to be output and displayed.

The third column specifies what to display if it is not an article page.

The fourth column is the element to be displayed in the output.

The fifth column closes the article page and other condition tags.

You can see the word Label in the fourth column of text. Therefore, the label is displayed on all but the article page.

Add <b:include data='{ items: ["labels"] }' name='headerBylineOverride'/> so that the label also appears on the article page.

To do so, rewrite the code as follows


<b:if cond='data:view.isSingleItem and data:widget.type == "Blog"'>
  <b:include name='super.headerByline'/>
  <b:include data='{ items: ["labels"] }' name='headerBylineOverride'/>
<b:else/>
  <b:include data='{ items: ["author", "timestamp", "labels"] }' name='headerBylineOverride'/>
</b:if>

and that's it. The yellow line is the line newly added. Visit your site and check if the labels are revealing properly.

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. Showing the label name is good for UI that gives viewers an opportunity to crews your site from label names. When the viewer reads your post and thought this might not be the desired post then before they leave the post they might remember that there is a label name shown bellow post title and might be able to find another post that they are looking for from there. That could happen huh ? So, it is surely better to place labels around post title.