How to Customize Comment Box and Change Background Images in Blogger

This post is about how to change the comment box background image and color in blogger. The default comment box in blog is looks old, bit less attractive, and its weird color scheme does not allow it to perfectly blend in new customized templates. So comment box must require some modifications or customization, like change in color, theme, background color and image, fonts, style, etc. in order to make it beautiful and appealing.

In this tutorial we will learn how we can change background image of comment box in blogger.First of go to the blogger dashboard, and then site board.

After that tap on Template from left sidebar and then save a copy of template in your machine from Back/Restore button appears on top right. Now click on Edit HTML to start customization.

Now press CTRL + F, and search this ]]></b:skin>, and just before it paste below code.

#comment-form iframe{
background:#ffffff url(URL) repeat;
border:1px solid #ddd;
-moz-border-radius:6px;
-webkit-border-radius:6px;
box-shadow: 5px 5px 5px #CCCCCC;
padding:5px;
font:normal 12pt "ms sans serif", Arial;
color:#0ab00a;
width:560px; height:213px !important;
}
#comment-form a{
color:#fff;
}

Now, search this piece

<div class='comment-form'>

and replace class with id

So after that, it will look something like; 

<div id='comment-form'>

Now hit SAVE, and you are all done.

Things need to be done in script before saving template.

* change URL with the URL of desired image you want to use as background in comment box.

* change 0ab00a if you want to change the 'Comment as' color.

* And for changing width and height of comment box set these value according to your need, 560 and  213, respectively.

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhjv5oQWJLz3Reb_Bu3Hm8utnExAWDHPfFpKQDQ_EMG8FKAScdX_lDu3JF4vPjV1_vKM1qy5cOFWiTgrFDpOrDjEvx_6WBusCmWSkobpCXDdkGxDlIK9lQshmC6-YH2cb-DZBbOXo-TWfcA/s400/comment.jpg

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhPPoMXhwmU5XYR-8iAg_xLIcRG7BiOZV1rWnrXT1wtCanbxiNHmpgcSSjm9If3aPuIdK7IZj3xvnPxCOOnIJhGJv5wk4NULt-OdHJvJn9BbV-N6S1QSY1YI04BuY1e3C6O5LtrLu7y16gh/s400/250x250rain.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhUIX8eAjns5jwysfX3Vg6fCJjgAqcrxMPIe7urmAieeNrP1jYzXNVsfWrskpYguDjjtYxq085pp47g8CVL0BNM6bqQ3wjsNNGSfiBbMK15-Pu1kgyCeCWi-bBcngSs9nLOlvKW25YXxl9u/s1600/468x60leopard.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw5MqK9Ou7tu_5IDW3YCV4RjQrNssgaucSNHJ-hN0ctKglvzfzPmvv57FYm6mPyGSHdMYd2oAH6wkg_miJMRcg33v4K8aiVzlzh4uupms8M_pqM89mJhdr1iVYr7ixMwuqw8wN8DqUgeRx/s1600/bannerautumn1.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj4RjsYu5MsPa7yhfJgNOHfGTft8wXpPFgbKVn2x9rqYXUZ83lqjJqawZjOZF-qQgNDKgBvvhKQoKpsvP04YU_NMeY1ToklqPUnnCyoeRwJ8UdcX9YPgEyLxxeqyeTRsXYkTfNEdD0q2SBh/s1600/bluecornerpeel.gif

https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwx8S69wPq1gcObI4Tr7lEyqINsG35mXaeb9mE9bWWZERvdXMeZkKWqhaodgWMYe9U-92zl3ny1DGGNNRzM0k8pdR6FN_Y2WEqocV1rkuD70VU7h_iIx2uCBi30FjWA0a__BqKyYFSGvb0/s1600/camouflage.gif

I hope you will like these comments cool background images, I have bunch of more themes like that, some of them are already shared in this post with there URL, and for more you can check below video and to grab them right NOW just subscribe us by email submission and you can also follow us on twitter and facebook,. After that let me know your subscribed email via comment that will make it easy for me to shot an email to you with all background images for comment box as shown in following video.

I have bunch more things to share with you folks, a lot of more tricks, that will help you to play more with blogger comment box and can customize comments section as want. keep in touch with us. Thanks.