Customize Comment Background Style For Blogger

This is a new type of comment form which can be customized easily. This comment form has a background image in it. This background can be change with any other background.Many of the blogs have a different type of comment form.This comment form can be changed every day as it needs only a background image.No any other requirement. So today i will teach you how to add this comment background style to blogger.

Steps To Add Comment Background Style To Blogger

• Login to your Dashboard.
• Go to Template >>Edit Html.
• Tick on Expand the Widgets.
• Find for ]]></b:skin> tag.
• Paste the below code before  ]]></b:skin> tag.

#blog-toolz-form iframe{
background:#000000 url(Image Url) repeat;
-webkit-transition:all 0.4s ease-in-out;
-moz-transition:all 0.4s ease-in-out;
-ms-transition:all 0.4s ease-in-out;
-o-transition:all 0.4s ease-in-out;
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:#000000;
width:560px; height:213px !important;
}

Notice:- To find some Good backgrounds go to background lab.com

• Replace the Red link with your image link.

Update For Comment Background Style For Blogger

#blog-toolz-form iframe:hover{
background:#000000 url(Hover Image Url) repeat;
border:2px dotted #F35C1B;

Note: Change The Red Text With Your Image Link And Blue Text With Your Dotted Line Color.

• Add the above CSS script just below the first script.
• This the below image.

• Now, Find for <div class='comment-form'>
• Replace the above code with the below code.

<div id='blog-toolz-form'>

• After that click on Save the Template.

It's Done.

Categories: Blogger Tricks , CSS