(For more resources on Drupal, see here.)

Getting up and running

Before we get started, we obviously need a Drupal 7 website to work on. This section gives you two options, namely, roll your own or install the demo.

Using your own site

You can use your own Drupal 7 site. It can be an existing site or one you create from scratch. If you are creating a brand new site and weren’t planning on using a particular installation profile, you can get a head start by using the Localized Drupal Distribution install profile at drupal.org/project/l10n_install.

It is probably obvious, but it’s best to run the site on a development machine and not in a production environment. Once all the basic Drupal core modules are configured, you will also want to set up the following additional modules to get the most out of the exercises:

• Panels: A tool for creating pages with custom layouts
• Path auto: Settings for creating path aliases automatically
• Views: A tool for creating custom pages and blocks

Using the demo site

If you’d prefer a jump-start, a full demo website can be created using a special install profile.

Instructions for downloading and installing the demo website are included on the Drupal project page available at drupal.org/project/multilingual_book_demo. The demo site contains additional modules including the modules listed previously as well as the following:

• Administration Menu: Toolbar for quick access to the site configuration
• Views Bulk Operations: Extra functionality for Views forms
• Views Slideshow: Slideshows of content coming from Views

These modules provide us with a starting point. As more modules are needed for particular exercises, they will be listed so you can add them.

Roles, users, and permissions

Although you might already have multiple users on your test site, for simplicity it will be assumed that you are logged in as the super admin (user ID 1).

Working with languages

If we want a multilingual site, the logical first step is to add more languages! In this section, we will add languages to our site, configure how our languages are detected, and set up ways to go between these languages.

Adding languages with the Locale module

Drupal has language support built into the core, but it’s not fully turned on by default. If you go to your site right now and navigate to Configuration | Regional and language, you will see the Regional settings and Date and time comfit page s for configuring default country, time zone, and date/time formats:

1. To get our languages hooked in, let’s enable the core module, Locale. Now go back to Configuration | Regional and language to see more options:

   

2. Click on Languages and you’ll see we only have English in our list so far:

   

3. Now let’s add a language by clicking on the Add language link. You can add a predefined language such as German or you can create a custom language.
4. For our purposes, we will work with predefined languages. So choose a language and click on the Add language button.

   

   Drupal will then redirect you to the main language admin page and your new language will be added to the list.

5. Now you can simply repeat the process for each language. In my case, I’ve added three new languages, namely, Arabic, German, and Polish:

   

   The overview table shows the language’s name (English and native), its code, and its directionality. The language’s direction can be Left to right (LTR) or Right to left (RTL), with most languages using the former. ‘Right to left’ just means that you start at the right side of the page and move towards the left side when you are writing. RTL languages include Arabic, Hebrew, and Syriac, which are written in their own alphabets.
   You can choose which languages to enable, order them, and set the site default. Links are provided to edit and delete each language. English only has an edit link since it is the system language and cannot be deleted, but English can be disabled if you use a non-English default. If we edit a language, we can modify all the information from the overview table except for the language’s code since we need that as a consistent reference string.

   Do not change the default language once you have started translating or translations might break.
   Install String Translation from the Internationalization package (drupal.org/project/i18n), go to Configuration | Regional and language | Multilingual settings | Strings, select the Source language, and click on Save configuration. Do not change this setting once it’s configured.

Detecting languages

We have our languages, so now what? If you click around your site, nothing looks different. That’s because we are looking at the English version of the site and we haven’t told Drupal how we want to deal with the other languages. We’ll do that now.

Navigate to Configuration | Regional and language | Languages | Detection and selection and you’ll see we have a number of choices available to us:

The Default detection method is enabled for us, but we can also enable the URL, Session, User, and Browser options. If you want a cookie-based option, check out the Language Cookie and Locale Cookie modules. Let’s go over the core options in more detail.

URL

