Viewing 3 replies - 1 through 3 (of 3 total)
  • See Styling Contact Form for a general explanation of styling CF7 forms using CSS.

    There is a link at the bottom of the page to a comprehensive and detailed article on Styling Contact Form 7 Forms. The article shows people, with suitable HTML & CSS skills, how to change the appearance of their Contact Form 7 Forms to meet their particular requirements.

    Thread Starter ginzelphotography

    (@ginzelphotography)

    I have read that and havent been able to figure it out. I’ve been able to figure out how to use the codes for every other type of customization though by following those directions. Is there someone else who has had experience with changing this and could describe a little better what code is the correct one to use for changing the response comment box colour.

    So far what I have done is follow this guide:

    Style Specific Fields

    You might want to style only specific fields. First, add an ‘id’ or ‘class’ option to the form-tags of the fields in the contact form that you want to style:

    [text text-123 id:very-special-field]

    Then add style rules using the id or class:

    #very-special-field
    {
    color: #f00;
    border: 1px solid #f00;
    }

    SO in the [response] area I included [response id:very-special-field]

    and then in the custom css area for the entire site I plugged in the bottom code changing the values to what I wanted. It didn’t do anything.

    The approach I would suggest in this case is to first make sure the confirmation message is showing on the relevant form and then use Use Firebug or Chrome Dev Tools to examine the CSS used for the confirmation elements.

    Altenatively you can see the CSS the CF7 plugin uses for ​confirmation message elements at Default CF7 CSS style.

Viewing 3 replies - 1 through 3 (of 3 total)

The topic ‘confirmation message customization’ is closed to new replies.