How to change background color in Employee Center?

User517509
Tera Expert

Hello - I am working in Employee Center and I am trying to make the background a solid color. The branding tool was no help. Can someone let me know where this can be changed?

 

Thank you! 

2 REPLIES 2

User517509
Tera Expert

I figured it out.  Just had to remove this code from ec-theme-global Style Sheet


background: radial-gradient(at right bottom, $background-gradient-color1 6.56%, $background-gradient-color2 11.16%, $background-gradient-color3 17.26%, $background-gradient-color4 22.64%, $background-gradient-color5 42.58%);

Joakim1
Tera Guru

Great question, and something I had to figure out my self.

 

Problem: Unable to change the background color, even when using Branding Editor
Cause: There is an "!important" property, that overrides any values given to the background color

 

Joakim1_1-1738604474961.png

Solution: Create a custom Style sheet, and connect it to the Portal theme.

  1. In the Filter Navigator, write: "sp_css.do" and hit Enter.
  2. Fill out the form:
    Name: my-custom-css
  3. CSS:

 

body {
  background-color: $body-bg !important;
}

 

  • Submit or Save.
  • Navigate to: Service Portal > Portals
  • Open the portal you want to change the background color of
  • Open the record in the "Theme" field
  • In the related list "CSS Includes", click "New"
  • Fill out the form:
    Order: 200
  • Click on the magnifying glass for the "CSS Include" field
  • Click "New"
  • Fill out the form
    Name: my-css-include
    Source: Style sheet
    Style Sheet: The one created in step 4
  • Submit
  • Verify that the the newly created CSS Include is included in the related list, and that it has the highest "Order" value.

Verification: When portal pages for the portal is rendered, the background color is the same as defined as "Page background" in the Branding Editor.

Joakim1_2-1738605312723.png