Warm-Up

Today, English has become a global language and is one of the most popular languages ​​on the internet. A large number of websites are created that prioritize or pay attention to posting content in English. However, not everyone can read and understand English. Having websites that support multiple languages ​​opens up great opportunities to reach a wider audience, especially in the regions you’re looking to target. In fact, content administrators around the world have been doing this for years, and the demand for multilingual websites is increasing day by day. Fortunately, Joomla is one of the content management platforms that supports the most languages and is available in 75+. Therefore, building a multilingual website is also much easier with this platform.

If you were skeptical about the ease, I can ensure, starting a Joomla multilingual website is easier than you could imagine, simpler than it might sound. Let’s see!

So today, in this tutorial, I will show you how to create a multilingual website in Joomla 4. This way, you don’t have to use any third-party extensions, and of course, it’s completely free.

Now let’s go!

Step by step Setting up a Multilingual Website in Joomla 4

Follow along step by step to completely set up a multilingual website in Joomla 4.

Installing New Languages

In Joomla 4, there are two methods that you can use to install languages.

  • Install via Joomla Update

From the Home Dashboard, go to System, then under Install, click Languages to access the Extensions: Languages page.

Here, click the Install button on the languages you wish to install. You can install as many languages as you want.

Joomla 4 - Multilingual Website - Install Languages

For illustration purposes, in this article, I will install two additional languages: French and Chinese (Simplified).

Joomla 4 - Multilingual Website - Languages Installed

  • Install Manually

With this method, you first need to download language packages from Official Joomla! Language Packages.

Then, go to System > Install > Extensions, upload your ZIP packages and install your languages.

Now, navigate to System > Manage > Content Languages and enable (publish) your languages.

Joomla 4 - Multilingual Website - Enable Content Languages

* Notice: You can update/change language info by clicking on each language’s title and modifying its options, e.g. Titles, Title in Native Language, Language Tag, Image (Flag), Status, Description, etc. It’s a bit like a language profile that contains all the details Joomla needs to be able to use either the English or the French language as “switchable” content languages.

Joomla 4 - Multilingual Website - Edit Content Language

Enabling “System – Language” plugins

Now, we’ve completed installing new languages and published them for content. For the next step, we need to enable the language filter and language code plugins. This helps Joomla filter the content and show them based on the language you choose.

Navigate to System > Manage > Plugins, then search for “System – Language“.

Here, Joomla will display System – Language Code and System – Language Filter in the search result. Enable them both!

Joomla 4 - Multilingual Website - Search Plugins

You can also modify the plugin settings by clicking on its name, for example, System – Language Filter. This plugin enables the CMS to recognize the different languages installed and display only the content relevant to the current language.

* Notice:

  • This plugin filters the displayed content depending on the language.
  • This plugin is to be enabled only when the Language Switcher module is published.
  • If this plugin is activated, it is recommended to also publish the Administrator multilingual status mode.
  • Item Associations — Set to Yes. This option allows item associations when switching from one language to another.
  • Remove URL Language Code — This option removes the defined URL language code of the content language corresponding to the default site language when the SEF URLs feature is enabled/turned on.

Joomla 4 - Multilingual Website - System - Language Filter

Now that you’ve set up the language files properly and enabled Joomla’s built-in Language Filter. By default, this plugin will try to detect the language settings of the visitor’s browser and display the site in his language (if available).

Adding Multilingual Content

Now that you have multiple languages ready on your website. You can use them to generate multilingual content. But first, let’s create new categories and new articles.

  • Create a new category for each language
  • Create new articles in each language.

Add New Category

Let’s create separate categories for each language!

  • Go to Content > Categories > Add New
  • Give your new category a title
  • Select a language from the drop-down
  • Click Save & Close to complete
  • Repeat the same steps for other languages

Joomla 4 - Multilingual Website - Category FR

Joomla 4 - Multilingual Website - New Categories

Add New Articles

Next, let’s add new articles for each language to create different language content.

  • Go to Content > Articles > Add New
  • Provide a title for your new article
  • Choose a language for the article from the drop-down
  • Compose/update your content
  • Click Save & Close when you’re done
  • Repeat the same steps for your other languages

Joomla 4 - Multilingual Website - Article CN

Joomla 4 - Multilingual Website - New Articles

Creating Multilingual Menus

Now you need to assign categories and articles on the Joomla menu. It will allow them to display on the front end. To do that, create each menu for each of your languages.

From the Home Dashboard, navigate to Menus > Manage > Add New. Enter a Title, choose a Unique Name, then press Save & Close.

Joomla 4 - Multilingual Website - Main Menu FR

And repeat for the other languages:

Joomla 4 - Multilingual Website - Menu saved

Add Menu Items

The new menus which you’ve just created above are still empty. We need to go ahead and add new menu items for each of the menus.

  • Go to Menus > Main Menu (en-GB) and add new items
  • Select a Menu Item Type
  • Choose a category that corresponds to a specific language
  • Choose a language from the drop-down
  • Click Save & Close

Joomla 4 - Multilingual Website - Menu item CN

Repeat the above steps for the other languages:

Joomla 4 - Multilingual Website - Menu item saved

Right now, inside each main menu item, you need to set a default menu (e.g. Main Menu EN), for when you click on the Home menu item that will become the default Home item for English pages.

