Notification texts go here Contact Us Buy Now!

3 Stylish Customized Blogger Comment Box

A comment box is a great way to collect feedback from your customer or from your blog read 3 Stylish Customized 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. 

Watch the Video guide to understand better.



1. Sign in to your Blogger blog and select Theme


A comment box is a great way to collect feedback from your customer or from your blog read 3 Stylish Customized 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.
A comment box is a great way to collect feedback from your customer or from your blog read 3 Stylish Customized 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.

A comment box is a great way to collect feedback from your customer or from your blog read 3 Stylish Customized 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.




A comment box is a great way to collect feedback from your customer or from your blog read 3 Stylish Customized 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.

A comment box is a great way to collect feedback from your customer or from your blog read 3 Stylish Customized 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.


إرسال تعليق

Cookie Consent
We serve cookies on this site to analyze traffic, remember your preferences, and optimize your experience.
Oops!
It seems there is something wrong with your internet connection. Please connect to the internet and start browsing again.
AdBlock Detected!
We have detected that you are using adblocking plugin in your browser.
The revenue we earn by the advertisements is used to manage this website, we request you to whitelist our website in your adblocking plugin.
Site is Blocked
Sorry! This site is not available in your country.