Dynamic Logo on Service Portal

[arnabbose]

Hi,

How can we have a Dynamic logo based on users company in Service Portal?

I want to use gs.getUser().getCompanyID() in server side and populate this according to company.

I have already cloned and created a custom header from Stock Header , but can anyone tell me how I can establish this?

[chirag_bagdai · Accepted solution]

Hi Arnab,

I just tried as b-rad has suggested which may help you :

Steps:

1. Clone "Stock Header" widget.

2. Make changes as described in step 4 & 5.

3. Goto your portal Themes and update "Header" field value with newly created widget (clone of stock header).

4.- Add below server script where you need to query and assign image URL :

var company_id = gs.getUser().getCompanyID();
//var grGetCompanyLogo = new GlideRecord('table_name');

data.company_logo_url = 'image URL'; // when you get image path
if(data.company_logo_url =='') 
         data.company_logo_url = false; // When you don't get dynamic image path

5. Update below HTML :

   <a class="navbar-brand" ng-if="::!portal.logo && !data.company_logo_url" href="?id={{::portal.homepage_dv}}"><span>{{::portal.title}}</span></a>
           <a class="navbar-brand navbar-brand-logo" ng-if="::portal.logo && !data.company_logo_url" href="?id={{::portal.homepage_dv}}">
                         <img ng-src="{{::portal.logo}}" />
           </a>

           <a class="navbar-brand" ng-if="!data.company_logo_url" href="?id={{c.data.portal_home_url}}"><span>{{c.data.portal_title}}</span></a>
           <a class="navbar-brand navbar-brand-logo" ng-if="data.company_logo_url" href="?id={{c.data.portal_home_url}}">
                       <img ng-src="{{c.data.company_logo_url}}" />
           </a>

Here we are checking :

if the custom company logo url is set/present then show custom logo else show portal logo (just in-case when image URL is blank) you may change as per your requirement.

[arnabbose]

Thanks Chirag...

However; not sure what you mean by below line...

data.company_logo_url = 'image URL'; // when you get image path

Do I have to upload the image to some field to the Company in the companies table? If yes, which field? Else, are we directly loading the image to Images table?

[chirag_bagdai]

You can use "Banner Image" field which is there in company table itself.   Just query company table and get the image path then assign it to data.company_logo_url.

[arnabbose]

I replaced below with your html code...

<a class="navbar-brand" ng-if="::!portal.logo" href="?id={{::portal.homepage_dv}}"><span>{{::portal.title}}</span></a>

          <a class="navbar-brand navbar-brand-logo" ng-if="::portal.logo" href="?id={{::portal.homepage_dv}}">

              <img ng-src="{{::portal.logo}}" />

          </a>

server side is...

var company_id = gs.getUser().getCompanyID();  

//var grGetCompanyLogo = new GlideRecord('table_name');  

data.company_logo_url = 'company_id.banner_image'; // when you get image path  

if(data.company_logo_url =='')   {

        data.company_logo_url = false; // When you don't get dynamic image path

}

But getting as below...

[chirag_bagdai]

Hi Arnab,

You need to query core_company (Company) table and get the display value of "banner_image" field, as described below :

var company_id =   gs.getUser().getCompanyID();
var grCompany = new GlideRecord('core_company'); 
if(grCompany.get(company_id)) {
   data.company_logo_url = grCompany.getDisplayValue('banner_image');
}