[Closed] Media translation image doesn't show properly.

Hi there

To confirm, you are using different images on the different language versions of the posts, not just translating the texts associated with the images (like alt text), yes?

Can I check how you are inserting the images on the page?

I suspect that if you were to just insert the image on a test page you make with the block editor and translate the page the correct versions of the image would appear, and that the issue arises because of how the image is inserted.

Could you please clarify that?

It looks like the image is inserted in something other than a standard Elementor module (screenshot).

Would it be possible for me to get access to your site so I can check exactly how the image is added. I need to be sure of that to be able to try and reproduce the problem.

Let me mark your next reply as private so that I can get log-in credentials from you—you may want to create a temporary admin user for me to use that you can later delete. And be sure to have a current backup of your site.

OK, I have a workaround that you can use so that replacing the images works with the Timeline widget from Qi Addons for Elementor.

First, go to WPML > Settings and the Custom XML Configuration tab and add the following:

<wpml-config>
  <elementor-widgets>
    <widget name="qi_addons_for_elementor_timeline">
      <fields>
        <field>children</field>
      </fields>
      <fields-in-item items_of="children">
        <field key_of="image">id</field>
        <field key_of="image">url</field>
        <field key_of="image">alt</field>
        <field key_of="image">source</field>
        <field key_of="image">size</field>
        <field>title</field>
        <field>date</field>
        <field>text</field>
        <field>_id</field>
      </fields-in-item>
    </widget>
  </elementor-widgets>
</wpml-config>

You will also need to add some PHP to your site. The best way to do that would be with a plugin like Code Snippets, or you could add it to the functions.php file of a child theme.

This is the code you'll need (it only needs to run on the front end, which you can specify with the Code Snippets plugin):

// WPML Workaround for compsupp-7006
add_filter( 'elementor/frontend/before_render', 'wpml_compsupp7006_qi_addons_for_elementor_timeline_widget');

function wpml_compsupp7006_qi_addons_for_elementor_timeline_widget($element) {
	if ( 'qi_addons_for_elementor_timeline' !== $element->get_name() ) {
        return;
    }

    $settings = $element->get_settings();

    if ( isset( $settings['children'] ) && is_array( $settings['children'] ) ) {
        foreach ( $settings['children'] as $key => $value ) {   
			if ( is_array($value) && isset( $value['image']['id'] ) ) {
				$post_type = get_post_type( $value['image']['id'] );      
				if ( $post_type ) {
					$translated_id = apply_filters( 'wpml_object_id', $value['image']['id'], $post_type, true );
					$settings['children'][$key]['image']['id'] = $translated_id;
				}
			}
			
		}

        $element->set_settings( 'children', $settings['children'] );
    }
}

I tested that on my local site and found it fixed the issue.

Let me know how it goes.