WordPress.org

Forums

Contact Form 7
[resolved] How to add an ID to a field so I can use the label tag? (4 posts)

  1. jouielovesyou
    Member
    Posted 2 years ago #

    Hello.

    I would like to use the <label for=""></label> for accessibility purposes but was unable to because I couldn't find any ID of any input field. I would appreciate if you can help me on this. The form is causing some errors when validating using http://www.wave.webaim.org/.

    https://wordpress.org/plugins/contact-form-7/

  2. Rian Rietveld
    Member
    Posted 2 years ago #

    Hi jouielovesyou,

    Change the default form from:

    <p>Your Name (required)<br />
    [text* your-name] </p>
    ><p>Your Email (required)<br />
    [email* your-email] </p>
    <p>Subject<br />
    [text your-subject] </p>
    <p>Your Message<br />
    [textarea your-message] </p>
    <p>[submit "Send"]</p>

    into (for example):

    <fieldset>
    <label for="name">Name (required)</label>
    [text* your-name id:name]
    <label for="e-mail">Email address (required)</label>
    [email* your-email id:e-mail]
    </fieldset>
    [submit "I want your newsletter"]

    More on:
    http://blog.rrwd.nl/2014/03/01/how-to-set-up-an-accessible-form-using-contact-form-7-in-wordpress/

  3. jouielovesyou
    Member
    Posted 2 years ago #

    It worked! Thanks

  4. buzztone
    Member
    Posted 2 years ago #

    @Rian Rietveld - thanks for the link. That's a really useful & well written article.

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Contact Form 7
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic