question To change the header color on Employee center portal in Employee Slate and Employee Center forum

To change the header color on Employee center portal

Shashank_sj10 — Fri, 22 Nov 2024 06:52:57 GMT

Hello Everyone,

We have a requirement to change the header color on the ESC portal where the logo and links are currently displayed on a black background. I attempted to update the color using the Service Portal Configuration > Branding Editor. While the changes were initially applied, the header reverted to black upon further updates, and now any attempts to change the color have no effect.

Has anyone encountered a similar issue?

If you have any suggestions or solutions, I would greatly appreciate your help. Looking forward to your responses.

Thank you!

Attaching Screenshot for you reference.

Re: To change the header color on Employee center portal

Community Alums — Fri, 22 Nov 2024 13:31:19 GMT

HI @Shashank_sj10 ,

Please refer to this thread :

https://www.servicenow.com/community/developer-forum/employee-center-header-menu-items-color-change/td-p/2821336

Re: To change the header color on Employee center portal

ChrisBurks — Fri, 22 Nov 2024 13:42:39 GMT

Hi @Shashank_sj10

Make sure the right Application Scope is selected when making the change. If you're not in the correct scope then you'll see this message in the Branding Editor:

However, if you are in the correct scope the next thing to check is in the portal record. Making changes in the Branding Editor actually populates the portal record with the CSS variables values.

Look at the highlighted variable $navbar-inverse-bg and its value #f95050. Notice how it matches the "Navbar Background" setting in the Branding Editor. Make sure these values match when changes are made. If they don't match then change it in the Employee Center portal record to the desired value.

If it still is not changing, then there may have been a change in the theme's CSS records. You'll then need to look for any CSS overriding the value set in the portal record/Branding editor.