Designing Blogger Homepage is necessary because as we know that first impression is a last impression. So By adding little bit interesting and effective things you can give a professional look to your blog. Sometime we don't not able to notice on each and every part while designing or may be due to lack of knowledge you are not able add some feature which given best look.
Today i am going to introduce the comment bubble which comes in just on the next position of every blog post title. This bubble is very stylish and helps you to make your homepage better that before. So if you want to add this bubble comment on you blog follow the all below given simple steps.
Method To Add Comment Button On Your Blog
- Go To Your Blogger Dashboard >> Template section
- Then Click on the Edit HTML
- Now search for code ]]></b:skin>
- Then Paste the below code Just Above/Before the code we search above.
.comment-bubble {
float : right;
width : 44px;
height: 44px;
background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEihVLXrBXrDm59S3Zi0t5VneNUQy4LvOWjazy0nwC0jAZlqb5FeovHhtz7JfV7JUy2Bgh4lCX6OpK4dS95-_RdKkCuXUnMr7snpBQHHrFqX8rptu_ghhVSwJv_jmWxZLn9uDzYCxeaGxiY/s48/Comment%2520Bubble.png) no-repeat;
margin-top:0x;
margin-right : 2px;
position: float;
padding-top: 6px;
padding-left: 18px;
}
- After Paste search for another code which looks like below
<b:if cond='data:post.link'>- Above Code may comes 2 Times always Choose which comes at 2nd Place
- Now Replace the Code we Search with below code
<b:if cond='data:post.allowComments'> <a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a> </b:if> <b:if cond='data:post.link'>
- After Replacing code Click on the Save button of Template settings
- Now Refresh Your Blog and Observe Changes
If You Have any Problem while using above code. Don't forget to mention Problem in Comments :)
0 Comments