WPML is a WordPress plugin known for its role in facilitating the creation of multilingual websites.
Coupling it with Bricks (@since 1.9.1) allows not only for the manual translation of posts, pages, and various content types into numerous languages but also offers automatic translation features, significantly broadening your website’s reach and accessibility.
Once you’ve established a page in your primary language with Bricks, WPML enables you to easily translate the content into any language you wish to add to your website, be it manually or automatically.
This documentation will guide you through the process of translating your Bricks website using WPML.
Setting up the environment
Before translating, set up your environment with the necessary plugins:
- Bricks setup:
- This guide will illustrate the translation process using a simple Bricks website. This website has main pages like Home and Blog, and templates including a header and an “All Archives” template, which has a template condition to apply to all archives and the blog page.
- WPML plugin installation:
- You can use the OTGS installer to install the required WPML Multilingual CMS and WPML String Translation plugins.
- Language Configuration:
- You can configure your website’s languages and other settings through the WPML setup wizard.
Translation options with WPML & Bricks
WPML offers different ways to translate your Bricks content:
- Advanced Translation Editor:
- Automatic (AI) Translation: Instantly translate your content using WPML’s AI-based engine, then optionally review it before publishing.
- Manual Translation: A method where each page & string is translated individually.
- String Translation:
- Translate theme/plugin strings, widget texts, and other interface strings found under WPML → String Translation.
- Edit with Bricks:
- If needed, post-translation modifications to design or layout can be done in the Bricks builder for each language.
For more in-depth information on each method, refer to the official WPML documentation.
Translating website content
Translate your website content using WPML and Bricks through the following steps:
Bulk translation via translation management
WPML can translate any content you build with Bricks, including pages, posts, and templates.
To translate any Bricks content, start by going to WPML → Translation Management. From here, expand the section with the content you want to translate and select your items.
Next, choose which languages to translate into, your translation method, and whether you’d like to review translations before publishing them.
To review translations, simply go to WPML → Translations and open your recent translation job. In most cases, your translations will be good to go, but you can always make changes using WPML’s Advanced Translation Editor.
Once you’re done reviewing, you can instantly publish your translations and display them on your website. Remember that you need to switch languages to view your translations.
Translating individual pages and posts
While Translation Management is perfect for translating multiple pages and templates in one go, you may sometimes want to focus on a single page or post—either for fine-tuning the translation or making additional adjustments. In those cases, you can use the WPML Advanced Translation Editor directly from the page/post edit screen.
For comprehensive guidance on the various methods to translate pages and posts created by page builders like Bricks, refer to WPML’s official documentation about this topic.
Template translation:
Translating templates follows the same process as translating WordPress pages & posts. Your template settings & type will be automatically duplicated to the translated post.
If the translation of templates is not automatically enabled when you activate WPML, please refer to the WPML documentation on how to enable translation for custom post types, and ensure that it is enabled for “bricks_template”.
Example: Translating an archive template:
We have set up a simple archive template, which is applied to both the “Blog” page and its translated version, “Blogue”.
Each blog page will only display blog posts of that particular language (using only one template):
Language switcher & menu translation
Language switcher
Bricks provides a “Language switcher” element for WPML, which you can add anywhere on your site.
By default, the language switcher comes with a basic preset design. However, you can always customize the switcher to match your website style:
- Go to WPML → Languages.
- Scroll down to Custom language switchers and check the Enable box. This will reveal a Customize button.
- Click the button to set your custom preferences and save.
Your changes will immediately take effect on your website.
WPML menu translation:
Consult WPML documentation for guidance on translating WordPress menus.
Sync Bricks data across translated pages
After translating a page, you might want to modify the original page. Those changes you perform with Bricks in your original page are not applied to the secondary language pages.
But Bricks and WPML make it seamless to sync your design changes across translated pages without affecting the translated text. Here’s how you can do it:
Step 1: Edit your original page with Bricks
Open the page in the primary language in the builder. Make the necessary design changes (edit layout, change styles, etc.)
Step 2: Save your changes
Once done, save your changes.
Step 3: Edit with WordPress
Close the builder by clicking “Edit with WordPress” to edit the page in WordPress.
Step 4: Update translation in the “Languages” panel
In the WordPress editor, navigate to the “Languages” panel. Typically found in the right sidebar or the document settings panel.
Here, you will find an option to edit or update the translation. Click the icon to open the “Advanced Translations Editor” as shown in this screenshot:
Translate any untranslated strings inside the Advanced Translation Editor, then click the “Complete” button at the bottom of the screen. Your new design changes are now synced with this translated page without affecting the translated text.
Creating different designs per language
You can also access and edit the translated content directly with Bricks for specific language design or content modifications. For instance, instead of simply translating the text of your homepage, you can create a completely different layout that appeals to a specific target audience.
To create a different design per language:
- Use the admin language switcher to change to the language you want to edit.
- Find the page or template you want to make changes to and open it in Bricks.
- Make your design changes and save. Your pages will now have different designs when switching languages.
Additional resources
Consult the following official WPML documentation for further guidance:
- Getting Started with WPML.
- WPML FAQ.
- Translating Content Created with Page Builders.
- Translating External Links.
Fancy trying out WPML?
If you found this post insightful and you’re considering giving WPML a try, we encourage you to use our affiliate link.
Note: The link we’ve provided is an affiliate link. This means we may earn a small commission if you decide to make a purchase through it. This comes at no extra cost to you, and it assists us in further innovating and refining our offerings.