Problem:
How many times have you come across for the need to change some basic styling elements on an MSP instance such as company logo, header background, link/text colors etc. based on the logged in user?
Solution:
Updating the logo on the Service Portal Header is straight forward. You can replace the portal logo with logged in user’s company logo. To change key branding elements specific to this user/company we can dynamically call the required stylesheets from the HTML part of the Header widget.
Prerequisites:
Ø Your Service Portal should have a baseline branding (main stylesheet linked to the service Portal Theme) which allows the flexibility to change/overlap the styling elements without affecting the behavioral aspect.
Ø Additional stylesheets that provides key UI changes such as background and text colors.
Below are the screenshots of Service Portal with default theme and logged in with users from different company on MSP instance.
Default theme portal (Logged in Administrator):
Logged in as user from Acme France:
Logged in as user from Acme Australia:
How to achieve this?
<link rel="stylesheet" type="text/css" ng-href="{{data.customStyleSheet}}.spcssdbx">Above line of code will fetch the required CSS file based on the value of data.customStyleSheet from your server script.
In Action:
