Label fields not displaying

  • Resolved gabier2

    (@gabier2)


    5 years, 10 months ago

    I want to insert a contact form in a wordpress contact page. I have already used it in another site and it works correctly.
    But in this site it does not, it does not display the explaanatory text in labels.
    I inserted the form in the page as specified in the contact panel of the wordpress control panel

    [contact-form-7 id="2343" title="GGContact"]

    The contact form is the following

    <label for="Nom"> Votre nom (obligatoire)</label>
   
 [text* text-145 id:Nom akismet:author]

<label> Votre adresse de messagerie (obligatoire)
  [email* email-921 akismet:author_email]
</label>

<label> Objet
    [text text-229] 
</label>

<label> Votre message
   [textarea textarea-252]
</label>

[submit "Envoyer"]

    I have tried to recreate a new form, to have separate or mixed labels, nothing works, the labels do not want to display.
    I do not know anymore what to try.
    My system is Windows 10 my browser Firefox, but I have tried Internet Explorer, same problem. Anyway, with same system and same browser, the form displays the labels on another wordpres site
    I can’t understand why it works on the later site and not on the former ?
    ?? gabier

    The page I need help with: [log in to see the link]

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

  • I can’t understand why it works on the later site and not on the former ?

    You’re using different WP themes on each site.

    Your problem is caused here:

    https://www.chomage-et-monnaie.org/wp-content/themes/CEM_New/style.css
body {
    font-family: Lucida Grande, Arial, Helvetica, Sans-serif;
    font-size: 0.8em;
    text-align: left;
    background: #B63535;
    color: white; /* THIS MAKES LABELS INVISIBLE */
    margin: 0;
}

    See Styling Contact Form – there is a link to an article I wrote at the bottom of that page (which is recommended by the CF7 plugin author, though I’m not allowed to link directly to it here), that covers this topic in detail.

    Abbreviated Version

    1. You need basic HTML & CSS skills
    2. You need to know how to use Chrome Dev Tools or equivalent
    3. Use Dev Tools to examine the CSS styling applied to your form in detail
    4. Determine what CSS changes you need to make
    5. Add custom CSS via WP Customizer > Custom CSS, custom CSS plugin or child theme.
    Thread Starter gabier2

    (@gabier2)

    Thank you Neil,
    I understand that if not specified else, CF7 uses for fonts the “body” CSS parameters in the “style.css” file.
    I added some CF7 CSS stuff in my style.CSS as explained in your “Styling Contact Form”

    /* Contact Form */
.wpcf7 {
	color:black;
	margin : 0 auto 0.5em 0.3em;
	font-size:1.3em;
}

    And it did the trick.
    Problem solved

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Label fields not displaying’ is closed to new replies.