We are planning to publish our template for download, alot of users request us and we are under developing of Template Generator for ease of use.. !

How to Change comments style on Blogger?

Style your Comments Block Blogger
First of all i'm saying sorry to all for the delay of posting.
This is a tutorial about how to style your comments block with effective designs.
This is done using Simple css Scripts.
The demo of a styled comments block is as follows.








Click the link below to see demo
Demo page
What's inside this article?

Comments Style version 1.0


.comments .comment .comment-actions a {
background: none repeat scroll 0 0 #FFD99E;
border: 2px solid #FFB43D;
border-radius: 3px 3px 3px 3px;
color: #000000;
font: bold 12px arial;
margin-right: 14px;
padding: 3px 9px;
text-decoration: none !important;
text-shadow: 1px 1px 0 #FFFFFF;

}

.comments .comment-block {

background: none repeat scroll 0 0 #E2E2E2;
border: 4px solid #ABABAB;
border-radius: 3px 3px 3px 3px;
padding: 3px 10px;

}

.continue a {
background: none repeat scroll 0 0 #FFD99E;
border: 2px solid #FFB43D;
border-radius: 3px 3px 3px 3px;
color: #000000 !important;
display: inline-block !important;
margin-top: 7px;
padding: 3px 8px !important;
text-decoration: none !important;
text-shadow: 1px 1px 0 #FFFFFF;
}
.comment-block:hover > .comment-header {
border-bottom: 2px solid #000;
-moz-transition: border-color .5s ease;

}

.comment-header a {

color: #000000 !important;

}

#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;
}

Comments Style version 2.0


