How to Customize Blogger Comment Form

Posted by: Shahbaz Malik on 23 January 2012 Under:
Blogger   cool comment form
One of the major drawback of Blogger is very much related to its template. The official Blogger template have not creative appearance as in Wordpress. So by going through this tutorial you can make your template to look more professional by modifying its comment form. Generally most of the people find difficulty in customising the odd look of Blogger comment form due to this their comment form doesn’t attract visitors by its appearance. So today I am going to explain you how you can customise the odd look of your Blogger comment form using CSS.

How to Modify Blogger Comment Form:-

  1. Login to Blogger Dashboard.
  2. Go to Design / Edit HTML.
  3. Click "Expand Widget Templates".
  4. Download full template before making any changes in it(Learn More).
                                Blogger Design edit HTML
  1. Search (ctrl+f) ]]></b:skin> in template.
  2. Paste ( Place) the following code just above (before)  it.
/* code written on internetricks4u.blogspot.com */
#bit-form iframe
     {background:#ffffff url (IMAGE LINK ) repeat;
       border: 1px solid #ddd;
       padding:5px;
      -moz-border-radius:6px;
       -webkit-border-radius:6px;
       border-radius:6px;

      box-shadow:5px 5px 5px #cccccc;
     font: normal 12pt "ms sans serif " , Arial;
     width:560;
     color:#2f97ff;
     height:213px;
    }
#bit-form a
     {
      color:#fff;
     }
 Note:-
  • Replace (IMAGE LINK ) with any of the background pictutre that you want to display just behind the comment form.
  • To change the color of "comment as", simply change #2f97ff  with any hexadecimal color code ( for complete list of hexadecimal color code click here ).
That's all, I think this tutorial will definitely help you to make your template more professional. If  you like the above article then don't forget to subscribe it for latest updates. Also read

    If you enjoyed this article then kindly take 5 seconds to share it!!

    2 comments:

    1. Hi Shahbaz what is the use of:

      #bit-form a
      {
      color:#fff;
      }

      ReplyDelete
      Replies
      1. color:#fff; gives the white appearnace to all links that comes under the #bit-form

        Delete

    LinkWithin

    Related Posts Plugin for WordPress, Blogger...