Skip Navigation
October 26, 2020

WPML allows you to easily translate pages you build using your favorite page builder. Read this guide to learn which page builders are supported and how to translate page builder designs.

What you need

  • WPML Multilingual CMS package which includes the main WPML plugin, WPML Translation Management, and WPML String Translation add-ons. All three must be installed.

Which page builders are supported

We are constantly working on adding more popular page builders to WPML’s list of integrations.

The following page builders are integrated with WPML:

If your favorite page builder is not yet integrated with WPML, follow this guide about integrating page builders that use shortcodes.

How to translate page builder content

There are two ways content created with page builders can be translated:

  • By translating it yourself
  • By sending it to be translated by others

Translating page builder content yourself

Use the following steps to translate the content yourself:

  1. Click the plus icon for the language you want to translate the post into. The plus button is accessible either in the language box when editing a page or from the list of pages, as you can see in the table below:
    The plus located in the Language box when editing my page. The plus located under the flag in Pages → All pages
     Using WPML to translate page builders Using WPML to translate page builders.
  2. WPML’s Advanced Translation Editor opens, and you can add your translations for each sentence in the field on the right. Click the green check mark to complete each translation.
    WPML's Advanced Translation Editor
    WPML’s Advanced Translation Editor

    You can also use automatic translation to translate the entire page in one click. Double check each translation to make sure they are correct.

  3. When you are done translating, click Finish and then Close.

Sending content to other translators

WPML also allows you to send your content to be translated by local translators or by professional translation services. To use a professional translation service, be sure to activate the service you want to use first.

  1. Go to WPMLTranslation Management
  2. Choose the type of your content (page, post, etc.), select it, and click Add to translation basket.

    Using WPML to translate pages built with WPBakery Page Builder
    Adding content to the translation basket

  3. Click the Translation Basket tab, and select the local translator or translation service. You will only see translator options that match the translation jobs’s language pairs.

    Using WPML to translate page builders
    Selecting your translator

For jobs assigned to local translators, they will be able to go to the WPMLTranslations page and start with the translation job. The job will open in the same Advanced Translation Editor as described in the Translating page builder content yourself section above.

Jobs assigned to professional translation services will be sent to the translation service. You can choose to have the translations published immediately once the job is complete, or to review it first. This setting can be changed by going to WPMLSettings and scrolling to Translated documents options.

Translation of content that appears multiple time

Sometimes, you might have text that repeats on your page. WPML automatically recognizes the duplicate content and offers it for translation as one field. This way, you don’t need to spend time translating the same texts in the page.

WPML will then display the translation of these texts in all the places that they appear on your page.

The following image displays a design created using WPBakery Page Builder, using three instances of the same text.

WPBakery Page Builder design using multiple instances of the same text
WPBakery Page Builder design using multiple instances of the same text

When we translate that page, we can see that the editor only shows one instance of the field to translate this text. Again, this means that we only need to translate it once.

Only one field is used to translate duplicated texts
Only one field is used to translate duplicated texts

Finally, on the front-end, the translation of the text is displayed in all the places as intended.

Translated duplicated texts shown in all the right places on the front-end
Translated duplicated texts shown in all the right places on the front-end

Updating translation when a page changes

When the content of the translated page changes, you can simply translate it or send it to translation once again. This time, you will not need to translate all the contents once again, but only the part that changed or was added.

In this example, I added a Text Box element to the “About Us” page:

Adding a Text Block to my page
Adding a Text Block to my page

Note: Remember to Update the page after adding the element. This is important because it will load the text elements to the Advanced Translation Editor screen.

In the Language meta box, click the icon to update your translation.

The arrow icon replacing the plus button
The arrow icon replacing the plus button

When the translation job opens in the Advanced Translation Editor, you will see that the previous translations are still in place, and there is a new field that need to be translated.

Advanced Translation Editor with new text block element to be translated
Advanced Translation Editor with new text block element to be translated

Translate, mark the translations as complete, and then Finish and Close.

Translating Toolset templates designed using page builders

Toolset plugins allow you to design Content Templates for displaying single posts of any post type. Usually, you use one template for all languages and translate only the texts inside, for example, labels or headings.

Alternatively, you can select to create separate Content Templates for each of your site’s languages. In this case, you should not send such templates for translation. Instead, you should edit the template in each language separately and translate them like that.

Toolset allows you to design Content Templates using the following page builders:

  • Elementor
  • WPBakery Page Builder
  • Oxygen
  • Beaver Builder

If you use a page builder to design your Content Templates, you have to translate your templates. To enable the translation of a specific Content Template:

  1. Go to the WPMLSettings page
  2. On the Multilingual Content Setup tab find the Post Types Translation section
  3. Mark your Content Template as translatable

Now you can send your Content Template for translation.

However, if you have previously selected to use different Content template for each language you cannot use this workflow. Instead, you have to use your page builder to individually add content to each language’s Content template.

To check the status of the Create different Content Templates for each language option, go to the ToolsetSettings page and click the WPML integration tab.