.comments .comment-block {
background: url("http://1.bp.blogspot.com/-UP3vcAami5s/T-wKLoD6pXI/AAAAAAAAARw/LEw4T0G8yXo/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;
}
:) :( ;) :D :-/ :x :P :-* =(( :-O X( :7 B-) #:-S :(( :)) =)) :-B :-c :)] ~X( :-h I-) =D7 @-) :-w 7:P 2):) :!! \m/ :-q :-bd ^#(^
Close [x]

67 comments :

  1. Finally You are back .........;)
    I hope the posts will be regular now

    Pc Genie Land

    ReplyDelete
    Replies
    1. Bhailog .... Your Website template Perfect !! and all the styles are perfect .. but some wegits r not working on my site :( i tried to Designed my label like your blog but after applying all code my label backgorund comes white .. and border comes black and text got Invisible White ... only Animation was working :(

      Delete
  2. Its good to be here, very nice post, the content is amazing, keep posting friend it will be very helpful for everyone, Thanks for sharing. I really liked it.
    Thanks And Regards
    post Free Classified ads

    ReplyDelete
  3. Best PTC Paying Site Ever, Earn money on Just clicking without any investment
    www.jobzcorner.com

    ReplyDelete
  4. Thanks man .visit my site too @http://prohackertools.blogspot.com/

    ReplyDelete
  5. Really interesting ,,brilliant post..thanks for sharing..

    BLOGGER Tips and Tricks!

    ReplyDelete
  6. This is so much more than i needed!!! but will all come in use thanks!!
    Empower Network

    ReplyDelete
  7. Simply awesome !!! feel free to see my collection of widgets http://livetricks4u.blogspot.com/2012/12/50-great-blogger-widgets-useful-free.html

    ReplyDelete
  8. This post was definitely worth the time to read and take in. Most times I read a post I just skim over the contents, but not this one. Good job!
    SEO

    ReplyDelete
  9. Thanks, this was very informative as I am new to this. A big help for my web design outsourcing
    blog! :)

    ReplyDelete
  10. Top Most Expensive Cars, Top Most popular and Speed Cars with stylish and Beautiful Pictures.
    worldlatestvehicles.blogspot.com

    ReplyDelete
  11. Thanks for a great list. I've 'grabbed' a few to check out so that I can waste even more time reading blogs instead of working. :)

    Website Design Company in India
    Website Designing Company in India

    ReplyDelete
  12. Best Investment Plans which you can make money from home without any work
    www.jobzcorner.com

    ReplyDelete
  13. wow.. This is nice comment style... I really like it.. it is simple look and elegant... Keep it up..

    Blog: MoreBlogTools

    ReplyDelete
  14. anyway to change the commnets form like wp?

    ReplyDelete
  15. :-c
    For Most Wanted Tips & Sofrware

    http://mostwantedts.blogspot.com

    ReplyDelete
  16. Hey can you tell how to add that scroll to particular content to my blog also plz tell me.

    ReplyDelete
  17. Very Very good and usable post. Thank's to share your seo company experience with us. I will try to remember these tips in my blog commenting task.

    ReplyDelete
  18. New Aston Martin Rapid, 2013 Hyandai Veloster Turbo Mazda Takeri Concept and Top Companies of Most popular Cars and Vehicles. Total Concept Cars in the World, Latest Strange Vehicles in the World, All Concept Cars and Strange Vehicles Hot pictures and info
    worldlatestvehicles.com

    ReplyDelete
  19. nice post , i m using disqus comment system but also i like your tutorial as i have tried to use this code i like it a keep blogging.
    regards,
    Tips Via Blogging

    ReplyDelete
  20. version 2 is not working in my blog. http://kishorkc.blogspot.com

    ReplyDelete
  21. The blog was absolutely fantastic! Lots of great information and inspiration, both of which we all need!b Keep 'em coming... you all do such a great job at such Concepts... can't tell you how much I, for one appreciate all you do!
    business loan for bad credit

    ReplyDelete
  22. Replies
    1. Nice post..Its really helpful..
      You can get some extra full version softwares from www.freedownloadzone.in

      Delete
  23. Make your computer fast and virus free

    Pc working slow

    ReplyDelete
  24. Thank you for the codes. :-bd I will try this on my blogger profile comment box.

    seo philippines

    ReplyDelete
  25. This comment has been removed by the author.

    ReplyDelete
  26. SEO
    Thank you for this valuable information, I hope it is okay that I bookmarked your website for further references.

    ReplyDelete
  27. Vashikaran For Love Marriage The meaning of Vashikaran is to attract the desired person under your influence and it is is used to control someone or to get your love or ex back.

    ReplyDelete
  28. Vashikaran For Love Marriage The meaning of Vashikaran is to attract the desired person under your influence and it is is used to control someone or to get your love or ex back.
    http://vashikaranmantras.org/

    ReplyDelete
  29. thanx buddy!!!! visit my blog....
    http://www.window7hacker.com

    ReplyDelete
  30. Leading Moving Company in India | Express shifting in India | Best Moving Company | Call Now: 93825 17189 Packers and Movers in Delhi : ICM Packers Movers, the name has the Best Customer Review on Moving:.

    Url : http://www.icmpacknmove.com/

    ReplyDelete
  31. This is really and excellent article about basic seo tips.

    Blogger seo
    Basic SEO

    ReplyDelete
  32. Excellent post! These tips are very useful for website marketing. I am going to bookmark these tips for future reference.

    ReplyDelete
  33. Change comment section to blogger is very easily nice colour full background spice background colurs specilay admin comment is high lighted.Php development bangalore

    ReplyDelete
  34. Its good to be here, very nice post, the content is amazing, keep posting friend it will be very helpful for everyone, Thanks for sharing.

    techmediaa.blogspot.com

    ReplyDelete
  35. The colibritool is #1 on my list because proper seo strategies always begin with good keyword research. Visit then more information http://colibritool.com

    ReplyDelete
    Replies
    1. I also feel so Sakib, for me Colibritool is a leader in seo tool selection.

      Delete
  36. Thanks for sharing. I have already used it. Very nice.
    Blogger Widgets

    ReplyDelete
  37. Thanks, I was looking change comment style for my website.
    Get Free Riot Codes

    ReplyDelete
  38. Thanks All for your comments. I can't reply to comments because of lots of comments.. Sorry All... :!!

    ReplyDelete
    Replies
    1. valsaraj please tell me how i can make the admin comment style like you have made !it is written over there ADMIN please tell me this or similar to this !
      and those who want android app can download from here and if it is not there put a request in request zone ,I will be provided to you 100 % working link.

      thank u !

      Delete
  39. Nice tips. I am really happy to find these tips here. I have just collected some amazing tips and tricks about SEO from the experts at ChatCat live chat site. Its really incredible. You can also join :)

    ChatCat Live SEO Chat

    Kashfiya !!!

    ReplyDelete
  40. there are lots of tools for getting fast indexing some are blackhat seo and the others are whitehat seo but the certain results comes from the manual work for writing good contetn submitting to social networks and building high quality backlinks Professional SEO Services

    ReplyDelete
  41. Just want to say your article is as astonishing.
    The clarity in your post is just great and i can assume you're an expert on this subject.
    Well with your permission let me to grab your RSS feed to keep updated with forthcoming post.
    Thanks a million and please continue the gratifying work.

    Also visit my web Blog; Mesothelioma Charitiy

    ReplyDelete
  42. Like this post, the function is very good, is a big help for me, let me learn more
    Do you like ThL W9

    ReplyDelete
  43. Too good the this comment style i like it ...

    Regards
    Blogging Guru

    ReplyDelete
  44. valsaraj please tell me how i can make the admin comment style like you have made !it is written over there ADMIN please tell me this or similar to this !
    thank u !

    ReplyDelete
  45. valsaraj please tell me how i can make the admin comment style like you have made !it is written over there ADMIN please tell me this or similar to this !
    and those who want android app can download from here and if it is not there put a request in request zone ,I will be provided to you 100 % working link.

    thank u !

    ReplyDelete
    Replies
    1. I will post it next day please revisit our blog tomorrow. :!! :)

      Delete
  46. Great tutorial buddy, thanks for sharing this. I hope by using this tutorial I can now changed my blogger commenting style.
    Web designing and development company India

    ReplyDelete
  47. I Have One question about your blog why not transfer in sub level domain name

    ReplyDelete

Ask your thoughts to us,We are happy to help you.


1.Please don't Spam
2.We strictly recommend to Click on Subscribe to email