WordPress.org

Ready to get started?Download WordPress

Forums

Contact Form 7 Accessibility (1 post)

  1. elizabethandesign
    Member
    Posted 3 years ago #

    I recently ran an ADA compliance check on my site with the tool below and found out that my Contact Form 7 forms weren't compliant:

    http://fae.cita.illinois.edu/

    The forms needed labels, but I wasn't sure how to add the "id" information to the form tag so I could reference it in my "label" tag. Through poking around with the custom tag generator, I figured out how to add this info to the standard form elements.

    You have to be on the edit page of Contact Form 7 within your WordPress site dashboard. Simply add "id:your-label-name" to the end of the code inside the brackets that CF7 generates for each form field. Refer to this "id" in your label tag wrapping around the description text and form element tag.

    Like so:

    <label for="yourname">Your Name (required)<br />
        [text* your-name id:yourname] </label>

    Just for clarification, this is what it would have looked like if you were doing this in normal HTML, without Contact Form 7's help:

    <LABEL for="yourname">Your Name (required)
         <INPUT type="text" id="yourname">
       </LABEL>

Topic Closed

This topic has been closed to new replies.

About this Topic

  • RSS feed for this topic
  • Started 3 years ago by elizabethandesign
  • This topic is not resolved
  • WordPress version: 3.1.3