Follow below steps to add recent posts by label or category widget on your blog.

1. Goto blogger.com & login


2. On Dashboard, click Layout > Page Elements




3. Click Add a Gadget > Feed



4. Insert Feed URL > Continue > title Recent LabelName > Save
Feed URL example:

http://yourblog.blogspot.com/feeds/posts/default/-/Label
Change yourblog.

Important:
Label is case sensitive. So, if your label is Tips, your feed URL is http://yourblog.blogspot.com/feeds/posts/default/-/Tips not http://yourblog.blogspot.com/feeds/posts/default/-/tips.
If your label has more than one word, use %20 to replace space between words. For example, if your label is Blog Title, your feed URL is http://yourblog.blogspot.com/feeds/posts/default/-/Blog%20Title.

click the image to enlarge


click the image to enlarge


You can tick Item dates and Item sources/authors if you want to show it.

5. View Blog

[back to top]

NONE

Follow below steps to add recent comments widget on your blog.

1. Goto blogger.com & login


2. On Dashboard, click Layout > Page Elements




3. Click Add a Gadget > Feed



4. Insert Feed URL > Continue > title Recent Comments > Save
Feed URL example:

http://yourblog.blogspot.com/feeds/comments/default
Change yourblog

click the image to enlarge


click the image to enlarge


You can tick Item dates and Item sources/authors if you want to show it.

5. View Blog

[back to top]

NONE

Follow below steps to add recent posts widget on your blog.

1. Goto blogger.com & login


2. On Dashboard, click Layout > Page Elements




3. Click Add a Gadget > Feed



4. Insert Feed URL > Continue > title Recent Posts > Save
Feed URL example:

http://yourblog.blogspot.com/feeds/posts/default
Change yourblog

click the image to enlarge


click the image to enlarge


You can tick Item dates and Item sources/authors if you want to show it.

5. View Blog

[back to top]

NONE

Normal comment count show same label for singular and plural comment count. For example, if your post has one comment, it will show "1 comments" not "1 comment". If your post has no comment, it will show "0 comments" not "No comments".

Follow below steps to customize comment count in comment form.

1. Goto blogger.com & login


2. On Dashboard, click Layout > Edit HTML




3. On Edit Template, tick Expand Widget Templates
and find below tags (based on Minima template)

<h4>
<b:if cond='data:post.numComments == 1'>
1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/> <data:commentLabelPlural/>:
</b:if>
</h4>

replace with
<h4>
<b:if cond='data:post.numComments == 0'>
No Comments to &quot;<data:post.title/>&quot;
<b:else/>
<b:if cond='data:post.numComments == 1'>
1 Comment to &quot;<data:post.title/>&quot;
<b:else/>
<data:post.numComments/> Comments to &quot;<data:post.title/>&quot;
</b:if>
</b:if>
</h4>

from (click the image to enlarge)


to (click the image to enlarge)


4. Save Template


You can change No Comments to No Responses etc. Also 1 Comment to One Comment or One Response etc. It's up to you.

[back to top]

NONE

Normal comment count show same label for singular and plural comment count. For example, if your post has one comment, it will show "1 comments" not "1 comment". If your post has no comment, it will show "0 comments" not "No comments".

Follow below steps to customize comment count in post.

1. Goto blogger.com & login


2. On Dashboard, click Layout > Edit HTML




3. On Edit Template, tick Expand Widget Templates
and find below tags (based on Minima template)

<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/> <data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</span>

replace with
<span class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' expr:title='&quot;Comment on &quot; + data:post.title'><b:if cond='data:post.numComments == 0'>No Comments<b:else/><b:if cond='data:post.numComments == 1'>1 Comment<b:else/><data:post.numComments/> Comments</b:if></b:if></a>
<b:else/>Comments Off
</b:if>
</b:if>
</span>

from (click the image to enlarge)


to (click the image to enlarge)


4. Save Template


You can change No Comments to Leave a Comment, No Responses or Be the first to comment. Also 1 Comment to One Comment or One Response etc. It's up to you.

[back to top]

ONE COM

1. Goto blogger.com & login


2. On Dashboard, click Layout > Edit HTML




3. On Edit Template, find below tags

<title> <data:blog.pageTitle/> </title>

replace with
<b:if cond='data:blog.pageType == "item"'>
<title> <data:blog.pageName/> | <data:blog.title/> </title>
<b:else/>
<title> <data:blog.pageTitle/> </title>
</b:if>

from (click the image to enlarge)


to (click the image to enlarge)


4. Save Template


[back to top]

NONE

If you are the blog author and want to edit your blog, you will see QuickEdit icon on every gadget/widget. You may want to view your blog as normal visitors without QuickEdit icon.

How to hide or remove QuickEdit icon? Follow below steps:

1. Goto blogger.com & login


2. On Dashboard, click Layout > Edit HTML




3. On Edit Template, put below css declaration

.quickedit {display:none;}
between <b:skin><![CDATA[ and ]]></b:skin>

(click the image to enlarge)


for example:
<b:skin><![CDATA[
/* maybe theme info here */

/* maybe variable definitions here */

.quickedit {display:none;}

]]></b:skin>

4. Save Template


[back to top]

NONE

Usually, after creating a new blog, u will have navbar at the top of your blog.


How to hide or remove Blogger NavBar? Follow below steps:

1. Goto blogger.com & login


2. On Dashboard, click Layout > Edit HTML




3. On Edit Template, put below css declaration

.navbar {
visibility: hidden;
display: none;
}
between <b:skin><![CDATA[ and ]]></b:skin>

(click the image to enlarge)


for example:
<b:skin><![CDATA[
/* maybe theme info here */

/* maybe variable definitions here */

.navbar {
visibility: hidden;
display: none;
}

]]></b:skin>

4. Save Template


[back to top]

NONE

Articles

Comments

Recent Customizations

Recent Tips

Recent Tricks