Change Placeholder Text in Header Search Bar

SuburbanGringo
Tera Contributor

Hello,

 

I am attempting to update the placeholder text in the search bar on the Employee Center Header. 

SuburbanGringo_0-1725548717969.png

 

We would like to change it from just "Search" to something more user friendly ("How can we help?", etc.). Can someone please point me in the right direction to update this text?

 

Thank you

14 REPLIES 14

You are welcome, @Srinivasa Chall 

 

So, I think that could be why. I jumped into another instance through my work where we have AI Enabled (AI still isn't available in our PDIs). I added the same CSS Include and style sheet to the theme, and nothing changed.

I then went directly into the search widget using AI Search, and modified the CSS directly to the widget. And it still did not change (which is odd).

 

There could be some other element taking full control over the AI styling that I just have not captured yet.

 

When I get more time though, I still want to try this out and see what we can come up with. There has to be a way to change it. Just need to find where.

Yes, Rob. That is what I am trying to find as there should be a way to do it. I don't want to clone the widget and update the OOB widget. Let me know if you find a way out. Thanks again!

Hi @Rob and @Srinivasa Chall ,

 

I've found several of these limitations when is about to edit the styles of the typeahead search when AI is enabled. I'm afraid that ServiceNow is implementing Shadow DOM with CSS that does not allow to override styles with normal CSS in instances/containers/pages/themes of the ESC. Personally, think is really annoying when theming/branding an ESC, these type of limitations came in and there is no clear guidance of how to at least apply a workaround... Let's not talk about that there is nothing that helps in the ServiceNow Docs...


The only official documentation I've found is here: https://www.servicenow.com/docs/bundle/washingtondc-platform-user-interface/page/build/service-porta... but this explains the available variables to change some styles in the search page, when the search term is submitted.

Please, if you find something that could help, share! 

#SharingIsCaring

 

Regards!

We also have AI search enabled and having this as well. Sharing this article if you have not come across it yet.

 

How to change the placeholder text 'Search' in the Homepage Search - Support and Troubleshooting

ViswaSunny
Tera Contributor

Hi,

Go to page designer edit the search widget and in placeholder please type whatever you need so it will fulfill your requirement.

ViswaSunny_0-1726754746162.png