WordPress.org

Ready to get started?Download WordPress

Forums

Contact Form 7
This plugin is not WCAG accessible (7 posts)

  1. dmpp
    Member
    Posted 8 months ago #

    When will you add the titles and labels to the plugin so that it can conform to WCAG accessibility standards? (at minimum Level A)

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

  2. dmpp
    Member
    Posted 8 months ago #

    The form elements need to have <label for="field_id">text here</label> tags on them... where the for="" should be the ID value of the field generated by CF7.

    What can be done to get this moved up to a top priority?

    I can't believe that the plugin is not accessible like this.

  3. Takayuki Miyoshi
    Member
    Plugin Author

    Posted 8 months ago #

  4. dmpp
    Member
    Posted 8 months ago #

    Hi Takayuki,

    Thanks for the link, but that doesn't help make it accessible.

    A form element must have a label with it.

    So, where a text field like name would be put in, it should be like this...
    <label for="name">Name:</label><input type="text" value="name" id="name" />

    The plugin is not putting in the <label> tags.

    As a side note, the "for" value should equal the "id" value.

  5. Takayuki Miyoshi
    Member
    Plugin Author

    Posted 8 months ago #

    The plugin allows you to put <label> tags in your form as well as other HTML structures.

  6. dmpp
    Member
    Posted 8 months ago #

    Can you tell me how to do that? When I go into the CF7, I don't see how it adds the labels. Do I need to do that manually on the left-side "Form" field?

  7. esmi
    Forum Moderator
    Posted 8 months ago #

    Yes. For example, the forum at http://quirm.net/contact/ uses the following in the form field:

    <p><label for="name">Name (required)</label>
        [text* your-name akismet:author id:name] </p>
    
    <p><label for="email">Email Address (required)</label>
        [email* your-email akismet:author_email id:email] </p>
    
    <p><label for="subject">Subject (required)</label>
        [select* your-subject id:subject include_blank "I would like to develop an eShop add-on plugin" "I want a custom theme" "I need you to install WordPress for me" "I need you to troubleshoot my WordPress site" "I just want to rant!"]</p>
    
    <p><label for="message">Your Message</label><br />
        [textarea your-message id:message] </p>
    
    <p class="right">[submit "Send"]</p>

Reply

You must log in to post.

About this Plugin

About this Topic