How to create a multilingual website in Joomla 4 - comprehensive steps

1. Installing languages: Install the languages you want to use in your Joomla multilingual website.
2. Enable language plugins: Enable language plugins to enable the language associations.
3. Add multilingual content: Add category, articles, and module for each language.
4. Set up multilingual menus: Create menu items for each language.
5. Set default home pages for each language.
6. Set up and manage the multilingual associations:
7. Create template style for each language along with its menu
8. Create the language switcher module to show language Names/Flags switcher on the website.

1. Install languages

There are two options to install languages on a Joomla website:

1. Install via Live server using Joomla updates

Login to Joomla admin panel > System > Install > Languages > Install language. Install the language you want by clicking on the install button. You can install any no. of languages offered by Joomla language packages to make a multilingual website.

Manual Installation

You can install a language package manually on your Joomla site. Access the Joomla community translation packages to download.

Once a package is downloaded in zip format, you can install it via Joomla > extension > Install > Choose the package and install it.

Enable Content language

Go to System > Manage > Languages > content languages > select the language you installed and enable it.

You can also customize the language code via content language options and customize language flags.

2. Enable language plugins

System Language Filter plugin helps you show the content based on the language selection on the website. This plugin must be enabled.

System language code plugin helps you hide the language code in the HTML code of the website, it plays an important role in SEO. Here are the steps to enable these 2 plugins:

• Go to System > Manage > Plugins
• Search for the Language in the search bar to find plugins.
• Enable 2 plugins: System - Language Filter and System - Language Code.

3. Multilingual content

Once the language plugins are enabled, you can start adding new content for each language. As an example, we added Italian and French language for the demo website in this tutorial.

The most popular content items in a websites are:

1. Joomla Categories: to structure the content of the site better
2. Joomla Articles: the main content component for your website
3. Joomla Modules

Add new categories

To create different language content we have to add a new category for each language.

1. Go to Content > Categories > Add a new Category.
2. Select the language for the category from Language > dropdown.
3. Save category
   

   

4. Repeat this process for the 2nd language(English/Arabic)

Add new Articles

To create different language article content we have to add a new article for each language.

1. Go to Content > Articles > Add new Article.
2. Select the language for the article from Language > dropdown.
3. Update content for the article, then save the setting
   

   

4. Repeat this process for the 2nd language (English/French/Italy)

Add new modules

On a multi language website, you can show different modules for each language based on the language content the module is assigned to. This step you can do later after you got the menu/navigation set up.

4. Set up menu system for a multilingual website

In a multilingual site, you need to create different Menus for each language for better control and easier to set up good navigation for your website. Here are the steps:

Navigate to Menu > Manage > Add New menu ( for example Main menu EN). Do the same for the 2nd and 3rd languages.

Add menu items for language

Once the Menu is created for each language, add new menu items for each main menu.

• Open Main Menu EN >> Add New Menu Item.
• Select language from dropdown > and save.
• Do the same for the 2nd and 3rd languages.

Set a default Menu in each Main menu item for example in Main menu EN when you click on the Home menu item as default it will become the default Home item for English language pages.

5. Multilingual Associations

Multilingual Associations are used to redirect one language articles or menu to another language when you click on the language switcher flag.

1. Menu association via Menu item:

When you add a menu item, assign a language for the menu item, it will show the options for Associations that you can find in the tab As Associations. You can choose the menu item of the 2nd language. The same option for other Joomla content items: articles, modules.

2. Multilingual Associations

The Multilingual Associations Component is a tool that enables editing associated items side-by-side without the need to go back and forth, for example, create the item in several languages and then associate them. The side-by-side view is the backend screen where you can edit items after selecting a reference item.

To navigate this component navigate > Components > Multilingual Associations.

The main options of the component are:

• Articles: You can select this filter to give all lists of articles/categories of a language do association.
• Contacts: This option will list the contact items for language association.
• Menu items: Using this option you can do language associations for all menu items on your website.
• Newsfeeds: Helps to do newsfeeds translation if you are using the newsfeeds component in Joomla.

6. Set default page for each language

Default page is the home page for each language. Open the Main Menu EN > click on the Star icon to set the menu item as default. The language default menu will appear as default page when the user visits the site (homepage).

Do the same for other language.

7. Template style settings

In this section, we will set up the template style for each language. It will help to set different Megamenu for each language.

Create template style for each language

Navigate to System > Site template Style

Select your template default style > click > duplicate

Open the duplicated template style, rename it for default EN (to use this template style only of English language)

Create navigation profile for each language

Open Navigation tab, click Clone icon to make a copy of the default navigation profile (example: name the clone setting Menu EN).

Select the Clone settings (Menu EN) > save settings.

Open Navigation settings > click Edit icon > Select Mega menu > Main Menu EN (in example screenshot its Section Menu).

Save the setting.

Next, go to the Menu assignment Tab > Select only English language menu items and save.

Repeat the steps for another language.

8. Language switcher module

This language switcher module displays a list of available Content Languages (as defined and published in the Language Manager Content tab) for switching between them when you want to use Joomla! as a multilingual site.

Go to Content > Site Modules, create a new module, and select the Language Switcher module.

Once the module is published you can visit the front-end and change the language accordingy.