Does your website talk the talk?

Core Features, Extra Modules, and Setup Tips for Multilingual Drupal Websites

Jul 29 2021

The diversity of the world’s languages is beautiful. Does your website “speak” only one? It’s time to change this and start reaching out to larger audiences. A multilingual website will enable you to send a convincing message to prospective customers in their native language. According to the famous saying by Nelson Mandela, if you talk to someone in a language they understand, that goes to their head, but if you talk to someone in their own language, that goes to their heart.

During the pandemic and post-pandemic times, it is especially important to gain a competitive edge in the global market. In the circumstances when physical presence is limited, you can be there for an across-the-globe audience and prove that no distances really matter when a business is properly represented online. More and more people browse the web to find products and services, so you have a chance to find a common language with them and work towards turning them into loyal customers.

International presence is not the only reason for going multilingual. Many organizations have a legislated requirement or market-driven need to support multiple specific languages on their website. This may be required internationally or within your country or region. 

To fully embrace the benefits of a multilingual website, you can either build one from scratch or enrich your existing one with multilingual features. Luckily, there is a website platform with a special focus on multilingual options. The setup is fast and easy, and the choice of functionalities is great. So what’s the best CMS for a multilingual website? We think it’s Drupal — and we are going to prove it right now.

Multilingual Drupal website example: Croatia Tourism
Multilingual Drupal website example: Croatia Tourism

 

Why Drupal is best for multilingual websites

Drupal is an enterprise-level CMS with very strong multilingual capabilities. It is super easy to add linguistic diversity to your website, with every technical aspect well considered. Moreover, there are many interesting community-contributed modules in Drupal in the multilingual sphere that can add even more value to websites and implement specific ideas. Let’s take a look at both the built-in and add-on options that Drupal has got for multilingual sites.

1. Out-of-the-box multilingual features in Drupal 8/9

Drupal’s multilingual “revolution” came in 2015 when its version 8 was released. The Drupal core was enriched with a package of multilingual modules that were previously community modules, and which can be enabled on any website. They include:

  • Configuration translation
  • Content translation
  • Interface translation
  • Language

These modules take care of every detail of the multilingual setup. Here are the key functionalities they bring to Drupal 8/9 websites.

The ease of adding multiple languages

You can add as many languages as you need in a few clicks. Any of them can be your website’s default one, which can be changed in the future if your priorities change. You have a huge choice of almost 100 languages that Drupal supports out-of-the-box, and any others can be added if needed.

Multilingual Drupal website example: American Academy of Periodontology Foundation (AAP)
Multilingual Drupal website example: American Academy of Periodontology Foundation (AAP):

 

Right-to-left support

Arabic, Hebrew, Persian/Farsi, Urdu, and other languages have a right-to-left (RTL) text direction. With RTL fully supported by the CMS, the challenge becomes focused on design for RTL languages.

Improved multibyte UTF-8 character support

In version 7.50, Drupal started to support the use of multibyte UTF-8 characters (emojis, Asian symbols, math symbols). Drupal 8 supports the utf8mb4 Character Set (4-Byte UTF-8 Unicode Encoding).

User interface translation (including ready-to-go translated UIs)

Drupal enables you to fully translate the user interfaces, but you will not have to do everything from scratch  — the Drupal community volunteers have already translated the bulk of admin UIs. The level of translation coverage is approaching 100% for many languages. All these translations are fully editable by you.

Ability to translate everything you need

You can translate every detail of your website’s interface, configuration, and, of course, content. Drupal enables you to configure on a field-by-field basis what needs to be translatable so you can decide to skip some universally understood fields — for example, user names, email addresses, etc. Configuration translation allows you to localize the dates in a specific country’s format, translate user roles, menus, and so much more.

Multilingual Drupal website example: ISO-CENTER
Multilingual Drupal website example: ISO-CENTER

Inline translation and content-managed translation (manual & automated)

Drupal enables you to quickly make translations inline and to provide content managers with the ability to add translations while they are creating content. Translations can be both manual and automated. The latter becomes available if you add a translation service to your Drupal website. Of course, you need to remember that automated translations will not be 100% accurate.  

Editor-friendly translation UIs

The translation interface for content editors is very user-friendly. As soon as the translatable content types and fields are defined, content editors are able to easily add and edit multilingual content via handy administration interfaces with a language selector.  

Configurable language switcher

To enable your website’s users to switch between the versions, you can add a basic list-type switcher in the form anywhere on your website as a simple Drupal block and customize its look and feel.

Language detection and selection

The methods used by the CMS to decide what language to display are completely configurable. For example, using a path prefix (/en versus /fr) or domain (en.domain.com versus fr.domain.com), using a language switcher - which works in combination with a cookie value to store a user’s preference, user account language preference, browser language, and even browser or IP address location, can be used to choose which content to show.

Multilingual Drupal website example: Peterzens Boathouse
Multilingual Drupal website example: Peterzens Boathouse  

 

2. Top contributed Drupal modules for more multilingual features

Layout Builder Asymmetric Translation

Localized websites often need to look different in other aspects, one of which is page layout. The Layout Builder Asymmetric Translation module enables you to choose different layouts and blocks for different languages as you create pages in Drupal’s core Layout Builder tool.

CKEditor BiDi Buttons

Here is a very helpful module for working with RTL languages in the text editor. The CKEditor BiDi Buttons module adds bi-directional text flow buttons to Drupal’s core CKEditor. They enabled content creators to change the text direction between the RTL (right-to-left) and LTR (left-to-right) options.

Dropdown Language

By installing the Dropdown Language module, you will be able to use a ready-to-go dropdown element for a language switcher on your multilingual website. It will replace Drupal’s default list-type switcher with no customization needed.

Dropdown language module
Screen shot of a Drupal 8 site using Dropdown Language module

Translate Drupal with GTranslate

If you want to entrust your website’s content translation to an automated tool, one of the options is to connect Google Translate to your website using the Translate Drupal with GTranslate module for Drupal. This provides translation of content on the CMS back-end, with translations saved within the CMS.

Hreflang

The Hreflang module will help you tell Google about the localized versions of your website. It will automatically add the <link rel="alternate" hreflang="x" /> tags to your pages so the right languages and URLs show up in search results. In Drupal 8 and 9, the core Content Translation module adds the tags to translated pages, while the Hreflang module does that for all pages. 

Language access

By installing the Language access module, you will be able to allow or restrict access to specific localizations using Drupal’s roles and permissions system. This can be useful in a variety of cases, for example, when the content in some of your website’s versions is not fully ready for the users to see.

Language Access Module
Installing the Language Access module

Language Cookie

It’s important to show just the right version of your multilingual website to particular users. The Language Cookie module can do this based on cookies. It adds the cookie method to the existing Drupal core’s language detection and selection methods that we are discussing in the “making your Drupal website multilingual” part.

Language Selection Page

If you do not want to enforce a default language on users based on URLs, cookies, or anything else, you can use the Language Selection Page module. It allows you to provide a landing page or splash page for your visitors asking them to choose in which version they want to proceed with your website. 

 

How to make a Drupal website multilingual

1. Enabling the modules 

Start with enabling all the four modules in the “Multilingual” section of the Drupal core. By default, they are disabled, so non-multilingual websites only use the functionalities they need and nothing extra. 

 enabling all the four multilingual modules
Ensure all four multilingual modules are enabled

2. Adding languages

Go to Configuration > Regional and Language > Languages and click “Add language.” 

Go to Configuration > Regional and Language > Languages and click “Add language

 

You will be presented with a dropdown list of supported languages. You can choose from almost 100, but if you need some others, there is also a “Custom language” option on the list. 

dropdown list of supported languages

After selecting the language, click “Add language” again and the process of uploading the available translations will begin automatically. With this completed, you will be redirected to the “Regional and Language” page with your default and the newly added languages listed. At any time, you can change your website’s main language by clicking the “Default” radio button next to the needed language and finally hitting “Save configuration.” 

Next to all added languages, there is the percentage of interface translation coverage. By clicking on this number, you will be able to view and edit the translation strings. 

view and edit the translation strings

 

3. Configuring language detection and selection

Next, you will need to configure which of the available versions on your multilingual website should be shown by default to a particular user. If you prefer not to offer a splash page asking users to choose their language directly (which would be available with the above described Language Selection Page contributed module), just rely on Drupal’s built-in methods of language negotiation. 

These methods can be selected and reordered according to your priorities at the Configuration > Regional and language > Languages > Detection and selection page. By default, only the URL is enabled, but you can also help your website “decide” which version to show to a user based on the account administration pages, session, browser, or user’s language preferences. Finally, you can just choose to show the site’s default language to everyone. 

Detection and selection

 

4. Configuring what’s translatable

Go to Configuration > Regional and Language > Content language and translation and carefully select what entity types (content, taxonomy, users, etc.) you want to be multilingual. Start selecting something and more options will unfold. 

For example, if you check “Content,” you will be immediately presented with content types, and after selecting a specific content type, you will see the list of its fields. 

There is also an option to set the default language for a specific content type and choose the most suitable language for content input from the backend interface. Finally, hit the “Save configuration” button at the bottom of the page.

Configuring what’s translatable

Content creators will then be able to see the language selector on the Create and Edit pages of the content types that have been made translatable. 

language selector on the Create and Edit pages

 

5. Adding a language switcher

In Structure > Block Layout, choose the region you want to place the language switcher in. For example, it could be the Header regions. Click “Place block” next to it and find the “Language switcher” on the list of available blocks. 

Adding a language switcher

 

Click “Place block” next to this specific block and you will be able to configure the switcher — change or hide its title, allow specific languages, restrict the switcher display by content type, role, or page. Click “Save block” and then again “Save blocks” on the Block layout page.

language switcher stage 2

 

In Summary

For organizations who are looking to make their website multilingual, Drupal offers all the above-described and plenty of other options. With customization added, the choice of multilingual features becomes truly unlimited — just like the opportunities that multilingual websites can give you. 

Interested in going multilingual? Contact our team to talk through the best solution for your organization.