Examples of how to modify the banner
-
- UpdatedFeb 1, 2024
- 2 minutes to read
- Washington DC
- Navigation and UI
There are various ways that you can modify the banner on your instances.
Label multiple instances differently
- On all instances, leave glide.product.description <blank>
- On PROD instance, set glide.product.name to <My Company>
- On DEV instance, set glide.product.name to <My Company - DEV>
Control the window title
- glide.product.name set to <Window Title that you want>
- glide.product.name.style set to <display: none>
- glide.product.description set to <blank>
The company record Banner Image and Banner Text are used to set the banner image and text since the company banner text is not used in the window title.
Use HTML in the banner text
- glide.product.name set to <My Company>
- glide.product.name.style set to <display: none>
- glide.product.description set to <Some text <a href="some_url">Click here</a>>
Position banner text over the banner image
- glide.product.name set to <My Company>
- glide.product.name.style set to <display: none>
- glide.product.image set to <your company logo.gif>
- glide.product.description set to <Some text for the description>
- glide.product.description.style set to <position:absolute; top:5px; left:100px> (position values may vary based on specified needs)
Apply a background image to the banner
Often corporate guidelines require more in-depth branding of the ServiceNow interface. Using the tiling technique, you can modify your logo image to have a transparent background, so that you can apply another image to the banner beneath the logo.
Upload an image to the image manager and then create a new property named css.banner.background.image, so that you can call the image. The value should look like this.
css.banner.background.image value url('./images/MasterBG.jpgx')
Write CSS rules that apply this change
On this page
Related Content
- Banner logo link
Properties are available to control the URL and target frame used when clicking the banner logo.
- Customize the banner logo in Core UI
Use the glide.product.image and glide.product.description properties to change the banner logo and description in Core UI.
- Customize the favicon
Use the glide.product.icon property to change the icon that appears in bookmarks and the browser address bar.
- Modify the banner
The banner is displayed at the top of the page and is rendered using certain system properties.