If you enable this method, users can navigate to URLs such as example.com/de/ news or example.com/deutsch/news (when using the path prefix option) and example.de/news, deutschexample.com/news, or deutsch.example.com/news (when using the domain option). Configuring domains requires web server changes, but using path prefixes does not. This is a common configuration for multilingual sites, and one we’ll use shortly.

The language’s path prefix can be changed when editing the language. If you want to use path-prefixed URLs, then you should decide on your path prefixes before translating content as changing path prefixes might break links (unless you set up proper redirects). If desired, you can choose one language that does not have any path prefix. This is common for the site’s default language. For example, if German is the default language and no path prefix is used, the news page would be accessed as example.com/news whereas other languages would be accessed using a path prefix (for example, example.com/en/news).

Session

The Session option is available if you want to store a user’s language preference inside their user session. It was actually proposed by some Drupal community members that this method be removed from the set of choices as it caused a number of issues in other code.

One reason you may not want to use this option is due to the possible inconsistency between the content and the URL language. For example, you could enable both URL and Session methods and order them so that the Session method is first. If a user is at example.com/de and if the session is set to French, then the user will see French content even though the URL corresponds with German. My advice is to just skip this one, or, if you need it, at least make sure that it’s ordered below the URL option.

User

Once the Locale module is enabled, users can specify their preferred language when they edit their account profile. If you enable the User method in the detection settings, the user’s profile language will be checked when deciding what language to display. Note that the user profile language defaults to the site’s default language.

Browser

Users can configure their browsers to specify which languages they prefer. If the Browser method is enabled, Drupal will check the browser’s request to find out the language setting and use it for the language choice. This option may or may not be useful depending on your site audience.

Default

The default site language is configured on the Configuration | Regional and language | Languages settings page, and is used for the Default detection method. Although you can’t disable this method, you can reorder it if you choose. But, it makes the most sense to keep it at the bottom of the list to use it as the fallback language.

Detection method order

It is important to note that the detection method order is critical to how detection works. If you were to drag the Default method to the top of the list, then none of the other methods would be used and the site would only use the default language. Similarly, if you allow a user profile language and drag User to top of the list, then the URL method would not matter even if it’s enabled. Also, if URL detection is ordered below Session, User, and Browser options, the user might see a UI language that does not match up with the URL language, which could be confusing.

Make sure to think carefully about the order of these settings. If you use the URL method, it’s likely you will want it first. The Default method should be last. The other detection method positions depend on your preference.

When using path-prefixed URLs, if one language does not have a prefix, then detection for that language will work differently. For example, if the URL method is first, then no other detection methods will trigger for any URLs with no path prefix such as example.com/news or example.com/about-us.

Our choice

For our purposes, let’s stick with URL detection and use the path-prefix option as this is the easiest to configure (it doesn’t require extra domains). This choice will keep our URLs in sync with our interface language, which is also user and SEO-friendly.

1. Check Enabled for the URL method and press the Save settings button.
2. Now click on Configure for that method and you’ll see options for Path prefix and Domain. We’ll use the default option, that is Path prefix (for example, example.com/de).
   Don’t panic on the next step. You won’t see anything different in the UI until we finish our interface translation process later in the article.
3. Now change the URL in your browser to include the path prefix for one of your languages. In my case, I’ll try German and go to example.com/de. You should be able to use the path prefixes for each of your configured languages.

Switching between languages

Most likely you don’t want your users to have to manually type in a different URL to switch between languages. Drupal core provides a language switcher block that you can put somewhere convenient for your users.

To use the block, navigate to Structure | Blocks, find the Language switcher (User interface text) block, position it where you’d like, and save your block settings. The order of the languages in the block is based on the order configured at Configuration | Regional and language | Languages. Once enabled, the language switcher block looks like the following screenshot:

You can now easily switch between your site languages, and the language chosen is highlighted. The UI won’t look different when switching until we finish the next section. Two alternatives to the core language switcher block are provided by the Language Switcher and Language Switcher Drop-down modules. Also, if you want country flag icons added next to each language, you can install the Language Icons module.