Codeless
  • Support Home
  • Themes
  • Support
  • WordPress Tutorials
    • How to Start a Blog
    • Best Website Builders
    • Best Small Business Hosting
    • Email Marketing Services
    • Cheap WordPress Hosting
  • Video Tutorials

Community Forums

Contact form field colors

    • 6 years, 4 months ago maxime
      Participant

      Hi, i just set up a form on my website, but i don’t know why but there is no field color (white) with no strokes, so we don’t see fields.

      How could i edit it?

       

      thank you

       

    • 6 years, 4 months ago Mirela
      Participant

      Hello,

      Are you referring to this page: https://ess-expertise.fr/contacter-ess-expertise-amiens/ ? The fields do have borders here and so are visible. You can style the fields with custom css. I can help you with that, but i need the link of the page where you have this form.

      Best regards!

    • 6 years, 4 months ago maxime
      Participant
      This reply has been marked as private.
    • 6 years, 4 months ago Mirela
      Participant

      Hello,

      Please add this code into your custom css box in General Options :

      .wpcf7-form-control-wrap input[type="text"], .wpcf7-form-control-wrap input[type="email"], .wpcf7-form-control-wrap input[type="tel"] {
          width: 100%;
          height: 40px;
          background: #f7f6f6 !important;
      }

      ..change the values to your wish. If you want to add a border, add this line too:
      border: 1px solid #000;
      Change the values to your wish.

      Best regards!

    • 6 years, 4 months ago maxime
      Participant

      Thank you.

      I type this

      .wpcf7-form-control-wrap input[type=”text”], .wpcf7-form-control-wrap input[type=”email”], .wpcf7-form-control-wrap input[type=”tel”]
      .wpcf7-form-control-wrap input[type=”textarea-message”]
      {
      width: 100%;
      border: 1px solid #ededed;
      height: 40px;
      background: #f7f6f6 !important;

      }

      I tried to add background color to the text area. And the border doesn’t works.

      Would you tell me why on my other website (https://ess-expertise.fr/contacter-ess-expertise-amiens) i didn’t need to add css code to get the contact form as it is, however it is the same theme , i just copy the form from ess-expertise and paste to ess-rh, i thought i’ll get the same form.

    • 6 years, 4 months ago Mirela
      Participant

      Hello,

      Add !important to the border attribute. Like this: border: 1px solid #ededed !important;

      This is the css for the other site:

      .wpcf7-form-control-wrap input[type=text], .wpcf7-form-control-wrap input[type=email], .wpcf7-form-control-wrap input[type=tel]{
          border: 1px solid #ededed;
          background: #f7f6f6 !important;
      }

      Let me know.
      Best regards!

    • 6 years, 4 months ago maxime
      Participant

      Ok thank you. It’s almost done, just i don’t know how to add the same border to the message area

       

      Regards

    • 6 years, 4 months ago maxime
      Participant

      ok i finally found by myself, thank you for your help !

    • 6 years, 4 months ago Mirela
      Participant

      Great!

      Let us know if you need further help.
      Best regards!

Viewing 8 reply threads

You must be logged in to reply to this topic.

Login

Log In
Register

Renew Support

  • Renew Specular Support
  • Renew Tower Support
  • Renew Folie Support
  • Renew Handel Support
  • Renew June Support
  • Renew Picante Support
  • Renew Thype Support
  • Renew Regn Support

Search Forums

Forums

  • Bygge – Construction Theme
  • Converta – Software Theme
  • Folie – The WordPress Website Builder
  • Handel – Responsive Multi-Purpose Business Theme
  • June WooCommerce WordPress Theme
  • Livecast – Podcast Theme
  • Picante – Restaurant & Food WordPress Theme
  • Regn | Agency & Business WordPress Theme
  • Remake – Minimal Portfolio & Agency Theme
  • Specular – Multi-Purpose WordPress Theme
  • Suggest us Features
  • Tower – Business-Driven Multipurpose WP Theme
  • Vibrance – Photography Theme

Site Links

  • Support Policy
  • Specular Support Forum
  • Video Tutorials
  • Knowledge Base
  • Guides and Reviews

Useful Articles

  • Build a Website
  • Web Design & Development
  • Hosting
  • WordPress

Login

Log In
Register Lost Password