Add New Modules

In order to display a menu item on the website’s front-end, you must add a module for the menu item and indicate an exact position. Navigate to Menus > Manage, select a menu and assign it to a module, or go to Content > Site Modules to get started.

For detailed instructions on how to create a menu and then assign it to a module, please refer to this article.

  • Go to Content > Site Modules > Add New.
  • Under Select a Module Type, click Menu.
  • Give the new menu module a Title. (Required)
  • Select a language menu to assign to this module, e.g. Main Menu (en-GB).
  • Specify a module Position to feature it on your site.
  • Choose a language from the drop-down.
  • Click Save & Close to apply.

Joomla 4 - Multilingual Website - New Menu Module

Repeat the same steps for the other languages:

Joomla 4 - Multilingual Website - Module saved

Back in Menus > Manage, you can see all your menus that have been linked to the respective modules.

Joomla 4 - Multilingual Website - Linked Modules

Now, let’s move on to the next step!

Multilingual Associations

General speaking, this enables you to perform translating contents (articles, menus, etc.) from one language to another when you hit the language switcher. Make sure the Associations option is enabled by navigating to System > Manage > Extensions, search for “System – Language Filter” and check if the Item Associations option is toggled on (Yes).

Menu Associations

When adding a new menu item and assigning it a language, you can find the options for “Associations” in the “As Associations” tab that it will show. You can also select different menu items for different languages. The same goes for modules, articles, and other content items.

Joomla 4 - Multilingual Website - Menu item Associations

Click Save & Close when you’re done. Repeat for other menu items.

Joomla 4 - Multilingual Website - Menu item Associations Saved

Do the same for articles, categories, and other language contents.

Joomla 4 - Multilingual Website - Category Associations Saved

Joomla 4 - Multilingual Website - Article Associations Saved

Multilingual Associations

Navigate to Components > Multilingual Associations:

Joomla 4 - Multilingual Website - Multilingual Associations - FR

Here are some main options of the components:

  • Articles — You can select this filter to provide all the articles/categories of a language with associations.
  • Contacts — lists contacts for language associations.
  • Menus — With this option, you can associate languages for all your menu items.
  • News Feeds — Helps translate feeds if you’re using the Joomla newsfeed component

Setting Default Page for Each Language

Now we’re going to define the home page for each language. This is one of the most important steps that need to be done.

  • Navigate to Menus > Main Menu (en-GB)
  • Click on the star icon (Set as Home) to set it as the default
  • It will then be changed to the English (en-GB) flag to indicate that this is the default page for the Main Menu (en-GB) menu
  • Repeat for the other languages

Joomla 4 - Multilingual Website - Main Menu en-GB

As for the French, Chinese, or whatever language you have:

Joomla 4 - Multilingual Website - Main Menu fr-FR

Joomla 4 - Multilingual Website - Main Menu zh-CH

Duplicating Template

With the different languages you have installed on your website, there must be a specific template for each one of them. Simply duplicate your default template and name them accordingly for each language.

Create Template Style for Each Language

  • Go to System > Site Template Styles (under Templates)
  • Select your current default template style, then click the Duplicate button at the top
  • Rename the duplicated template for the EN language (for English language pages only)

Joomla 4 - Multilingual Website - Duplicate Template

Do the same for the fr-FR and zh-CN languages:

Joomla 4 - Multilingual Website - Duplicated Templates

Creating Language Switcher Module

Now comes the final step!

A language switcher is a mechanism that allows site visitors to switch between languages anytime they want. By creating a language switcher module, you are going to feature a useful way for the visitors to easily view the content in their desired language.

  • Navigate to Content > Site Modules.
  • Click the New button in the upper left.
  • Select Language Switcher as the module type.
  • Give your new module a title, e.g. Language Switcher
  • Assign a module position matching in with your template (choose from the drop-down)
  • Enable the Use Dropdown option if you want your language switcher as a drop-down menu.
  • Make sure to select All in the Language field on the right.
  • Finally, click Save & Close to save the switcher and make it ready for use.

Joomla 4 - Multilingual Website - Language Switcher

Okay, now it’s time to check the results on the front end.

Joomla 4 - Multilingual Website - Final Results

If you want to change the order in which languages are displayed in the Language Switcher, you can do so using the Content Languages Manager.

  • Navigate to System > Content Languages (under Manage)
  • Drag and drop each language to your desired position, one by one.
  • Review the changes on the front end. That’s it!

Joomla 4 - Multilingual Website - Language Order

Joomla 4 - Multilingual Website - Review on Front-end

Phew! You’ve successfully created a fully functional multilingual website in Joomla 4. Congrats!

Wrap-Up

So I just showed you a straightforward approach to building a multilingual website in Joomla 4. Hope you enjoyed the article. Don’t hesitate to leave us your comments should you have any questions. Besides, check out our awesome Joomla 4 templates to get your own responsive, high-performance, and SEO-optimized websites. Thanks for reading, and stay tuned for future how-tos!

5/5 - (2 votes)
Latest posts by LT Digital Team (Content & Marketing) (see all)
Flash Sale! Get 25% Off On All Purchases on Today. Coupon code: FLASHSALE25 Check it out!
Black Friday & Cyber Monday deal Get 50% Off On All Purchases, don't miss this huge sale! Coupon code: BFCM50 Check it out!