Elementor is a page builder that allows users to control the styling and content of their site easily. This allows them to build any desired design with Elementor and translate the texts using WPML.
What you need
- WPML’s Getting Started Guide helps you set up WPML in a few minutes.
- Later, you can refer to some of its subtopics, such as Theme and Plugin Localization and String Translation. We recommend that you keep this guide open while following this tutorial.
- Elementor Documentation provides you with all information needed to set up Elementor’s different features.
- Getting Started
- Translating Elementor pages with WPML
- Adding a new Element to the page and updating the translation
- Updating an existing Element and its translation
- List of the translatable Elementor Elements
- Get help from our support
- Get WPML
- Set up WPML from WPML -> Languages. See our WPML Getting Started Guide for complete reference. The initial three-step setup is simple and self-explanatory. It asks you to choose your default language, a set of active languages, and a language selector.
- First install and activate the core WPML plugins (WPML Multilingual CMS, WPML String Translation, WPML Translation Management). Then install the other WPML plugins that may depend on these core plugins.
- Install Elementor and activate it.
- A notification displays at the top of the WordPress dashboard that enables you to easily activate the WPML Translation Editor with a single click. Simply click the Enable it now button in this message window.
How to translate Elementor pages using WPML?
WPML 3.7 presents new features that simplifies further the process of translating pages created using Elementor. The following new features are added:
- Preserving the existing translations when editing the default language page
- Automatic Translation for internal links
- Copy-once mode for custom fields
WPML lets you translate content in three convenient ways. You can produce the translation yourself, send content to your translators, or send jobs to a professional translation service without leaving your WordPress dashboard.
|Page in original content||Page translated to French|
Scenario 1: Translate the content yourself
WPML’s Translation Editor is only accessible from the back-end of your site. Once you have created your page on the front-end with Elementor, click on the Save button. Then, click the Go to Dashboard button.
Once your page is published, the plus button will be enabled, allowing you to translate your pages. You can find these plus buttons in the Language box when editing your page, or on the listing pages.
|The plus located in the Language box when editing my page.||The plus located under the flag in Pages -> All pages|
Clicking one of the plus button takes you to WPML’s Translation Editor.
Use it to translate all the content of your page. Note: do not forget to check the box to indicate when a translation is complete.
Important note: in order to see the translation on the front-end, you need to get 100% Complete in the Translation Editor:
Once the translation is complete, the plus button will change to a pencil button as shown in the following image.
Scenario 2: Send content for others to translate
WPML allows you to send your content to translators. Translators will only see text that requires translation without having to address how your site is built.
2. Select the content you wish to send for translation. Go to the WPML Translation Management page and select the content to translate.
3. Click to add the items you selected to the Translation basket.
4. Finally, on the Translation basket tab, select the translators you desire.
The translators or translation service will receive a notification about your job. When the translation is complete, it will automatically appear on your site.
Adding a new Element to the page and updating the translation
When you add a new Element to your page and you want to have it translated, follow the same steps as previously described: Save and click on the Go to dashboard button from the front-end builder.
The plus button for this page is replaced by an arrow button, meaning that the translation requires an update.
Click on this arrow to re-open WPML’s Translation Editor.
All previous translations appear. Only the new Element must be translated.
On the front-end, the French translation is also updated as shown on the images below.
|New Element in English||New Element translated in French|
Updating an existing Element and its translation
Sometimes, you must edit existing Elements in the original language.
But what happens to your translation in this case? The translation is not lost.
Simply translate the new content you just added.
The front-end is also updated with the French translation as shown in the table below.
|Updated Element||Updated translation|
List of all translatable Elementor elements
The following textual elements found in Elementor are currently supported by WPML:
- Text Editor
- Price List
- Price Table
- Flip Box
- Image Box
- Icon Box
- Icon List
- Progress Bar
- Posts (Here is a short video explaining how to translate this element.)
Getting help from our technical support
The WPML support team is trained on how to integrate Elementor page builder with WPML. If you run into any problems or need our advice, create a new ticket and our support team will be happy to assist you.
Ready to get started?
You can evaluate WPML for 30 days and see how you like it. If you are not happy with it, we will refund your money without any questions within the 30-day trial period.