A multilingual website will introduce your business to markets you didn’t even know you could access. And considering the fact that many of the internet users are not native English speakers, you might want to convert your site into multilingual. Making your Joomla site multilingual is no rocket science. You can refer to our article if you want to see a step by step tutorial to create a multilingual Joomla site.
Today, we are going to do the same but using our very own Helix Ultimate. This detailed tutorial is going to be a step by step process, so try to follow carefully to avoid making a mess. Let’s get started, shall we?
Step 1: Install New Languages
In this tutorial, we will use English as the default language. And French & Arabic as the secondary languages to make our Joomla website multilingual. First, we need to install our preferred languages. Let’s see how to do that.
From the Joomla administrator control panel, go to Extensions > Languages
Click on the Install Languages button.
A list of languages will appear. Search and find your desired language, and install. The system will show the message “Installation of the package was successful” upon the language installation.
Step 2: Publish Content Language
In this step, we will create language profiles for the site contents. Go to Extension > Languages > Content Languages.
Select the newly installed languages and publish them.
Step 3: Assigning Language-specific Pages
Once you have installed and published your desired languages, it is time to create copies of the web pages. In our case, we are going to demonstrate using the Home page. From the dashboard go to SP Page Builder > Click on the Home page > Save > Save as Copy.
Create a copy of the Home page for each of the languages you have installed. Once you have created the copies, it’s time to edit the pages and assign them a language.
Let’s see how to do that for the French language.
Click on the Home (2) page to edit. Set the title to ‘Home- FR’.
Then, go to Options > Publishing > Language > Select French (Franch). Click Apply to save the changes.
Repeat the process for the other languages.
Step 4: Add New Menus for Multilingual Pages
Now we’ll create menus for each of the languages. For English contents and another menu for French contents. For our tutorial, we will create separate menus for English, French, and Arabic. Let’s have a look at an example.
Go to Menus > Manage > Add New Menu.
Title: Home - FR
Menu Type: Home - fr
Click on Save & Close. Repeat the process for the other languages as well.
Step 5: Create Menu Items for the Newly Created Menus
Once you have created the menus, it’s time to add menu items to our menus.
Navigate to Menus > Home - FR > Add New Menu Item.
Let’s see how to do that for the Home - FR menu.
- Menu Title: Home
- Menu Item Type: Select SP Page Builder > Page
- Select Page: Select Home - French
- Menu*: Home - FR
- Language: French (France)
Click Save & Close.
Tap on the star sign button for the language flag to appear. Follow the above method to create menu items for the other menus.
Step 6: Duplicate Template Styles
With each language, we need to assign the Helix Ultimate template to its content. To do that, we have to create duplicates of our Helix Ultimate template so that we get the same look and feel for each of our multilingual pages. This is pretty simple to do and will only take a minute.
Navigate to Extensions > Templates > Styles. Select shaper_helixultimate - Default and click on the Duplicate tab on the top.
Let’s see an example.
Click on the shaper_helixultimate - Default (2)
Style Name: shaper_helixultimate - FR
Default: French (France)
Save and go to Template Options > Navigation > Select > Home - FR
Repeat the process for as many languages you have selected to make your Joomla site multilingual. In our tutorial, we have selected English, Arabic, and French, so we had to create 3 duplicates of the original template. So that means, you now have shaper_helixultimate - Default (original), shaper_helixultimate - EN, shaper_helixultimate - AR, shaper_helixultimate - FR.
Step 7: Enable Language Filter Plugin
Now we need to enable the Language Filter plugin in Joomla. This built-in plugin will help Joomla to filter the contents according to the language we choose.
Go to Extensions > Plugins. Search for “System - Language”.
Language Filter and Language Code plugins will be displayed in the search result. Enable the Language Filter plugin.
Step 8: Add the Language Switcher Module
So far, we have three sets of Home pages and menus. Now we need a mechanism to switch between them. For example, while a visitor is on an English page, he/she needs a switcher to visit the French version of the current page.
To add the language switcher, go to Extensions > Modules, click ‘New’ and select the ‘Language Switcher’ module.
Then, set the Title to ‘Language Switcher’, Position to ‘Top 2 [top 2]’, and Show Title to hide.
Let’s see the changes on the frontend.
Wrapping Up
Congratulations! You now have a fully functional multilingual Joomla website. We hope this article will remove any confusion that you previously had on creating a multilingual site using Helix Ultimate.
If you want to make your articles multilingual, you need to make an association between two counterpart articles. This will let Joomla change the content accordingly when you switch the article. To know more about this, you can refer to our article on how to use the multilingual association feature.
Feel free to share your experience and feedback on the comments section. Good luck!
Download Helix UltimateBrowse All Joomla Templates