CSS Guide

How to Customize the Look of Your Comment Box:

For the time being, you must know basic CSS in order to style your comment box. w3schools has great tutorials for learning CSS. You can customize the size, color and fonts in your comment box using CSS, just like you can for the rest of your webpage. CSS is code that can go, among other places, in a <style> tag. It's recommended that you start with the "unstyled" version of HTML Comment Box, download one of these skin packages, and customize it to your needs.

• Here is a plain custom stylesheet: [download].
• Here is a graphical custom stylesheet "shady": [download].

(You will need to include the styelsheet in your website's source, using a <link> or <style> tag)

CSS Examples

Comment Box Color

Here is an example that makes the comment box red.

<style>
#HCB_comment_box textarea {
  background-color:red;
}
</style>
        

Comment Box Size

This example makes the comment box much larger.

<style>
#HCB_comment_box div.hcb-wrapper {
  width:600px;
}
#HCB_comment_box textarea {
  height:400px;
}
</style>
        

Comment Color

This example changes the color of the comments.

<style>
#HCB_comment_box {
  color:blue;
}
</style>
        

Comment Size

This example makes the comments a little larger.

<style>
#HCB_comment_box {
  font-size:110%;
}
</style>
        

Submit Button Color

This example changes the color and border of the submit button.

<style>
#HCB_comment_box .submit {
  background-color:green;
  border:1px solid darkgreen;
}
</style>
        

To customize the text in the comment box form (ie, for different languages) see the advanced options.