Another specific issue I noticed, is that the CSS class wp-image-ID don't seem to translate properly, wathever the media format.
I did a test on your sandbox:
1. I uploaded 2 images (png and webp)
2. I created a page and added these images + the svg one: hidden link
3. I translated the page
4. I displayed the translated page. No images were translated: of course, neither the png and the webp since I didn't upload a translation yet, and not the svg.
5. I translated the new images by uploading a french version for each of them, from the media translation
6. I check that both were displaying on the french page >> That was the case
7. I opened the page for individual edition, and noticed that both the png and webp images were broken (attempt recovery). I checked the HTML, and it appears that the images had no CSS class at all, while I already had checked that the original ones did. Then I purposely did not save the page.
8. From the media library (I didn't close that thumbnail), I clicked to option at the top of the page to update the page where the uploaded images were added.
9. I checked that nothing had changed on the frontend
10. I reloaded the admin page : both image were still the the Attempt Recovery state, but now had a class="wp-image-0" (yes, zero), when to my understanding, they should get the translated media ID.
11. Try playing with the media size, and it will break the translation.
I feel this test is pretty basic, but obviously, something already goes wrong here.
Currently, the only way I found to get the images I translated (through the media translation) on the frontend, is to manually : Replace > Open Media Library > Select my image > Validate.
With this method, the ID class is moved to the right one, and I can swith the size (if needed) without breaking anything. And it seems to be the only way.
However, it's not translation anymore: it's all manual! Here, the Media Translation becomes useless, it's just a media library organization tool.
And these issues are not even related with SVGs.
Can you please confirm you notice the behaviors I encounter?
This is a very annoying issue, since in these conditions, my content translated through your tool (and not edited individually) don't get the translated images they should.
Therefore, for now, I can't publish content with translated medias in an organized process, which is what the Media Translation is made for.
Thanks for reporting this issue.
The core problem is that the replaced images disappear from Media translation once the translated page is edited with the WordPress editor.
I escalated this problem to our second-tier supporters.
I'll update you once I have news about this issue.
Sorry, that's not what I notice during my tests.
I didn't notice media disappearing from the Media Translation panel after translation - /wp-admin/admin.php?page=wpml-media
In case, I did it another test on your sandbox.
1. I uploade a media (PNG) from the Media library (with title and alt data)
2. I uploade another file for french translation from the Media Translation panel (and translate the meta along)
3. I created and uploaded this new media in new page in original language: hidden link
4. I translated it with the ATE (you guys still didn't move the sandbox settings to CTE, so I guess I must assume our issues are not related with the editor)
5. I checked that the media is translated in the from end (it is)
6. I edited the french page individually, and change the media alt value locally > Update >
> The media is still the right one in the frontend
> The media is still available in the Media Translation panel
7. I change the size of the image from full to medium
> The image is replaced by the original one in the editor straight away
8. If I click update,
> The media is now the orignal one on the french page,
> The French media is definitly still available in the Media Translation panel.
Thanks for reporting this. However, you should not edit the translated page in the WordPress editor if the translation is using WPML's Translation Editor. Nevertheless, even with the steps you mentioned, the replaced image appears again after refreshing the editing screen in French. We can't consider it a bug; it's only an issue with the translation workflow.
The issue I mentioned has been escalated to our developers and will be fixed in the next major version of our plugins.
I've been thinking quite a lot to your last message.
I think I finally understand what you tested and explain.
Now, I understand you're saying that the image translation works (= allows to get the media uploaded from the media translation in the translated page instead of the original one) as long as we edit the translation:
- with the CTE or ATE // Where we have to keep the exact same content structure
- or by moving the setting from the original page, to "WordPress Editor" // Required for structure changes
However, it WON'T work as long as, while remaining with the CTE/ATE setting, we click Admin bar:"Edit page" from the translated page to edit the translation.
Just so you know, I used to follow this workflow because with to remain on the ATE as long as possible, before applying individual changes. It just prevents more manual changes afterwards, in case the original content changes.
Then if I need to see the translated page before moving the setting, I display the original front page > move the language from the language switcher.
Then, I have 2 options to edit the page individually:
1. Click Edit translation > Cancel > Be sent back to original page > Move the setting: CTE > WordPress Editor > Click the pencil // Quite a trip
2. Basically click "Admin bar: Edit page" from the translated page.
The second one was obviously the quickest. And since the button was available, and I had no idea it would break something, besides, the risk being moved to the WPML Editor when working from the original page, and crush my individual changes.
Now you say it's not bug.
From my user point of view, It's rather say that your design could be more robust.
I mean, if got there for 2 reasons:
- As explained above, it's quicker
- Basically because I could!
In other words, I feel that, if it leads to issues, this " Edit page" button should just not be available from the translated pages as long as the editor setting hasn't been switched to WordPress Editor.
I tested the workflow you suggested, and indeed:
- The translated image remains when moving the setting to WordPress Editor.
- I can now change the size without breaking the image.
- However, inspecting the HTML, the ID class is still the original one. This, I think, should be fixed.
Now, you say: "The issue I mentioned has been escalated to our developers and will be fixed in the next major version of our plugins." I imagine you're talking about: "The core problem is that the replaced images disappear from Media translation once the translated page is edited with the WordPress editor.
Images are **removed** from the "Media Translation", really? or only from the page after edition/or from the library?
>> Can you elaborate/show me what happens?
I didn't notice it, on our environments, nor your sandbox during these tests. However, I did notice, for years now, images suddenly missing from translations and the library, without really understanding where this came from.
Finally, you say it'll be fixed in the next major versions of WPML.
WPML 4.9 is in beta, and the changelogs makes no mention of that issue.
Media Translation 3.0.0 has been there for 4 months, has no beta yet.
So I feel we'll have to wait.
In the meantime we have 3 fixes for these Media Translations issues.
- Applying the SVG patch you suggested
- Our patch for SVG, that seems to fix many SVG related issues.
- And another one that fixes the 2 issues I mentioned in the current ticket, even when using that guilty workflow.
I guess we'll have to rely on these until you guys have something more robust to offer.
The following are the steps to replicate the issue I escalated to our developers.
1. Upload images to the media library in the primary language. (I tried it with these image types: JPG, PNG, WEBP.)
2. Create a page in the primary language and add the images you uploaded above using the Image Block.
3. Publish the page and translate it into the second language using ATE.
4. Go to WPML -> Media translation, and switch the images for the second language.
5. Check the translated page and see that the switched images show.
6. Edit the translated page in the WordPress editor, then click Edit Anyway. (This happens without saving the translated post — just opening the editor is enough.)
7. Go back to WPML -> Media translation, refresh the tab -> You will notice that the switched images are gone, and the plus icon appears.
If there is a feature missing for you in Media translation, please describe it, and I'll send that feature request to our second-tier supporters. Please explain it as briefly and directly as possible.
