Change the Service Portal Widget Back ground Color

SNOW46
Tera Contributor

Hi All,

I want to change the widget header color in Service Portal.

can anyone suggest me on the same.

find_real_file.png

The one above marked in red I want to change the color of the background.

 

1 ACCEPTED SOLUTION

Hi,

With the step provided and is OOB, you can make the color either red(Danger), blue(Primary), orange(Warning), green(Success), Light blue(Info).

OR you can add panel-heading class in the CSS of the widget instance as shown in the screenshot.

find_real_file.png

If you want things other than these, you need to clone the widget, provide some id to the div tag holding the header and provide CSS to it according to your needs. And by doing so, you will be cloning each and every widget of this type you are using in your portal which will be a little hectic.

 

Regards,

Manan

View solution in original post

12 REPLIES 12

Naveen4
Kilo Guru

Hi,

 

click on the widget (CTRL+ Right click ) then opt for page in editor and then chage the colourusing bootstrap colour

 

FYi....

find_real_file.png

 

 

Thanks,Naveen

SNOW46
Tera Contributor

Hello Naveen,

The way you said I know it. But I want to change the default bootstrap which is selected the color to bit deep grey or some other color code.

Please suggest.

Hi,

 

if you want to do widget specific css Chanhges use the css Box over there and do your customizations..

FYI....

 

find_real_file.png

 

follow this link:

 

https://docs.servicenow.com/bundle/helsinki-servicenow-platform/page/build/service-portal/concept/widget-css.html

please make it helpful/correct if it helps.

SNOW46
Tera Contributor

Hello Naveen,

Can you suggest me how to apply the changes in CSS for the OOB Default Bootstrap.

How to use the code for defining color for the panel heading.