Change languague switcher block

Online Support Service
1

Is there an easy way to change the language switcher block to display the language name or a flag instead of the Drupal language code? (E.g. English|Francais instead of EN|FR.)

I have seen https://www.drupal.org/project/bootstrap_languages but I did not get it work with the CERN theme yet.

2

Hello Nils,

The module you mention is a Drupal 7 module even though our infrastructure is on Drupal 8 and as a result it cannot be installed.

Regarding displaying flags on language switcher

In general when it comes to web development it is a bad practice since flags represent nations and not languages and it can be misleading. Just think about English, which flag do you add, the UK one, the US one, the AUS one? What about French, do you add the French flag or the Belgian one? And if you add the Belgian one, do you mean the French speaking part or the Dutch speaking park of Belgium? Especially at CERN where we have members from different countries, it could cause issues (also political issues) so I believe you should avoid it. You can find different resources online but specifically W3C marks using flags as a bad practice.

Regarding changing the name of the language

This would require to override the theme. Let me know if you are interested in this solution so I can explain how to do it.

Hope that helps.

Konstantinos

3

Hi Konstantinos, thanks for your suggestions. Actually the question is related to a Norwegian CERN info site in English and Norwegian, where we would like to avoid the ugly “NB” code for Norwegian, and rather use “NO” or “Norsk”. ( https://test-norway.web.cern.ch )

BTW, the bootstrap language module exist for Drupal 8 too, but it is probably easier to simply override the theme as you suggest.

4

Hey there,

Sure I understand the issue. In order to install the override theme and modify the languages:

  1. Mount the website and install the CERN override theme.
  2. After installing the override theme, open the cernoverride.theme file and append the following snippet:
/**
 * Override function that modifies the language switcher links to display language label instead of code
 * 
 * @param $variables
 */
function cernoverride_preprocess_links__language_block(&$variables) {
   foreach ($variables['links'] as $i => $link) {
		 if (isset($link['link']['#options']['language'])) {
			 $linkLanguage = $link['link']['#options']['language'];
			 $variables['links'][$i]['link']['#title'] = $linkLanguage->get('label');
		 }
	 }
 }
  1. Clear the caches of the website
  2. Navigate to the front page of the site and check the language switcher. It should show “ENGLISH” and “FRENCH” instead of “EN” and “FR”

FAQ

What does the snippet do?
It replaces the language text with the label instead of the language code.

What if I want to change the name/label of the language (eg. instead of Norwegian to display Norge etc.)?
In that case navigate to /admin/config/regional/language, click on Edit and modify the name of the language.

Hope that helps. Let me know if something does not work.

Konstantinos

5

Thanks a lot Konstantinos! This should work, and we’ll give it a try with the CERN Override theme.

I guess there is also an option to clone the language “Norwegian Bokmål” and to change the code in order to keep the CERN theme. But that may have other side effects.

Cheers, Nils

6

I followed the steps above, but I see not effect on my language switcher. I’m using Brazilian Portuguese and renamed “PT-BR” to simply “BR” at /admin/config/regional/language and this change doesn’t appear in the switcher either.