During the last few posts on how to translate Joomla, you have seen how to translate articles and menus.
In this tutorial, you're going to take that a step further. You will learn how to translate a whole area of your site.
You're going to make a blog page for both your English and your French visitors.
Creating a blog is going to involve creating categories, articles and menu links, in both English and French.
You will also associate them together using the techniques learned in the previous blog posts. In addition to this, you'll add one extra piece.
You are going to create a "Latest News" module so people can see the latest blog posts that you added to the site.
Let's go through that process. By the time you are finished, you will have a much clearer understanding of the big picture that is involved in building a multilingual site.
Creating Multilingual Joomla Categories
Your first step in creating a multilingual blog is to translate categories. This is the process you are going to use for categories:
- You'll make an English category.
- You'll make a French category.
- You'll associate the two categories together.
Let's see how that process works:
- Go to the admin area of your Joomla site.
- Go to "Content", and then "Categories":
- Click "New":
- Title: Blog (en). As we explained earlier in this blog, it's not essential to put (en) in here. But for the purpose of this tutorial, using this tag will make it easier to identify the different languages.
- Language: English (en-GB).
- Click on "Save & New":
Now you're going to make the French version:
- Title: Blog (fr)
- Language: French (FR)
- Click on "Save". You don't want to close and exit the category screen yet.
- When the save has been processed, click on the "Associations" tab:
- You're going to link the two new categories. Click "Select a Category" and choose "Blog (en)":
- Click "Save & Close":
- You should now see that the two articles have the correct flags:
Creating Multilingual Joomla Articles
Your next step is to put some articles inside those two multilingual categories. You are going to use a very similar process to the one you used for categories:
- You'll make an English article.
- You'll make a French article.
- You'll associate the two articles together.
Let's start the article creation process:
- Go to "Content", and then "Articles":
- Click on the "New" button:
- Title: Blog article 1
- Content: You can generate it at https://lipsum.com/.
- Category: Blog (en) (en-GB)
- Language: English (en-GB)
- Click on "Save & New":
Let's repeat that creation process for the French version of the article.
- Title: Blog article 1 (fr)
- Content: This text is taken from https://lipsum.com. I used the second paragraph of their dummy text so that it looks different from the English content.
- Category: Blog (fr) (fr-FR)
- Language: French (FR)
- Click on the "Save" button to confirm your changes without leaving the screen:
- Click on the "Associations" tab so you can link the French version of the article to the English version:
- Click "Save & Close" to confirm your changes:
There you go. The two articles that you just created are linked together.
Let's do the whole process of creating the articles and associate them together one more time.
When you do that, you will have two blog articles in each category of your blog, and they will be linked (associated) together, which clearly can be seen in the Article manager of the Joomla admin area.
Using the instructions provided earlier in this blog post, see if you can create a second English and French blog post. Your Articles screen will look like this:
Creating Multilingual Joomla Menus
The next step in this process is to make the blog posts visible on the front end of your site.
You are going to make a link so the people can see either the multiple English articles in their category or they can see the multiple French articles in their respective category.
By now, the process should start to feel familiar:
- You'll make an English menu link.
- You'll make a French menu link.
- You'll associate the two menu links together.
Let's see how that process works on our site:
- Go to "Menus", "Main menu (en-GB)" and then click on "Add New Menu Item":
- Menu Title: Blog (en)
- Menu Item Type: Choose "Articles" and then "Category Blog":
- Language: English (en-GB)
- For the category, you'll choose the "Blog (en)" category that you created earlier in this blog post:
- When you have done that, click on "Save & Close":
- In the "Menu Items" manager, you should be able to see the new menu item that you have just created:
- Let us switch to the French menu. Choose "Main menu (fr-FR)" using the menu selection drop-down box:
- Click on "New":
- Menu Title: Blog (fr)
- Set the Menu Item Type to "Category blog", as you did for the English menu item:
- For category, you'll choose "Blog (fr)":
- On the right-hand side, choose "French" as the language for this menu item:
- Click "Save" to confirm your changes:
- Now you can associate the menu item with its English counterpart. Click on the "Associations" tab, and you should be able to choose the English menu item by clicking on the "Select" button:
- Click on the "Save & Close" button:
- You can now check if your work is effective on the front end of your site. Reload the home page of the site, and you should see the newly created menu item called "Blog (en)" that appears in the main menu.
- Click on "Blog (en)", and you will see your articles that you created earlier in the process.
- Click on the French flag, and you will see the French menu with "Blog (fr)" included:
- You will also see the articles in French that you created earlier:
Creating Multilingual Joomla Modules
Now, let's complete the process of translating these categories, articles and menu links by placing a module on the right-hand side of your site.
You are going to make a module which showcases the latest articles in both the English and the French category.
- Go back to the Joomla admin area.
- Go to "Extensions" and then "Modules":
- By default, there isn't any kind of Latest Articles module. Let's click on "New" to create the module:
- Choose "Articles - Latest":
- Set the title of this module to "Blog Posts":
- Instead of showing "All categories", select only the Blog (en) (en-GB) category:
- On the right-hand side, set the language to English (en-GB):
- Choose the position for the module: "position-7" works well for the default Joomla template:
- Click on the "Save & Close" button:
Repeat that process and create one more module to show the blog posts from the "Blog (fr)" category.
- Click on "New".
- Select "Article - Latest".
- Set the title of the module to Publications du blog:
- Choose Blog (fr) (fr-FR):
- Set the language of the module to French (FR):
- Choose the position of the module and set it to the "position-7":
- Click on the "Save" button.
- You will notice with modules that there isn't actually an Association tab. You can associate categories, articles, menu links and many other things, but modules are an exception. Fortunately, this should still work effectively. Let's take a look.
- Go to the front of your site. On the right-hand side of the site, you will see your new module with the list of only the English blog posts:
- If you click on the French flag, you will see that the title and the content of your module have updated to be in French:
Congratulations! You have set up a complete blog in Joomla, using categories, articles, menus and modules.
What you have seen in this blog post is the big picture process of building a multilingual Joomla blog:
- Create the categories, and associate them.
- Create the articles, and associate them.
- Create the menu links, and associate them.
- Create the modules.
What's Next?
Now that you know how to translate Joomla content, you're going to move on to extensions.
Over the next few blog posts, you'll learn how to translate the core Joomla extensions, plus any non-core extensions you want to use.
Additional Reading
- Introduction to Joomla Multilingual Sites
- 3 Different Approaches to Multilingual Joomla Sites
- Installing a New Multilingual Joomla Site
- What are Multilingual Associations in Joomla?
- Beginners Guide to Translating Joomla's Menus
- How to Create a Multi-Lingual Sitemap with OSMap
Do you want to learn more about Multilingual Joomla? Join the Joomlashack Everything Club and instantly download the "Multilingual Joomla Explained" book by Igor Muhaljko and Steve Burge.