Skip to content

WP Forms

Contact Sandy Feldman

WP forms needed some tweaking to make it accessible.

This form was put together using the free version of the WP Forms plugin.

After I added the form to this page I ran WAVE to see if there were any problems.

The out of the box “simple contact form” has a wonky label, so I set it to a single “name” field, instead of using “first name” and “last name” fields. The required * red is too light. I have a custom style here to make that red darker, and the font-weight heavier.

div.wpforms-container-full .wpforms-form .wpforms-required-label {
    color: #A6173D;
    font-weight: 800;
}

The focus style on the submit button was hard to catch, too, so I beefed that up

div.wpforms-container-full .wpforms-form button[type=submit]{
	border: solid 3px #fff;
}
div.wpforms-container-full .wpforms-form button[type=submit]:hover, div.wpforms-container-full .wpforms-form button[type=submit]:focus {
  background-color: #A6173D;
  border: solid 3px #000;
  color:#fff;	
}