Loading...

Thursday, November 27, 2014

Change Your Comment Style In Blogger

;
As We Know That comments are the base of the blog. We Can find our solutions, ask queries, talk with admin and do many things with comment. But, as we know that the default comment style provided by blogger is not nice. It Looks ugly.
So, today i'm posting you how to Change comment style in your blogger blog. You Can see the Live demo In our blog or watch the picture below. The Comment box looks like this;
Now, let's add this in Our Blog. Follow My Simple steps to add it in our blog:

  • Log in to your blogger account
  • Select Template and click Edit HTML (Click on Proceed)
  • Find ]]></b:skin> [USING CTRL+F] Or use Alternate Way Of Pasting CSS
  • Copy the Code below

comments .comment-block {
background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEic6kj_Wy0YvG7jLSfj2oruahmTL4W6B1tPL1RH8pgbpK2Jd786454rEZLQI0jFrOpzT2O2RYtDi7dLeGKjEAePi4AMh1yQLhglqD4MuRCJq7GMArFZ9P03t-uh5me04e_bKKB1umQxx2g/s1600/bg.png") repeat scroll 0 0 transparent;
border: 4px solid #EAEAEA;
border-radius: 3px 3px 3px 3px;
box-shadow: 3px 3px 0 #D6D6D6;
margin-left: 48px;
padding: 3px 10px;
position: relative;
}
#comments .avatar-image-container img {
border: 2px solid #FFFFFF !important;
border-radius: 50px 50px 50px 50px;
height: 57px;
max-width: 57px;
}
.comments .avatar-image-container {
border: 2px solid #FFFFFF;
border-radius: 34px 34px 34px 34px;
box-shadow: 1px 1px 3px #ABABAB;
float: left;
margin-left: -40px;
max-height: 60px !important;
overflow: hidden;
width: 60px !important;
}
.comment-header {
border-bottom: 2px solid #F1F1F1;
}
.comment-block:hover > .comment-header {
-moz-transition: border-color 0.5s ease 0s;
border-bottom: 2px solid #000000;
}
.comments .comment .comment-actions a {
background: -moz-linear-gradient(center top , #EEEEEE 0%, #CCCCCC 100%) repeat scroll 0 0 transparent;
border: 2px solid #E0E0E0;
border-radius: 3px 3px 3px 3px;
color: #000000;
font: bold 12px arial;
margin-right: 14px;
padding: 4px 11px !important;
text-decoration: none !important;
text-shadow: 1px 1px 0 #FFFFFF;
}

  • After Pasting It, Save the template
Now Your blog's Comment Style Looks More Amazing and attractive than before. This Is an easy tutorial. If you have any problems regarding this, comment and I shall be helping you.
Happy Blogging!!!

Related Posts:

  • Add A 360° Rotating Effect On Your Blog; Hi Guys, It's me Again And Today, I'm Presenting you A Nice Topic That Will make your blog cool and fantastic. It is called 360° rotating effect and it will make your blog rotate upto 360° while reloading or loading. By … Read More
  • Customize Blogger Subheadings, Minor Headings; Hello Guys, you have seen different websites where you can see a subheadings which actually looks different to the headings than other blogs. Most of us want such headings, subheadings in our blog.  So, in this â€¦ Read More
  • Add A CSS Badge For Your Blog; Hi Guys, today I'm Bringing you a new widget Called CSS Badge Which You Can Use In Your Blog. It Looks Attractive and show Your word while you hover your mouse over it. Today I Am Gonna Show You How To Add Badge For Your… Read More
  • Change Your Website Mouse Cursor; Hi guys, It's me again and today, I'm going to show how to change your blogger mouse cursor. The default cursor of blogger looks unattractive as it is the default cursor of your OS. but, after you customize the blogger cur… Read More
  • Change Selected Text Color To Red In Blogger; Hi guys, in this post, we will be knowing how to change the selected text color into red in blogger. The default Selected Text Color of blogger is blue and Most of the blogs do not have customized color selected text. So, … Read More

0 comments:

Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.
Note:
1. Make sure to click the "Subscribe By Email" link below the comment to be notified of follow up comments and replies.
2. Please "Do Not Spam" - Spam comments will be deleted immediately upon our review.
3. Please "Do Not Add Links" to the body of your comment as they will not be published.
4. Only "English" comments shall be approved.
5. If you have a problem check first the comments, maybe you will find the solution there.

Post a Comment

Loading...

Blogger Cruzer

Blogger Cruzer

Copyright © 2025 Blogger Tips, Tricks, Widgets, SEO | Powered by Free Full Softwares and Games

Design by Nischal Khanal Blogger Cruzer

Don't You Think this Awesome Post should be shared ??
| Change Your Comment Style In Blogger |
Auto Scroll Stop Scroll