Multi-Language Websites

Thank you for your contribution: 

Lived multilingualism - 2010-03-30I live in Europe. The European Union has 23 official languages. If you are going to create websites in regions like this, you have to think about multilingualism. Two things are especially challenging when it comes to creating multi-language websites: the translation of the static Joomla! text strings as well as the translation of the content items. While the first challenge can normally be overcome easily, the second one presents the real challenge. 

The Joomla! 1.7 core is available in more than 40 languages languages and more languages are expected to come soon.

Let's build a multi-language website by using Joomla! 1.7 core in this chapter.

Joomla! language packages

You can download the translation packages from Joomla Code (TO DO 1.7 LINK) or the Joomla! extension directory und install them using the extension manager. I have done this with the German as well as the French language package. After installation you will find the three installed languages (Figure 1) by visiting Extensions - Language Manager in the backend.

cocoate.com/node/6415Installed languages

Figure 1: Installed languages

Language Configuration

As of now, it is still necessary to have a look at the language configuration to see whether the languages are published (Extension Language Manager Installed) and the language content attributes are correct (Figure 2). Have a look at (Extension Language Manager Content). If there is no content item for the installed language, create one by clicking the new icon. This is what happened to me after I had installed the French language package.

cocoate.com/node/6415Language attributes

Figure 2: Edit content language

Language Filter plugin

For Joomla! to be able to distinguish between the different languages, the System Language Filter plug-in (Extensions Plug-Ins) has to be activated. You are able to configure the language to be shown to the visitor, whether it is the language version of your website or the client's browser setting, by simply using the Options settings. Another configuration setting is the Automatic Language Change. If enabled, the content language will automatically be changed to the frontend language settings.

Every user can configure his frontend language once he is logged in in the frontend. Most of the time, there is a user menu that, depending on your rights, provides you with different menu items. In this user menu, you will also find the Your profile link. By clicking on the link, you will then be able to view and edit your profile data. In the profile edit form under Basic Settings, users can choose among other configurations and set their frontend language (Figure 1). You may use the default website language or one of the available content languages. Depending on these settings, the language plug-in will allow you to view the website in the corresponding language.

cocoate.com/node/6415Front-end language

Figure 3: User profile - Basic Settings

Language Switcher module

By activating the Language Switcher module, you have the possibility to switch between languages in the frontend, regardless of whether you are a visitor or a logged in user. In Basic Settings you can add text and choose whether you would like the languages to be displayed with the language name or the flag icon. I am sure some third party templates will provide special templates positions for this module in the near future. In the default template Beez2, position-7 works well in combination with the flags.

cocoate.com/node/6415Language switcher

Figure 4: Language Switcher

Multi-language content items

As I have previously mentioned, each content item, such as an article, can be assigned to a language. The difficulty now lies in creating all these content items in all source and target languages (Figure 5). You can create content items in any language but, unfortunately, Joomla! 1.6 does not yet offer a translating workflow, which means that you have to pay attention to avoid mistakes.

cocoate.com/node/6415Language field

Figure 5: Language field

A multi-language website

My example website consists of

  • a front page with articles,
  • a blog,
  • an 'About Us' page,
  • a contact form.

All content items have to be available in different languages (Figure 6).

cocoate.com/node/6415Multi-language website

Figure 6: Example website

Front page

To make it easier for you to start I created a screencast

I create a few articles for each language with the attribute featured (see chapter A typical article).

I create a menu called default with a menu item called default, which links to Featured Articles. I configure this menu item as Home by clicking the Home icon. The menu default needs no corresponding module, it should simply exist (This behaviour is in the actual version of Joomla! 1.7 and will hopefully be changed in the upcoming updates).
Afterwards I create a menu per language and the corresponding menu module. I create a menu item for each language : Home, Startseite, Accueil. These menu links have to be configured as Home by clicking the Home icon. If you see the flag beside the menu item, everything works fine, if not ... watch the screencast :)

Menüs zur MehrsprachigkeitMenüs zur Mehrsprachigkeit

Figure 7: A frontpage for each language

A blog

In my case I already have a blog at cocoate.com, so I use the newsfeeds component for displaying the external blog entries. I create a feed item for each language and the corresponding menu items (see chapter Newsfeeds).

An 'About Us' page

I create an 'About Us' page as described in chapter How to create an 'about us' page for every language.

A contact form

I use a single contact form for genaral inquiries. I only need one contact item, so it is not necessary to assign a language. Only if contact data differs in different languages, e.g., different address or email, will it be necessary to create one contact item for each language.

Login form

On each page a login form will be visible. I have copied the English login module twice, configured the menu assigment, changed the title and assigned the correct language. Now it is possible to login and register at my site.

User menu

I used the existing user menu, which provides you with a link to your profile as well as for creating an article or weblinks. (Figure 8).

cocoate.com/node/6415Article frontend editing

Figure 8: Front-end editing

As you can see, creating a multi-language website with core Joomla! 1.7 is quite simple!

[UPDATE 2011-11-14]

New version Joomla! 1.7.3

http://community.joomla.org/blogs/commun...