[Feature Request] WPML Media translation not working for image in custom elementor widget
Dieses Thema ist gelöst. Hier finden Sie eine Beschreibung des Problems und der Lösung.
Problem: The client created a custom Elementor widget containing an image, headline, and text, and encountered an issue where the image did not change when switching languages, despite using WPML's Media Translation. Solution: We recommended the following steps to resolve the issue: 1. Ensure that the image within the custom Elementor widget is stored as a URL and that the URL field is registered for translation in the XML configuration. 2. Make a small update to the source page and save the changes. 3. Update the translation and use the Advanced Translation Editor to search for the image URL. If found, replace the URL with the correct image URL for the desired language. 4. If the URL does not appear in the translation editor, it's possible that the widget and its configuration need further adjustments. We suggested replicating the issue in a WPML sandbox environment to further diagnose the problem. 5. If manual translation of the image URL is required, consider integrating the Elementor widget with WPML Media Translation using a custom integration class, which may require hiring a developer proficient in WPML.
Please note that this solution might be outdated or not applicable to your specific case. We highly recommend checking related known issues at https://wpml.org/known-issues/, verifying the version of the permanent fix, and confirming that you have installed the latest versions of themes and plugins. If the issue persists, please open a new support ticket.
Dies ist das technische Support-Forum für WPML – das mehrsprachige WordPress-Plugin.
Mitlesen können alle, doch nur WPML-Kunden können hier Fragen veröffentlichen. Das WPML-Team antwortet im Forum an 6 Tagen pro Woche, 22 Stunden am Tag.
Die Symptome:
The image in the custom Elementor widget does not show up correctly in different languages. You can see the wrongly tranlated image (the one with "deutsch" on it) here: versteckter Link
Fragen:
Why is the image in our custom Elementor widget not showing up correctly in different languages despite being translated in WPML Media Translation?
Is there a specific configuration needed for images in custom Elementor widgets to work with WPML Media Translation?
I understand the issue you're having. The image within the custom Elementor widget might be stored as a URL. Since the widget has been translated correctly, you should be able to translate the image URL from the translation editor. Please try the following steps to see if they help resolve the issue:
- Please make a small update to the source page and save the changes.
- Proceed to update the translation.
- When you're in the translation editor, enter 'http' in the search box and check if the image URLs appear. If you find them, translate them by replacing the URL with the URL of the image you intend to display in the other language.
Please check this guide to understand the process of translating URL's from the translation editor.
But if the URL doesn't show in the translation editor, then I need to check the widget and its configuration. I kindly request you to try replicating the issue in our sandbox. The autologin link to our sandbox is provided below.
- versteckter Link
The WPML plugin and its addons are pre-installed on the sandbox. Please complete any remaining setup steps. Then, install the Elementor plugin, add the custom widget, and try to replicate the issue as it occurs on the main site.
If you encounter the same issue on the sandbox site, let me know. I will review it and advise you on the next steps.
Looking forward to your response and I'll be happy to help if you need further assistance in this matter.
thank you for reaching out and providing a test environment.
First up: there is no tranlsateable link in the advanced translation editor. This by purpose, too, as we want to make use of WPMLs "Media Translation".
I set up the wordpress instance like this:
- set up german as base language, added english, french, spanish
- enabled media translation
- set up german as base language, added english, french, spanish as additional languages
- added elementor/elementor pro
- added our custom plugin "Audials Elementor Widgets" containing our custom plugin "Image + Text"
- added the required xml information to make the texts translateable in WPML > Settings > Custom XML Configuration
- set up this test page: versteckter Link
- translated it to all additional languages
The test page contains a control image to prove that media translation is working and our custom widget "Image + Text" containing the same image.
When you open the page and switch through the langauges, the control image changes as expected but the image in out custom widget does not.
I was not able to adapt the PHP code provided in the other thread mentioned above so I did not include any PHP code snippet yet. It would be great if you could assist us here.
Thank you for your effort in recreating the issue in the sandbox.
I have discussed this with our developers, and I would like to inform you that adding media translation compatibility for Elementor widgets registered using XML config is currently not possible. Although we have correctly registered these fields, automatic image translation for Elementor widgets via XML config cannot be added at this moment. Users will need to manually translate the ID or URL of the image in ATE.
To integrate Elementor widgets with WPML Media Translation, the only way is to use an integration class that must be added to the widget code, which requires lots of custom coding. As providing custom coding support is beyond the scope of our support, you can hire a developer proficient in integrating WPML support in the Elementor widgets. You can hire a professional developer from here: https://wpml.org/contractors/
However, as I suspected, the image is saved as a URL, but the URL field wasn't registered for translation in the XML. I added the URL field to the XML code, made a small update to the page, and proceeded to update the translation. The URL now appears correctly in the editor. Upon translating the image URL and adding the correct translation, the image displays correctly in the translations.
Please watch this versteckter Link">video to see how the URL field was registered and how the image is displayed on the frontend.
[Only the Authorized users will be able to access the video. When I receive your access request, I will promptly accept it. You can refresh the page after a few minutes, and you'll be able to see the video]
I hope the information above helps. Please feel free to let me know if you need further clarification or assistance. I will be happy to help.
you will be glad to hear that we managed to solve our image translation issue in the meantime and indeed make use of WPML Media Translation.
Here´s the short version of how we did it:
1. Translated our images with WPML Media Translation
2. Converting the image ID at runtime to the one that is appropriate for the current language with this filter:
$post_type = get_post_type($imgID);
$translated_id = apply_filters('wpml_object_id', $imgID, $post_type, true);
3. Retrieving the desired image url by converting the ID to url with this:
$image_url = wp_get_attachment_url($translated_id);
I'm really glad to hear that you've successfully solved the issue with a custom coding approach. Thank you for sharing the code solution; it will be helpful for others experiencing a similar issue.
Please feel free to reach out to us if you ever need any assistance with our plugin. We are always happy to help.
If the issue is resolved, kindly consider marking this thread as resolved!
