Issue
After customizing the Service Portal's header either through the sp_header_footer record or via the Service Portal branding editor, the Service Portal header may not show the expected changes when viewed through the mobile app.
Release
All releases of ServiceNow Mobile App
Cause
There is a separate CSS specifically for the navigation bar when viewed through the mobile app.
/* for mobile app */
.navbar-inverse.is-native {
background-color: #405060;
}
Resolution
To solve this, make sure that the CSS for the navigation bar on the mobile app is also configured, which can be done via the following steps:
- Navigate to the header record for the Portal. A list can be found at: https://<your-instance>.service-now.com/sp_header_footer_list.do
- Once you have the appropriate header record opened, locate the CSS field.
- In the CSS field, locate the following code:
/* for mobile app */
.navbar-inverse.is-native {
background-color: #405060;
} - Edit the background-color to the desired color
- Save.