Archived topic
Search widget is not accessible
66 replies · Started by Karen on August 12, 2022
We are using the search widget on the navigation and the accessibility plugin is saying it's not accessible. Here's the error message below. It doesn't look like we can get into the code to fix this.
Here's the error:
Missing Form Label:
<input type="search" class="search-field" value="" name="s" title="Search" />
Hi there,
try adding this PHP Snippet to your site:
add_filter( 'generate_navigation_search_output', function() {
printf(
'<form method="get" class="search-form navigation-search" action="%1$s">
<label for=”nav-search”>Search:</label>
<input type="search" placeholder="Enter your search" class="search-field" value="%2$s" name="s" title="%3$s" id="nav-search" />
</form>',
esc_url( home_url( '/' ) ),
esc_attr( get_search_query() ),
esc_attr_x( 'Search', 'label', 'generatepress' )
);
} );
1. There is now a label element you can change the text of here:
<label for=”nav-search”>Search:</label>
2. On the input field there is now a placeholder="Enter your search" attribute that you change the text of.
Okay, thank you. I'll try this on Monday and let you know if it works.
FYI:
Document explaining how to ADD PHP:
https://docs.generatepress.com/article/adding-php/
Let us know how you get on.
Thanks. That didn't take care of it. We're using a child theme and I added it to the functions.php file. It's still showing the error.
Hi Karen,
Can you try this snippet instead?
add_filter( 'generate_navigation_search_output', function() {
printf(
'<form method="get" class="search-form navigation-search" action="%1$s">
<label for="nav-search">Search:</label>
<input type="search" placeholder="Enter your search" class="search-field" value="%2$s" name="s" title="%3$s" />
</form>',
esc_url( home_url( '/' ) ),
esc_attr( get_search_query() ),
esc_attr_x( 'Search', 'label', 'generatepress' )
);
} );Shoot, no, that's not working either. I'm still getting these two errors:
<input type="search" class="search-field" value="" name="s" title="Search" />
Can you provide an admin login to your site using the private info field so we can take a look at the backend?
Sure!
The label has been added:
https://www.screencast.com/t/I5Y1Cyl4
Can you show me the exact error you are getting?
Maybe a screenshot?
I think you fixed it. Can you tell me what you did? Running out now but will check later.
I didn't do anything, just checked if the label is there, and it is :)
I'll recheck the errors again, then. I cleared the cache and everything when I was still getting the errors (after I entered the code to the functions.php) so I'm not sure how they disappeared.
Updated:
We're still getting these error messages:
-------------------
<input type="search" class="search-field" value="" name="s" title="Search" />
--------------------
<input type="search" placeholder="Enter your search" class="search-field" value="" name="s" title="Search" />
---------------------
