Use A Cool Envelope Background Image On Your Blogger Comments

In this post we are going to see how to add a really cool envelope image behind your Blog Comment Form.The envelope image will blend in with the comment form itself along with the Post A Comment Message, Post Comment and Preview Buttons and subscribe by email link.The image is grey with a nice design in the top left and a small icon will be below the subscribe by Email link users click to be notified of replies.

I always seem to be working on a million things and strangely enough i genuinely cant remember working on this.Last week as i was looking through a few test blogs (Must have over 100 now) i came across this on the comments section of one of them.I had even posted a test comment dated November 29 2010 so it was tested and ready to go and then i totally forgot about it ! Who knows what goes on in this head of mine or what great ideas lie hidden in long forgotten test blogs.

Screenshot

Background Image For Comment Form - Video Tutorial

The steps for this are explained i the video with the code needed and a summery of the steps below.



Code 1.

.comment-form {
background:#ffffff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisSWHVLeQc2QdM6tdrZPhIzIzAW-ba_ARb3dd_Ic_9KZ2Up2gi5UqRuZVJvGVCvnrBQxREFGJhT1nuLUcDwOm3gU39SVWO9nG0j_Yj1cP5SXgyRg1mINdB-lrvswWnYPngvdMgmUocFrI/s1600/leave+reply+comment+background.jpg) no-repeat; 
padding: 100px 5px 0px 25px;
}

Code 2.

#comment-form {
background:#ffffff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEisSWHVLeQc2QdM6tdrZPhIzIzAW-ba_ARb3dd_Ic_9KZ2Up2gi5UqRuZVJvGVCvnrBQxREFGJhT1nuLUcDwOm3gU39SVWO9nG0j_Yj1cP5SXgyRg1mINdB-lrvswWnYPngvdMgmUocFrI/s1600/leave+reply+comment+background.jpg) no-repeat; 
padding: 100px 5px 0px 25px;
}

Summery

A. Click Design
B. Click Template Designer Link.
C. Click Advanced.
D. Scroll To Add Css.
E. Paste In Code And Click Apply To Blog.

Note - The width of your posts and comment form may make the image be out of line with the comment form.

And that's it you have a neat background image on your comment form.Check out more of ourComments Tutorials and Blogger Tips