Update language labels under Language Switch widget on the Service Portal

[kevinbruneau]

Hi everyone,

I have the language switch widget setup on my Service Portal, and as of now it displays "English" and "French - Canada". I would like to change "French - Canada" to simply "French".

I looked into the widget configurations to see if I could simply update that value from there, but no luck. I can see in the HTML body template that it's accessing the label of an item from a list, is there a way for me to access the values from that list and update it's label from there? :

I also looked into the messages table to see if I could find anything related to that widget, but couldn't find anything - Unless I wasn't using the proper filters?

Thanks,

Kev

[Community Alums]

Did you have any luck with this? I am looking to update the language labels also. 

[kevinbruneau]

Hi Richardsaun 🙂

I can't exactly remember if I found a solution for this.

In the end, we decided to create our own Language Switch widget. In the HTML, I'm checking if the user's language preference is English, if so, I know that as the Label I want to display "Français" otherwise I want to display "English".

<ul class="nav navbar-nav" role="menubar">
  <li>
    <a ng-if="data.userLanguagePref == 'en'" type="link" popover-trigger="outsideClick" role="menuitem" class="lang-page-link nav-item" ng-click='c.changeUserLanguage("fq")'>
      <i class="fa fa-globe"></i>
      <span class="nav-link">Français</span>
    </a>
      
    <a ng-if="data.userLanguagePref == 'fq'" type="link" popover-trigger="outsideClick" role="menuitem" class="lang-page-link nav-item" ng-click='c.changeUserLanguage("en")'>
      <i class="fa fa-globe"></i>
      <span class="nav-link" >English</span>
    </a>
  </li>
</ul>

Server Script :

(function() {
    //Determine which langugae the user currently has selected.
    data.userLanguagePref = gs.getSession().getLanguage();

	if(input){
		var thisUser = new GlideRecord('sys_user');
		thisUser.get(gs.getUserID());
		thisUser.preferred_language = input.input;
		console.log(thisUser.preferred_language);
		thisUser.update();
		return;
	}
})();

Client Controller :

api.controller=function($scope, $window) {
	var c = this;
	//Send the language to set to the server
	c.changeUserLanguage = function(lang) {
		c.server.get({input:lang}).then(function() {
			$window.location.reload();
		});
		
	};
	
};

Then go to your header by navigating to All > Service Portal > Headers & Footers and be sure that the following line of code is present in the Server Script of the current header :

// sp-lang-selector
data.langSelector = $sp.getWidget('Widget-id');

That fixed our problem of not being able to update the labels at the same time and now instead of clicking and having a dropdown, if you click "Français", it will switch to French and will be displaying "English" now

[RichardSaunders]

Fantastic, thank you! 

[kevinbruneau]

My pleasure! 🙂