Add Labels Below Post Titles in Blogger

Labels Below Post Titles : 
In the previous post we discussed about how to add labels to Blogger blog. After adding the labels to Blogger blog, labels will also display below posts in your Blogger. We can also see the posted by author name, comments and default Blogger share buttons in the post footer. We can move those elements in post footer to any where in your post body. We can also place labels below post titles in Blogger blog.

How To Add Labels Below Post Titles in Blogger Blog : 

We can change the position of the post footer elements with in post footer easily, but if you want to move those items(elements) to the out side of the post footer, it is little difficult. In this post I'm giving the easy method to add labels below post titles in your Blogger blog. This method is simple to follow.

Follow below steps to add labels below post tiles in your Blogger :

Step 1 : Go to Blogger Dashboard

Step 2 : Click on Template

Step 3 : Click on edit HTML

Step 4 :  Search below code 

<span class='post-labels'>
        <b:if cond='data:post.labels'>
          <data:postLabelsLabel/>
          <b:loop values='data:post.labels' var='label'>
            <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != &quot;true&quot;'>,</b:if>
          </b:loop>
        </b:if>
      </span>

Select above code and Cut the code 

Again search <div class='post-header-line-1'/>

Add the labels code just below the above line.

Step 5 : Click on Save template .

Now visit your Blogger blog and see the labels below Blogger post titles. If already an item like post header date below posts is there,  your labels item will display below previous item. We can also keep the items below post titles side by side with div tag. Follow above simple method to add the labels below post titles in your Blogger blog easily with out adding any third party code.

2 comments: