2.8 Demonstrate ability to build multilingual websites using core multilingual capabilities

Review how to start a site with a new default language. Review how to configure multilingual entities. Review Twig multilingual manipulation.

Configure a default language on site install

To setup a new site default language on site install chose the language on /core/install.php

Or from the terminal use drush.

drush si --locale=es

Read drushcommands.com to find out more about drush site install commands and arguments.

An example of a basic multilingual site install with standard installation.

There are four modules that make up the multilingual support as a part of Drupal 8 core.

Once logged in, navigate to admin/modules and scroll till you see the module group, Multilingual.

Add a new language

To add a new language to a site, navigate to /admin/config/regional/language. In the screenshot below Spanish was added as a new supported language. Drupal now supports over 94 languages.

Detection and selection

Define how to decide which language is used to display page elements (primarily text provided by modules, such as field labels and help text). The order in which detection method is used depends on the ordering of each detection method. The URL path is high on the default setup for commonly separated nodes that have the language in the URL path, for example, example.com/es/node1. Another use is language based on browser detection.

Configure translatable entities

Navigate to /admin/config/regional/content-language to choose which entities to translate. Fields can also be enabled or disabled to be translated depending on site's preferences.

Translate a node

Once the content type "article" was configured for translation a new tab appears in the local actions menu.

Click to add a new translation.

Although this node is translated, someone still needs to translate the content.

Twig Manipulation for multi-language

Twig comes with filters to translate the value inside of the twig templates.

There is the `

twig tag as well as the |t` filter. Strings are only translated once you visit a page using that language.

If we look at the core example core/themes/stable/templates/content/node.html.twig

you can see by default the author_name variable is already configured to be translatable. ```

full example of `core/themes/stable/templates/content/node.html.twig`:
```twig
{#
/**
* @file
* Theme override to display a node.
*
* Available variables: ----
#}
<article{{ attributes }}>
{{ title_prefix }}
{% if not page %}
<h2{{ title_attributes }}>
<a href="{{ url }}" rel="bookmark">{{ label }}</a>
</h2>
{% endif %}
{{ title_suffix }}
{% if display_submitted %}
<footer>
{{ author_picture }}
<div{{ author_attributes }}>
{% trans %}Submitted by {{ author_name }} on {{ date }}{% endtrans %}
{{ metadata }}
</div>
</footer>
{% endif %}
<div{{ content_attributes }}>
{{ content }}
</div>
</article>

Other Resources