{Updated Post on 6/12/16} WPML 3.6.1 is now released and it applies the configuration to Divi and Visual Composer automatically. No need anymore to install any XML configuration files manually.
WPML 3.6.0 is now available in first beta. The major new feature of this release is convenient translation for sites built with page builders. In this beta you can experiment with Divi and Visual Composer.
Until today, in order to translate sites that are built with page builders, you had to rebuild each page, with the page builder, in each language. This works fine for small sites that have few languages. It’s more challenging for busy sites that have a lot of content and many languages. And, it was a showstopper for anyone wanting to work with translators.
WPML 3.6.0 changes all this. Now, when you design content with a page builder, you will have the option to conveniently translate only the texts, without going into the builder to translate (it’s a new option. You can still translate “the old way”, by designing with the page builder each language separately). The same workflow will work if you’re translating yourself, sending content to your own translators or using a translation service.
Let’s see how it works.
Install WPML Translation Management, String Translation and Configure WPML
First, you need to install both Translation Management and String Translation. Both are available from your WPML account, if you have a Multilingual CMS account. If you have a Multilingual Blog account, you can upgrade and pay only the difference.
Next, go to WPML->Translation Management-&Multilingual Content Setup and select to Use the translation editor.
* The production version of WPML 3.6.0 will help you with this step. It will detect when WPML components are missing, suggest to install them for you and set the translation method correctly.
Tell WPML How to Translate the Page Builder
* This techie step is not required anymore, it was only required for WPML 3.6.0 beta.
Design with the Page Builder
Here is a sample page that we’ve designed with Visual Composer:
|
|
|
(I’ll be the first to admit that we could have designed something nicer.)
You can see the + icons for adding translations to the page.
Translate with WPML’s Translation Editor
I click to add translation to Spanish and I arrive at WPML’s Translation Editor (this is what we’ve configured WPML to do in the first step).
You can see that the translation editor includes fields for translation. There’s a field for the page title and then fields for each of the cells in the page builder. Only cells that have text will appear. This means that the translator working on the page doesn’t need to worry about the design. Translators now only need to translate and only need to translate texts. There are no shortcodes in the text and nothing else to make the translator’s work difficult.
I’m translating all the fields, click on “translation complete” next to each and then “save and close” the translation editor.
When I get back to the translated page, the + icon will change to a pencil. This tells us that it’s translated already and now I can edit it.
Check the Results
We’re all done. Let’s look at the page on the front-end, in English and in Spanish.
| English (original) | Spanish (translated) |
|---|---|
 |
 |
And, remember, we only designed this page ONCE using the builder.
Summary of the Translation Process
This blog post is a little long and includes a lot of details because it’s a beta version. The usage instructions for the production version will be a lot simpler:
- Design with your page builder
- Translate
There’s a bit of preparation work here because this beta version still doesn’t do all the automation of the production version. If you need help with any of the steps, please let us know.
The full Divi translation tutorial (added Jan 2017)
If you want to know more, we recommend that you read our dedicated tutorial about how to build multilingual sites with Divi and WPML. There, you will see the entire process and learn how to translate everything that Divi offers.
Download and Try
WPML 3.6.0 is available as beta. To get it, log in to your WPML account, click on Downloads and scroll to the bottom. You will see CMS Beta Package. Download and extract it. Inside, there are ZIP files for all of WPML’s components. To use a beta, you need to use all of WPML’s components from that package and not mix with production versions.
This is a beta, so you should only use it on development sites.
WPML 3.6.0 is going into QA next week. We will probably release more betas and we’re planning to have the production version in about a month. The production version of WPML will also include the new language switcher, more improvements, some fixes and full compatibility with WordPress 4.7.
Great news, I am looking forward to trying Divi + WPML integration the next multilanguage site they will commission to us.
What about Beaver Builder’s PageBuilder and the Thrive Content Builder?
Beaver Builder comes next. In this release, we added generic support for page builders that use shortcodes. This covers VC and Divi. Next, we’re continuing with page builders that store their design in custom fields. This will cover Divi, our own Layouts, Elementor and a number of other page builders.
Does that mean that other builders that use shortcodes, like Origin Builder for example, are already supported, or you need to implement specific code for specific builders (and therefore only Divi and VC are supported for now)?
Exactly. Other builders that use shortcodes should work with WPML 3.6.0. All we’ll need is to write a small XML config file for each of these builders. We distribute these config files on-demand, so we can add this support at any time, without having the release an update of WPML.
Can you give me a link to this builder’s website, where we can download it?
Cool…
Origin Builder is gaining popularity, with themes slowly starting to integrate it…
Don’t think you can download it without contacting the vendor, though…
Here’s the member login page: http://originbuilder.net/
Here’s the sales page: http://originbuilder.com/
Maybe you can contact them, tell them who you are and what you want to do and they might give you a free licence…
I also have the Agency licence that I can resell…
Nelson
Thanks. We’ll have a look. Like with other integrations, it helps a lot for them to know that their paying customers (you) are interested. If you also ask them, it would make it a lot easier for us to get noticed. If you have a direct contact (person), let me know?
Hi, I’m just designing a new website with Divi, so should I wait until production release to use it, and moreover, what happens when the old fashioned translation is in use ?
” Next, go to WPML->Translation Management-&Multilingual Content Setup and select to Use the translation editor. ”
Is it possible to go from the old full page translations to the new smarter one with only a preference change and without losing the translated stuff. What will happen to all these previous translated pages.
Same for custom images, I guess it’s possible to change dedicated images with the new smart translator but keeping the whole page structure the same ?
I suppose that any change made in the master language (containers, modules etc) will be reflected in all languages while only text and images will be editable in each other language…?
All the translations that you did before will continue working. You can even continue to translate “the old way” today, by not switching to WPML’s Translation Editor.
If you switch your translation preferences now, all your current translations will remain live. However, when you UPDATE these pages, you will begin the translation from scratch. With the new translation method, WPML extracts the translatable strings from each cell in Divi. WPML cannot parse the designs that you created manually and match cell for cell.
For images, it depends how you created them in Divi. Can you have a look at the beta, try working with images like you want and give us your feedback? This is the purpose of beta. If you need anything that we’re not doing, this is the best time to explain it, so we can accomodate.
Changes on the default language should be reflected on translations. I think that you’ll need to click on ‘update translations’ for all languages. Then, if no texts change, WPML will just rebuild the translated pages in all other languages. If there are some new or modified texts, you will need to translate only them. Normally, it’s safer for translations to update by your action and not automatically (which can lead to surprises).
Really great update, I recently had a site that used VC for all pages and it was pretty tedious to make sure text wasn’t missed during translation. But the translator (ICanLocalize – Rosalba) did a good job.
Thanks for your feedback. Yes, translators can handle texts with shortcodes, but it’s not easy. I hope that Rosalba will have an easier time translating just the texts, without the surrounding shortcodes.
Great news: the Visual Composer translation support is very welcome!
Sounds like a great development. When will it be launched fully?
We need about two more weeks to finish all related development and then another two weeks for complete QA. So, something around beginning of December. WordPress 4.7 goes out on Dec 6, so that’s our cutoff date.
Are you planning to include Muffin Builder also in a forthcoming release ?
In this upcoming release, we’ll include support for Visual Composer and Divi. A number of people asked us to look at Muffin builder. We’ll contact their team and see how we can work on this compatibility together. If you are their client, it would help speed things up if you can also contact them and see if they’re interested. Normally, authors respond best to requests from their paying clients.
I just did contact them.
Lets hope it helps.
That are great news! This feature will make the internationalization of our page much easier.
Where do I get the Beta version from?
Log in to your account, go to Downloads and you’ll find the “CMS Beta Package”. You need to extract this to find all of WPML’s components.
Wow! I have been dreaming about that for years.
Nice move. When will it be available for Avada?
We’re going to work on the Avada integration right next. I hope that we can do it all on our side. We may need help from Avada authors. If you are their client, it would help (very much) that you mention this to them and see if they are interested. This way, when we need their help, we’ll get it faster. Always, theme authors respond first to issues that their paying clients asked them about.
Good news. I informed Avada that we’re craving for it 😉
Looking forward for the Enfold theme builder being able to use this….
Glad to see you are working on improvements in the Translator function in WPML for Divi with Builder, specifically to keep the shortcodes as shortcodes, and not a ton of long form code. As it is on my site, the translator works fine on text only pages, BUT…
For pages with the Essential Grid 3rd party plugin, which displays squares of our catalog items via shortcode at the bottom of the page, simply running a translation, starting with a straight copy of default English to the base translated Japansese page, adds all kinds of CSS errors and disables the Essetntial Grid short codes from executing. Luckily we can delay rolling out our Japanese language version of our site (and other languages) until 2017. We cannot at the moment to spend time on a work around to keep WPML Translator from breaking the pages with Essential Grid Shortcode. Was figuring we’d have to manually make a duplicate page in WP, manually replace English with Japanese, and declare it Japanese rather than go though the Translator.
So needless to say, i am hopeful this new version will be cleaner and leave code elements that have nothing to do with text to be translated untouched in the Translator process. Even if it did not break functionality, I am hard-pressed to ask our Japanese translator to use the Translator and have to try to sort through all the extraneous underlaying code having nothing to do with his work of translating text.
Looking forward!
Japanese and other Asian languages are especially challenging if you have raw shortcodes because their alphabet is different and the brackets that they will enter are not the same as the English ones. There, the new functionality in WPML is even more important.
I’m not sure if the beta release addresses the shortcodes of the plugin that you’re working with. If not, it’s not a problem. In a few days we’re going to publish the documentation on how to create config files yourself. This way, you can create your own XML config file for the plugins that you use. This will tell WPML which shortcodes and attributes to catch for translatable strings.
Cant wait to test this out…On our new dev site we are using the xliff export/import to use within Trados translation software.
Will this new shortcode filtering work in these exports?
Is it something I could test now with this Beta version?
Yes. It works with all translation methods and is included in the beta. Go to WPML->Translation Management and select a page that you designed with VC or Divi. The XLIFF should include the standard post fields, as well as the texts extracted from shortcodes.
One more who really looking forward to get this update available for Avada.
I would very much like to know about the integration with the Elementor Page Builder plug-in.
We’ve been in touch with Elementor team for a few months now. Both we and them are interested in this integration. We’re going to start the development work right after WPML 3.6 is out. We’re hoping to have support for Elementor in the next round.
That is great news!
Hi,
This is great news! I only use Thrive Content Builder, so here you have another vote for it. Any ideas when you will release the same functionality for TCB? Thanks and keep up the good work!
I’m not sure. First, check if TCB uses shortcodes. If so, we can have this support very soon. If it’s not using shortcodes, we will need a technical contact there, who will be interested in working with us. Can you help with this?
Now I translate pages made in visual composer with current, stable, version of wpml.
When will be new 3.6 version – my translates will be “converted” into new format – like as is it visible on screen 4 above (“Translating the sample page”) ?
Right now, you are probably using the Divi builder to manually enter the translations. With WPML 3.6, everything that you translated before will continue to display correctly. However, WPML will not be able to use your existing translations with the Translation Editor (the new method).
We have the same situation with our own site (wp-types.com).
You will have two options:
1. Manually copy/paste the existing translations into the translation editor and then continue using the translation editor conveniently.
2. For old pages, continue to translate manually from inside Divi and for new content translation more conveniently.
It’s just impossible for WPML to move the texts into fields in the translation editor, because we cannot match between the two Divi designs (in the original language and the translation).
I use ‘visual composer’.
Great. The beta already supports it. Try and let us know?
I would like to try, but we have ‘live’ site, i’not programmer and I afraid a little that something will destroy..
Sure. In less than a month, we will already release WPML 3.6.0, after full QA. Then, it will be safe for you to update the live site and enjoy the new functionality. It’s not a good idea to run beta versions on production sites.
Hi,
I will definitely go ahead and try the new beta with the Divi theme. From what I’ve read so far, I do like the general idea but I have a few concerns.
* Would it be possible to edit some pages/posts using the new method, and some the old-fashioned way? The reason I’m asking is I have a lot of client sites which have less, or simply different content with a different layout on translated pages.
* Would it be possible to use different images on different language versions of pages/posts? We do have to use images that have text in them sometimes, charts, drawings, even (rarely though) buttons etc. so we need to use different files for the translations.
* If the above remain as limitations for the time being, would it be possible to avoid the Translation Editor method in the production version? My preferred theme is Divi, and I only use WPML for translations, so if the above limitations are not solved should I avoid updating or would I be able to just switch it off and translate the old-fashioned way?
Very Best,
Burak
When you change the translation method to use WPML’s Translation Editor, it will apply to your entire site. You can still reach content manually and edit it directly in the page builder. To do this, go to the list of pages (if you’re editing pages), switch language and edit the page you’re looking for in the language you’re looking for.
Same for images. If you need to update images, you’ll need to edit the translation manually (like I wrote above). Somewhere in the not too distant future, we’re planning to add to WPML a way to upload image translations. This will allow you to translate conveniently with the Translation Editor and have WPML automatically update media. It’s been on our plans for a while and I hope we can push it soon.
Does this help?
This is a great feature. I have just installed it, and have proceeded to test some of my Visual Composer pages. It manages to identify the plain text and captures it for translation, but it fails to recognise any headings, titles, info boxes etc, which unfortunately where most of my content is. Am I missing a step? I was reading how to manually identify strings, but I’m really not following that at all. Would you be able to provide me with some help on how to go about selecting these other elements as strings for translation?
Thanks.
Thanks for your feedback. I sent you an email with details on what we’ll need to debug and fix. See that you have it and send us a reply?
SiteOrigin support coming?
I think community size of SiteOrigin may be bigger than VC/Divi since It’s got more than 1 million active installed sites.
If it uses the standard WordPress widgets, wouldn’t it work “out of the box” already with WPML?
We installed the beta version and tried to translate. Unfortunately we do not know where to start?!
Is there a one button to translate ALL PAGES into a new language? This would be very helpful.
WPML doesn’t translate your content automatically, so it doesn’t have a button to “translate all”. If you have all the required plugins installed, you should go through the instructions in this blog post. Please let us know at which step you’re stuck and what you see and we can help.
Hi there. We’re just finishing up dev on a new clients site and about to begin the translation to Japanese. Would you recommend using the new beta version of the plugin or suggest sticking to the version 3.5.3.1? I read some comments above about issues with Japanese and wasn’t sure how to proceed. Thanks!
Amir – any chance we can get a reply?
Sorry. I missed your previous comment. This week we completed 80% of the QA for WPML 3.6. In the process, we fixed a number of issues (this is how QA usually goes). On Tuesday, we’ll update our own sites with the pre-release version and I’ll push another update beta. This version would be better for production sites. We’ll be running it ourselves. So, let’s wait until Tuesday and then it’s fine to build client sites with WPML 3.6. Sounds OK?
Thanks for the feedback. Can you relate to the questions regarding Japanese? Thanks!
I don’t know about any issues with Japanese or any other language. You don’t need a beta to create a site that has Japanese. For Japanese, your database needs to have the correct charset encoding. The default UTF-8 works fine for Japanese and any other Asian language. In fact, I don’t know of any reason to ever change from this charset. As long as you use UTF-8, there will be no problem with Japanese. If you’re having a problem related to any language, please report in our technical support forum.
I read Justin’s post from Nov 9 that referenced issues with Japanese.
Hi Amir – I checked the downloads page and I’m still seeing 3.6.0-rc.1. When should we expect the next update? Thanks!
We finished testing for Divi and Visual Composer yesterday and guess what? We found a number of nasty bugs. We fixed most yesterday and are finishing this today. I very much hope to release this beta update today. We can’t delay it much longer because WordPress 4.7 comes out soon and this WPML version is also needed for WP 4.7 compatibility.
For some reason I can’t reply to your last message. Thanks for the update. If I install the current RC, will I be notified about the update available in the WP admin once you push it?
Hi there. I am just testing the Divi and new WPML Beta and found few issues. For example in the contact form module, Translation Editor is extracting only input boxes (fields), but not the main heading and also the text displayed after the form is submitted.
Thanks,
Petr
Thanks for the feedback. I sent your message to the developer working on this. He will need to get a few details from you, so we can see which elements we’ve missed and we’ll add them to the configuration file.
We’re very happy to see this functionality coming in 3.6! Could I get an ETA on X theme (Cornerstone)? This functionality is key to a project we’re currently working on, so we’d love to see it implemented soon… could possibly assist with development if that helps.
Does Cornerstone use shortcodes? If so, you can have it working immediately. If it stores the design in a custom field, it will take us a bit more time to implement. We’re going to publish a guide for how to use WPML’s new API for translating page builders that don’t use shortcodes. Then, you can see if you can start on it for Cornerstone or you need us to do it.
But first please check if Cornerstone uses shortcodes.
Hi Amir, thank you for the swift response! Yes, Cornerstone (X theme) uses shortcodes. I’ve installed WPML 3.6.0 and tried following the instructions above, but do not have the config file.
Does this version contain a fix for the cookies preventing caching?
(https://wpml.org/forums/topic/language-preference-cookies-are-breaking-caching-on-pagely-hosting/)
We started working on Cookies-Free mode, but it’s not ready yet. This mode requires touching many parts of WPML. Just to clarify, it’s not that you cannot run any caching. Of course, 99% of the sites using WPML use page caching and other caching (like Object Caching). There’s a problem with the caching layer in Pagely, which is all or nothing.
I was told this would be fixed in this release. This is a problem with your system, not Pagely. When will this be fixed?
Just tried this out on a single page Divi site, and the Translation Manager dumped all the shortcodes and copy into just one field. Seems unusable.
That’s not how it’s supposed to look. You should see separate fields, each with the text of that cell. Could you please create a ticket in our support forum and paste the link here? We’ll need to login to your site, see what’s installed and how it’s configured and then we can get it to work correctly for you.