Creating a multilingual website can significantly expand your reach and cater to a global audience. Using the WPML plugin to translate your Theme Builder templates in Divi ensures a seamless and professional presentation across all languages.
In this article, we will guide you through the process of using the WPML plugin to translate your Divi Theme Builder templates.
Using WPML, you can translate the Theme Builder Layout to multiple languages. The WPML plugin can be downloaded from https://wpml.org/.
Setting up WPML
If you're setting up WPML for the first time, please refer to our guide on creating multilingual websites using Divi or Extra and WPML.
This guide walks you through installing the necessary plugins, setting up your site's languages, and choosing who will translate your site.
We recommend using WPML's Advanced Translation Editor if you translate the site yourself or use local translators. It includes many great tools, such as automatic translation, translation memory, a spell checker, and more.
Enable the Advanced Translation Editor
Go to WordPress Dashboard → WPML → Settings
Under the How to translate posts and pages section, choose Use WPML's Advanced Translation Editor for New content.
Translating Theme Builder Layouts
Once you have WPML set up and your languages and translators chosen, translating theme builder layouts is pretty straightforward.
The process is the same whether you have created a header, footer, or body layout.
When creating your layouts, we recommend giving them descriptive titles so you can easily recognize which Layout you want to translate later.
Open any of the Template parts (Header, Body, or Footer)
Expand the Visual Builder Tool Bar by clicking on the Elipse icon
Click on the Gear icon
In the Content Tab → Title, type a descriptive title.
In the following example, we will translate a Footer Template to demonstrate the translation process.
Translate the Footer Template
To translate the Footer Template, follow the steps below:
Go to WPML →Translation Management.
From the Element type drop-down menu, choose Footer Layout and click the Filter button.
Find the footer you want to translate.
Select the Language (s) to which you want to translate the Footer Layout
Click Translate selected content.
Go to WPML → Translations to take and translate the Footer layout by clicking the Translate button.
Add your translations or click the Translate automatically button to fill in the translations instantly using WPML's automatic translation feature.
Review the translations to ensure accuracy
Click the Green Checkmark button to confirm.
Click the Complete button to publish the translation.
Note: The translated footer will be displayed anywhere you assign the Layout.
Different Footer Layout on the Second Language
If you also want to make changes to the Footer layout, which was just translated, without affecting the Footer content and Layout of the original Language, follow these steps:
On the Frontend, switch to the Second Language
Activate the Visual Builder from the top of WordPress's Admin bar.
Once the Visual Builder is loaded, click on the Footer Layout and make the changes.
Have a look at this video to see how to use the second Language to make changes to the Footer Layout.
Not only is the content already translated, but we can also make changes to the design without affecting the original Footer Language - which was set for English in this case.
You can make styling and content changes, as you would normally do, without affecting the English Footer Layout.