[Resolved] Accessibility checker – Search bar

Home Forums Support Accessibility checker – Search bar

Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #1108102
    Harris

    Hello

    Any workaround to ommit this “error” from achecker.ca
    As far as I understand it comes from the search funcionality in the header.

    https://i.gyazo.com/55b5901f3fd835c80d849e343e1bf1f7.png

    Thanks!

    #1108349
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    That element indeed has no text, but it does have an aria-label attribute, which makes it so text isn’t necessary.

    I think you can safely ignore that one 🙂

    #1108439
    Harris

    Hello Tom,
    Thanks for your reply. I know that it doesn’t cause a problem, but I need to provide to the client an error free report from this tool, so if there is any kind of workaround please let me know.

    #1109000
    Tom
    Lead Developer
    Lead Developer

    In order to “fix” the error, you would need to remove the current menu item and add your own with text.

    To do that, you can do this:

    remove_filter( 'wp_nav_menu_items', 'generate_menu_search_icon', 10, 2 );
    
    add_filter( 'wp_nav_menu_items', function( $items, $args ) {
        if ( isset( $args->theme_location ) && 'primary' === $args->theme_location ) {
            return sprintf(
                '%1$s<li class="search-item"><a aria-label="%2$s" href="#">%3$s Search</a></li>',
                $items,
                esc_attr__( 'Open Search Bar', 'generatepress' ),
                generate_get_svg_icon( 'search', true )
            );
        }
    
        return $items;
    }, 10, 2 );
    #1109036
    Harris

    Thanks Tom! I will give it a go!
    I know it is not an error but there are some E.U. programs funding website builds that require error free reports from a couple of checkers including achecker.

Viewing 5 posts - 1 through 5 (of 5 total)
  • You must be logged in to reply to this topic.