KB portal branding: Changing the banner image of a knowledge base portal home page

TshwaraganoS
Tera Contributor

Hi there. How do I change the banner image or background image of a knowledge base portal? Please refer to the attached screenshot.  Lastly, how do I change the black text to white or any other colour? 

 

 

2 REPLIES 2

Debasis Pati
Tera Guru

Hello @TshwaraganoS ,

You can try the below steps

Updating the Service Portal Theme Follow the below
Navigate to: Service Portal > Portals

Open the Knowledge Base portal (e.g., kb).

Look for the Theme field and open the assigned theme.

In the Theme record, find the CSS variable for the banner or background:

Background image may be defined in CSS Variables or directly in the CSS field.
Update the CSS:

CSS:

/* Change Background Image */
.sp-header {
background-image: url('https://your-instance.service-now.com/sys_attachment.do?sys_id=YOUR_IMAGE_SYS_ID');
background-size: cover;
background-position: center;
}


Change Text Color (e.g., from Black to White)
The text color is usually controlled through CSS.

Method 1: Modify the Service Portal Theme
Go to: Service Portal > Themes

Open the theme assigned to your Knowledge Base portal.

Look for CSS Variables or add custom CSS in the CSS field.

Add or modify the text color:



/* Change Header Text Color */
.sp-header h1,
.sp-header h2,
.sp-header h3,
.sp-header p {
color: white !important;
}

/* Change Text in Body */
body {
color: white !important;
}

If my answer helps you please mark it as correct/helpful.

Regards,
Debasis

I will give it a try and mark it as helpful if it solves my problem. Thank you Debasis!