If you’re building your WordPress website in the year 2020, then you’re probably doing it using one of the best WordPress page builders available on the market.
However, right out the gate, it’s not immediately clear how to make your page builder content multilingual. Is it even possible? Can your custom page designs be translated just like standard WordPress posts and pages?
In this post, we look at 5 of the best WordPress page builders for multilingual sites, and then show you how to translate your content in each one. Let’s dive in…
No list of best WordPress page builders can live without Elementor. It is the most popular and (arguably) the best page builder available. Users love Elementor for its ease of use, versatility, and the fact that you get 98% of the benefits in the free version.
All content coming out of Elementor is fully multilingual-friendly and can be translated easily. Here’s how to do that:
Note: we’re going to use the TranslatePress multilingual plugin to handle all translations. If you want to learn more about the plugin – what it is, how to install and configure it, read this tutorial on the best way to translate a website.
Translate your text, images, and more in Elementor
Once TranslatePress is installed and activated on your Elementor website, simply click on the Translate Page link in the top bar to start translating your content:
This will open the translation interface of the TranslatePress plugin (which looks similar to the WordPress Customizer).
You can translate any piece of content that’s on the page. The fact that the page was built with Elementor makes no difference to TranslatePress. This includes all your text content, images, links, and more.
To translate a piece of content, hover your mouse over it and click on the pencil icon that will appear.
This will open a new translation block in the sidebar. The block contains the primary language version of the item – the one that’s currently on the page – and an empty field where you can put your translation.
Here’s what it looks like when you’re translating a piece of text:
Here’s what it looks like when “translating” an image (or rather replacing it with another image that might be better optimized for new language versions of the page):
Lastly, here’s how to translate a link:
This interface allows you to translate not only the anchor text of the link but also the destination that the link points to.
To approve your new translations, click on the Save translation button that’s at the top.
To learn more about how to translate your Elementor pages step by step (and how to translate other types of content apart from just text or images), read our in-depth guide here. Or you can even learn how to set up an Elementor language switcher here.
Divi is one of the most popular premium WordPress themes on the market. Similarly, Divi Builder – the page building part of the Divi theme – has attracted a huge following as well.
This is partly due to the license structure that Elegant Themes – the company behind Divi – employs. Basically, you get all of Elegant’s products for one fee. That said, there’s no free version of Divi Builder, which will naturally discourage some users. If you’re on a tight budget, you’ll likely pick another builder.
The good news is that Divi Builder is 100% ready for translated content, making it one of the best WordPress page builders for multilingual sites. Here’s how to translate your Divi content using TranslatePress:
Translate your text, images, and more in Divi Builder
Click on the Translate Page link in the top bar to begin working on your translations:
The TranslatePress plugin allows you to translate any piece of content on the page created with Divi. No matter if it’s text content, images, links, or anything else, you will be able to translate it all.
To get started, hover your mouse over an element on the page and click on the pencil icon that will appear.
You’ll see a new translation block in the sidebar. The first field is where you can find the primary version of the content. The other fields are where you can enter your translations.
This is what the block looks like when translating a piece of text:
This is the same interface when “translating” an image:
As you can see, with images, you don’t actually work on the image itself, but, instead, you can switch the main image to a different one that’s more optimized to serve a specific language version.
You can pick the image from the media library or upload a new one from your desktop.
Divi Builder’s translation abilities don’t end there. You can translate all of Divi’s more advanced content blocks and sections as well. For example, Divi can be used quite effectively to build a better looking Shop page for your WooCommerce store.
You can then take that Shop page and translate it using TranslatePress. You can go through your products one by one – click on the pencil icons next to their names and translate them.
When you’re done working on translations, click on Save translation at the top.
To learn more about working with Divi Builder and translating your pages step by step, read this hands-on guide.
Beaver Builder is another excellent choice if you’re looking through the best WordPress page builders on the market that allow for full content translations.
Similarly to Elementor, you can start using Beaver Builder for free. However, this time you won’t be getting many of the builder’s best features, to be honest. Those only come in the paid versions. That said, all the paid licenses let you use the builder on an unlimited number of sites, which is a great offering, especially for developers who want to service multiple client sites with the same tool.
Here’s how to translate content on pages built with Beaver Builder:
Translate your text, images, and more in Beaver Builder
To start, click on the Translate Page link in the top bar:
The interface you’ll see is where you’re going to be doing all the translations. Any piece of content on your Beaver Builder page can be translated using TranslatePress. This includes all texts, images, links, and other content elements (like menu items or sliders).
To begin, hover your mouse over the item that you want to translate and click on the pencil icon that will appear.
You’ll see a new translation block on the left with the primary language version of your content. You can enter a translation by filling out the empty field(s).
Here’s what the interface looks like when translating text content:
You can translate any image on the page in a similar manner:
Though, in this case, you’re not exactly translating your existing image, but rather replacing it with a new image that will have the “As seen on TV” text translated in the other languages (Polish, in our case).
Lastly, this is what the interface looks like when you attempt to translate a content slider (a popular type of block to have on a website):
As you can see, there’s no difference. Simply click on the pencil icon next to the slide that you want translated, enter your translation, then switch to the next slide, and so on.
Click on Save translation at the top to approve your changes.
To learn more about working with Beaver Builder and translating your pages from start to finish, read our step by step guide here.
Visual Composer is next on our list of the best WordPress page builders for multilingual sites. It’s an overall cool tool that lets you craft your pages in a fully visual interface. Visual Composer used to be a premium-only plugin, but that changed a while ago. There now is a free version available, and it doesn’t lack any features you’d consider essential.
However, to get advanced stuff like header/footer/sidebar editors and WooCommerce compatibility, you’ll still need to upgrade to a paid license.
What’s key for us today, though, is that Visual Composer allows you to translate your pages with ease (with the help of TranslatePress). Here’s how to do that:
Translate your text, images, and more in Visual Composer
Enter the translation interface of TranslatePress by clicking on the Translate Page link in the top bar:
Visual Composer is fully compatible with TranslatePress and allows you to translate anything you see on the page – all the texts, images, links, and any other type of content that you might want to translate.
To get started, hover your mouse over an element that should be translated and click on the pencil icon.
You’ll see a translation block in the sidebar that corresponds to the element from the canvas. Enter your translation by filling out the empty field(s).
Here’s what the box looks like when translating texts:
Translating an image works the same way; simply click on the pencil icon next to the image:
Either upload a new image from your desktop or select an existing image from your site’s media library.
Visual Composer offers you many more content elements that can be translated in a similarly straightforward way. For example, here’s how to translate an FAQ Toggle element:
First, click on the title of the collapsable element, and then on the pencil icon next to its contents. You can translate the titles as well.
When you’re done working on the page, click on Save translation at the top.
To learn more about how to translate websites built with Visual Composer, read this guide of ours. It takes you step by step through the entire process.
Brizy is one of the more original solutions among the best WordPress page builders for multilingual sites. What’s different about it is that rather than putting the focus on individual content elements like texts or images, it encourages you to structure your page designs around custom blocks that group a couple of content elements together.
For example, think of a whole about block where you get space for your company name, short description, image, and a button all in one package vs having to add those elements one by one. Of course, you can still add single content pieces to your pages if you want to.
Not surprisingly, Brizy is as ready as can be to welcome translated content from TranslatePress. Here’s how to add your translations:
Translate your text, images, and more in Brizy
Click on the Translate Page link in the top bar to get started:
You’ll see the translation interface of the TranslatePress plugin. Anything on your Brizy page can be translated. This includes your text content, images or sliders, buttons, and other elements.
To start, hover your mouse over the piece of content that you want to translate and click on the pencil icon.
A new translation block will appear in the sidebar. In it, you’ll see your main content in one field and one or more empty fields where you can enter your translations.
Here’s what it looks like when translating text content:
Here’s what it looks like when translating images:
As you’ve seen by now, you can easily “translate” images with TranslatePress. I’ve put that in quotes because what you’re actually doing is selecting a new image that fits a given language version better. You can upload that image from your desktop or pick from what’s already in your media library.
If you want to take things a step further, you can also translate the texts in your forms – be it contact forms, product download forms, or whatever else. To do so, just click on the pencil icon next to the form element that you want to translate:
When done working on the page, click on Save translation at the top to keep your changes.
To learn more about translating websites built with Brizy, read our in-depth guide here.
Best WordPress page builders for multilingual sites: what’s your favorite?
As you’ve seen above, all of the top five page builders on the market are ready for your multilingual content and come fully compatible with the free TranslatePress plugin. You can use TranslatePress to translate all your texts, images, links, buttons, what have you.
What is your favorite page builder on this list? Feel free to share in the comments.
Want to take your translations to the next level? For instance, if you’d like to invite other people to work on translating your site for you, check out the many add-ons we have available for TranslatePress.