input license here

3 Stylish Customize Blogger Comment Box

A comment box is a great way to collect feedback from your customer or from your blog readers who provides you an easy to understand reports.

Comment box allows your readers to give their honest and valuable opinion about your post, something that your readers can say and express. It also encourages your blog readers to participate actively with other readers of your blog.

So, let’s come to the main point for the reason you are here. Blogger comment box by default does not much catchy and seems dull.


If you need to customize your Blogger search bar. Here I have 15 best-customized blogger search bar.

That’s why I have this 3 best-customized comment box for your Blogger blog that you can implement into your blog as you choose or as per your blog theme color.

Just follow the simple steps and will get the best comment box for your Blogger blog. 

1. Sign in to your Blogger blog and select Theme


Blogger Comment Box

(Before you proceed to step 2, make sure that you take a backup of your current theme)

To back up your theme.

i) Go to Backup/Restore on the left-hand side and
ii)Click on Download theme.
Blogger Comment Box


Now, Let’s resume our comment again,

2. Select Edit HTML.

3. Find the code  ]]></b:skin>

 and paste the below code above  ]]></b:skin> 
 code.

4. Click Save



Customize Comment Box 1.

Blogger Comment Box
 .comments .comment-block { background: #F9F9F9; color: #555; box-shadow: 0 4px 10px #EEEEEE; position: relative; margin-top: 10px; margin-left: 60px; padding: 10px; border: 4px solid #EEEEEE !important; border-radius:10px; font: 1.190em/1.2 Cambria,Georgia,sans-serif;} .comment-thread li .comment-block:before { position: absolute; display: block; left: -26px; color: #EEEEEE; content: "\25C4"; font-size: 30px;} .comments .avatar-image-container { width: 60px; height: 60px; max-height: 60px; margin:0px 0px 0 -28px; padding: 0px; border: 7px solid #EEEEEE; border-radius:60px;} .comments .avatar-image-container img { overflow:hidden; width: 60px; height: 60px; max-width: 60px; border:0 !important; border-radius:60px;} .comments .comment-thread.inline-thread { background: none;} .comments .continue { border-top: 0px solid transparent;} .comments .comments-content .datetime { float: right; font-size: 11px;} .comments .comments-content .user a{ font-size: 15px; color: #498EC9;} .comments .comments-content .datetime a:hover{ color: #777; text-decoration: none;} .comments .comments-content .comment:first-child { padding-top: 0px;} .comments .comments-content .comment { margin-bottom: 0px; padding-bottom: 0px;} .comments .continue a { padding: 0px;} .comments .comments-content .icon.blog-author { background-image: none;}   

Customize Comment Box 2.


Blogger Comment Box

 .comments h4   
  {   
  color:#ffffff;   
  display: inline-block !important;   
  background:#3BB7D9;   
  padding:10px;   
  }   
  .comments .comment .comment-actions a {   
  background:#3BB7D9;   
  border-radius: 5px;   
  color: #ffffff;   
  font:12px georgia;   
  margin-right: 8px;   
  padding:5px;   
  text-decoration: none !important;   
  }   
  .comments .comment-block {   
  background:#f8f8f8;   
  border: 1px solid #f0f0f0;   
  padding: 10px;   
  }   
  .continue   
  {   
  border-top:none !important;   
  }   
  .continue a {   
  background:#3BB7D9;   
  border: 1px solid #3BB7D9;   
  border-radius:5px;   
  color: #ffffff;   
  display: inline-block !important;   
  margin-top: 8px;   
  padding:5px;   
  text-decoration: none !important;   
  font:12px georgia ,arial;   
  }   
  .comment-header a {   
  color: #222222 !important;   
  }   
  #comments .avatar-image-container img {   
  border:2px solid #f0f0f0;   
  border-radius: 50px 50px 50px 50px;   
  height: 58px;   
  max-width: 58px;   
  }   
  .comments .avatar-image-container {   
  border: 2px solid #FFFFFF;   
  border-radius: 34px 34px 34px 34px;   
  box-shadow: 1px 1px 3px #dcdcdc;   
  float: left;   
  margin-left: -20px;   
  max-height: 61px !important;   
  overflow: hidden;   
  width: 61px !important;   
  }   


Customize Comment Box 3.

Blogger Comment Box

 .comments h4   
  {   
  color:#ffffff;   
  display: inline-block !important;   
  background:#292832;   
  padding:10px;   
  }   
  .comments .comment .comment-actions a {   
  background:#292832;   
  border-radius: 5px;   
  color: #ffffff;   
  font:12px georgia;   
  margin-right: 8px;   
  padding:5px;   
  text-decoration: none !important;   
  }   
  .comments .comment .comment-actions a:hover {   
  background:#808080;   
  border-radius: 5px;   
  color: #292832;   
  font:12px georgia;   
  margin-right: 8px;   
  padding:5px;   
  text-decoration: none !important;   
  }   
  .comments .comment-block {   
  background:#f8f8f8;   
  border: 1px solid #f0f0f0;   
  padding: 10px;   
  }   
  .continue   
  {   
  border-top:none !important;   
  }   
  .continue a {   
  background:#292832;   
  border: 1px solid #292832;   
  border-radius:5px;   
  color: #ffffff;   
  display: inline-block !important;   
  margin-top: 8px;   
  padding:5px;   
  text-decoration: none !important;   
  font:12px georgia ,arial;   
  }   
  .comment-header a {   
  color: #222222 !important;   
  }   
  #comments .avatar-image-container img {   
  border:2px solid #292832;   
  border-radius: 50px 50px 50px 50px;   
  height: 58px;   
  max-width: 58px;   
  }   
  .comments .avatar-image-container {   
  border: 2px solid #FFFFFF;   
  border-radius: 34px 34px 34px 34px;   
  box-shadow: 1px 1px 3px #dcdcdc;   
  float: left;   
  margin-left: -20px;   
  max-height: 61px !important;   
  overflow: hidden;   
  width: 61px !important;   
  }   

View any of your blog posts, you will have a great looking comment box as shown below.
Related Posts
SHARE

Related Posts

Subscribe to get free updates

4 comments

  1. The process of disbursement of payments needs to be expedient so that depositors do not suffer undue losses and maximum value is derived from the failed institution. To measure the effectiveness of DICGC we calculate the opportunity cost of the delay in payments.

    ReplyDelete
  2. Hello, Pretty good post. I just stumbled upon your blog and wanted to say that I have really enjoyed reading your blog posts. Anyway, I'll be subscribing to your feed and I hope you post again soon. Big thanks for the useful info. Property owners insurance

    ReplyDelete
  3. I like it! Your post is really good providing good information. I liked it and enjoyed reading it. Keep sharing such important posts.I am very much pleased with the contents you have mentioned.I wanted to thank you for this great article.I enjoyed every little bit part of it and I will be waiting for the new updates.I really appreciated this post.Just want to say thank you for the information you have shared. Just continue writing this kind of post. Thanks.
    High waisted Capri leggings

    ReplyDelete
  4. Thanks a lot for enjoying this beauty article with me. I am appreciating it very much! Looking forward to another great article.I really thank you for the valuable info on this great subject and look forward to more great posts.Construction Performance Bond

    ReplyDelete

Post a Comment

Sticky