Support » Plugin: Contact Form 7 » Change color of contact form entry fields?

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Author Takayuki Miyoshi


    You can do it by editing CSS stylesheet in your theme. Add this to your theme’s stylesheet:

    .wpcf7 input[type="text"], .wpcf7 textarea {
        background-color: red;

    Hmmm. That didn’t change anything at all. Was I supposed to just paste it in at the bottom or do I need to add it somewhere specific? I found this block of code in the style sheet:

    .wpcf7-form { font-weight: bold }
    .wpcf7-form span.wpcf7-form-control-wrap { display: block; margin-top: 5px; position: relative; }
    .wpcf7-form input[type=”submit”] { margin-top: 0 }
    .wpcf7-form .ajax-loader { display: none }
    .wpcf7-form p { margin: 0 0 15px }
    .wpcf7-form p:last-of-type { margin: 0 }
    div.wpcf7-validation-errors, span.wpcf7-not-valid-tip { background-color: #FFFFFF; border: medium none !important; border-radius: 4px 4px 4px 4px; box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.05); color: #606060; padding: 10px 25px; text-align: center; margin: 0; }
    div.wpcf7-validation-errors { margin: 25px 0 0 }
    span.wpcf7-not-valid-tip { float: left; position: absolute; right: 0; top: 0; }
    .post-type { background: none repeat scroll 0 0 #BBBBBB; border-radius: 4px 4px 4px 4px; color: #FFFFFF; display: inline-block; float: right; font-weight: 600; margin: -70px 0 10px; padding: 0 8px; text-transform: uppercase; }

    What would I change if I wanted the background to be pale gray instead of white?

    Thanks for trying to help!

    P.S. I also tried replacing #FFFFFF with #dbdbdb in the code above, but nothing changed then, either. 🙁

    Plugin Author Takayuki Miyoshi


    Can I check the site?

    That would be great. It’s

    Thanks again.

    Plugin Author Takayuki Miyoshi


    It should work. Add the style rule at the bottom of the theme’s style.css.

    It did work. I was too literal. I pasted in the code you gave me above, but it doesn’t have a # sign. I added that and it works fine. Thank you again for your help.

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Change color of contact form entry fields?’ is closed to new replies.