[Resolved] Search Icon Title Attribute

[David]

I’ve added title attributes to my menu items, but am unable to do so for the search icon, as it’s not listed in any of my menus.

Please advise how I can add a title attribute to the search icon?

Would like to say thanks in advance for all the help you provide – definitely the best about!

[Leo]

Hi there,

You can modify the output with this filter:
https://docs.generatepress.com/article/generate_navigation_search_output/

Adding PHP: https://docs.generatepress.com/article/adding-php/

Let me know if this helps 🙂

[David]

Hi Leo,

That filter has improved it, but it doesn’t add the title till after the Search Icon is clicked. So we’re half way there…

.search-item a:before {
    content: "Search ";
		padding-right: 2rem;
		font-family: inherit;
}

That was what you helped me with recently, so I’d like to add a title tag when hovering on the Search Text/SVG Icon.

Sorry to be a pain. 🙂

[Tom]

Hi there,

Is there a particular reason you’re wanting to add a title attribute to it? From an a11y perspective, it’s not needed, as the menu item has a visible label and an aria-label attribute for screen readers.

Let me know 🙂

[David]

I was just been fussy, to match the others, but you can close it, Tom.

Thanks for your help 🙂

[Tom]

It’s possible, but it means removing the default one and adding a new one, which isn’t super update-friendly. I’ll be to sure to add a filter to it in 2.5.0 so it’s easier 🙂

[David]

That would be great, Tom. Thanks.

I just don’t have the skills to do it, lol. 🙂

[Author]

Posts