Wednesday, September 14, 2016

How to Change or Remove the Showing Post With Label Message in Blogger

When a reader clicks on a label on your blog, they are greated with a message telling them that they are now viewing all of your published posts that are categorised under that label. Todays tutorial will show you how to remove this from your blog or change the text that is displayed as well as how it looks.
How to Change or Remove the Showing Post With Label Message in Blogger

Blogspot blogs have some unnecessary widgets and features. When a user click on one of your labels, blogger filters your posts tagged with that particular label and display a box saying Something like “Showing Posts With Label (label name). Show all posts”.

REMOVE THE “SHOWING POSTS WITH LABEL” MESSAGE

To remove the message completely following these quick steps. Go to Template > Edit HTML > Jump to Widget > Blog1. Under this you’ll see
<b:includable id='status-message'> ... </b:includable>

Click on the black arrow on the left to expand this code.
<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

Replace it with the following
<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

Save the template. Now when a reader clicks on a label, the message won’t show. This is great when using navigation menus for different blog categories.

CHANGE THE “SHOWING POSTS WITH LABEL” MESSAGE

To edit what the message says go to Template > Edit HTML > Jump to Widget > Blog1. Under this you’ll see
<b:includable id='status-message'> ... </b:includable>

Click on the black arrow on the left to expand this code.
<b:includable id='status-message'>
<b:if cond='data:navMessage'>
<div class='status-msg-wrap'>
<div class='status-msg-body'>
<data:navMessage/>
</div>
<div class='status-msg-border'>
<div class='status-msg-bg'>
<div class='status-msg-hidden'><data:navMessage/></div>
</div>
</div>
</div>
<div style='clear: both;'/>
</b:if>
</b:includable>

To change the display message, you need to change whats in between these lines
<div class='status-msg-body'>

</div>

You can change <data:navMessage/> to show the text you want, such as displaying the label name
<div class='status-msg-body'>
Check out my <data:blog.searchLabel/> posts!
</div>

EDIT THE LOOK OF THE MESSAGE

Add the following to Template > Customise > Advanced > Add CSS to style your message. Adding code here will place it above ]] </b:skin> in Template > Edit CSS. Add the styling you want between the brackets.
/* change text style  */
.status-msg-body { }

/* change background */
.status-msg-bg { }

/* change border style */
.status-msg-border { }

Use conditional tags to change the style of the status msg only on label pages.

1 comments: