Hello WPML Support Team,
We are currently translating a WordPress website from English into German using Elementor Pro together with the WPML Advanced Translation Editor.
We noticed a problem with content that is placed inside an Elementor HTML widget on the original English page.
Problem
The HTML widget contains custom inline HTML/JavaScript code.
During translation from English to German, WPML appears to also modify the content inside that HTML block, especially quotation marks such as:
double quotes: "
single quotes: '
This breaks the code.
Example
In the original English version, we use code like this:
<span class="typing-wrap">
Supercharge your SAP and<br />
<span class="typing" data-type-speed="45" data-delete-speed="28" data-pause="900"></span>
<span class="typing-cursor" aria-hidden="true"></span>
</span>
After translation, the German page contains a modified version where the attribute content is no longer valid, for example:
<span class="typing-wrap">
Optimieren Sie Ihr SAP und<br>
<span class="typing" data-type-speed="45" data-delete-speed="28" data-pause="900"></span>
<span class="typing-cursor" aria-hidden="true"></span>
</span>
Result
Because the quotes inside the data-phrases attribute are changed, the HTML becomes invalid and the JavaScript no longer works correctly on the translated page.
Our assumption
It looks like the Advanced Translation Editor is not only translating text content, but is also altering the raw code inside the Elementor HTML widget, especially quote characters used in HTML attributes and JSON strings.
Questions
- Is this expected behavior in WPML ATE?
- Is there a recommended way to prevent WPML from changing code inside Elementor HTML widgets?
- Can the HTML widget content be excluded from translation or copied 1:1 to the target language?
- Is there a WPML-compatible best practice for handling custom HTML/JS embedded directly in Elementor content?
This issue is currently affecting our EN → DE translation workflow, because the translated page requires manual correction of the HTML code after each translation update.
Thank you so much for getting back to me.
Unfortunately, I cannot “just copy” the code so that it is the same in German. As I understand it, the code is being copied and translated, but it is hidden, so I cannot see it in the Advanced Translation Management view. As a result, it breaks on the frontend.
Best regards
Hubertus
I would like to request temporary access (wp-admin and FTP) to your site to test the issue.
(preferably to a test site where the problem has been replicated if possible)
**Before we proceed It is necessary to take FULL BACKUP of your database and your website. Providing us with access, you agree that a backup has been taken **
I often use the Duplicator plugin for this purpose: http://wordpress.org/plugins/duplicator/
You will find the needed fields for this below the comment area when you log in to leave your next reply.
The information you enter is private which means only you and I have access to it.
NOTE: If access to the live site is not possible and the staging site does not exist please provide me with a duplicator package created with the duplicator plugin.
Thank you,
Bobby
The topic ‘[Closed] WPML HTML Elementor Pro’ is closed to new replies.
