Customization for Typeahead Search widget
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
3 hours ago - last edited 3 hours ago
Hi guys,
does anyone know how i can customize the typehead search widget on employee center? I just want to style the corners of the widget.
With the help of dev-tools i founded out, where i can deactivate this roud corners. Because when you deactive "border-bottom-left-radius" the corners will change.
With the page css i tried to change/deactive it but it didnt worked. Can someone with some Servicenow/CSS expierience help me?
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
3 hours ago
Hi @Julian Reis ,
You need to customize the widget for that clone the widget and configured like this-
and in the internal widget also you need to do apply some css like this-
after this you will get this kind of output-
Hope that is help you!!!
Thank you!
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
3 hours ago
Thank you for your response 🙂 Maybe I havent described my problem precisely enough. I want to redesign the Searchbar so that the corners of the searchbar are smoother like in this example (please ignore the blue background my main goal is to change the corners of the searchbar):
The current design of the searchbar is like this:
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
2 hours ago
Hi @Julian Reis
Configure the widget like this-
and you will get the output like this-
If it's helpful to you please mark as helpful and accept the solution
Thank you!!1
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
2 hours ago
Hi ,
you cannot edit service now OOTB widget. you have to cloned(copy) OOTB widget. then make changes in widget whatever you need.
then open page in designer and remove OOTB typhead widget and add your widget.
widget changes.
1) right click on the widget . open widget in editior
2)cloend the Homepage search widgets.
3)now in your widget edit the code .you can take help of Chatgpt to edit csss of this widget.
4) once you edit you widget. save this .
then
open got to portal page where you widget is added.
right click on the widget and open page in "page in desinger"
remove oOTB widget and add your cloned widget
If my response helped you, please mark it as the correct answer \
Thanks..!