Override CSS on Simple List Widget

[Brian Lancaster]

We recently got a notification from ServiceNow stating that they changed the simple list widget behavior due to security concerns.  I discovered that our first vendor had cloned this widget and it appears they only did this so that they could change the CSS so the panel heading color. This was to make it a darker gray that we wanted. Is there a way to do this without cloning the OOB widget again?

[Ahmmed Ali · Accepted solution]

Hello @Brian Lancaster 

Yes, there is simple way to modify CSS of widget without cloning actual widget itself. You can add below CSS override to the widget instance in your portal page.

.panel-heading{
background-color: red !important;
}

I did below for OOTB index page, you can corelate:

Opened index page definition in platform view, clicked on instance of "Simple list" widget where we need to update CSS.

Widget instance record opens. Add CSS field using form layout if field is already not available. Update CSS field with above mentioned CSS.

Result:

Thank you,

Ali

[Brian Lancaster]

Thanks that worked perfectly.