Hi I have a site at https://oxwestg.wpenginepowered.com/ – passwords below.
On the 404 page – https://oxwestg.wpenginepowered.com/invented-url-for-404-page there is a search function.
Unfortunately, this search function is producing an error in accessibility checks. The error is:
—————————————————————————————–
Ensure form controls have labels
WCAG 2.0 A 1.3.1
People using screen readers are not able to see the layout of a form. To make forms accessible, they must define explicit text labels for each form control.
Usually the best solution is to use a <label> element. The label may be linked to by the form control:
<label for=”name”>Full name</label>
<input type=”name” id=”name”>
or the <label> can be wrapped around the form control:
<label>
Full name <input type=”name”>
</label>
Buttons are different, as their labels are specified by the code for the button, e.g.
<input type=”submit” value=”Send message”>
<button>Send message</button>
—————————————————————————————–
Do you have any ideas about how we fix that and make it happen in a child theme?
Thanks in advance
Dominic
Hi anyone have any ideas?
Hi,
Thank you for the inquiry.
You can modify or override the themes/enfold/searchform.php file in your child theme. Add the label element around line 24.
<label for="s">Search</label>
<input type="submit" value="<?php echo $icon; ?>" id="searchsubmit" class="button <?php echo $class; ?>" />
<input type="text" id="s" name="<?php echo $search_params['search_id']; ?>" value="<?php if( ! empty( $_GET['s'] ) ) { echo get_search_query(); } ?>" placeholder='<?php echo $search_params['placeholder']; ?>' />
Best regards,
Ismael