[Resolved] WPML is removing/converting URI encoded HTML in vc_raw_html

Hi,

I got some information from our 2nd tier support, please check this below:

❌ IMPORTANT: Please backup your database and website before proceeding ❌

1. Add the following code to WPML > Setting > Custom XML Configuration:

<wpml-config>
	<shortcodes>
  	<shortcode>
            <tag raw-html="1">vc_raw_html</tag>
        </shortcode>
  </shortcodes>
</wpml-config>

2. Make a small change on the original page and save.

3. Translate the page. The content will be encoded on ATE/CTE but it's displayed correctly on the frontend.

Let me know how it goes.

Hi,

Thank you for your feedback.

I would like to request temporary access (wp-admin and FTP) to your site to take a better look at the issue. It would be better to a testing site where the issue is replicated. Your next reply is set to private to share the info.

❌ IMPORTANT: Please backup your database and website before proceeding ❌
You can use this plugin to create the backup: 
https://wordpress.org/plugins/duplicator/
✙ I would need your permission to de-activate and re-activate Plugins and the Theme and to change configurations on the site if needed. This is also a reason the backup is critical.

You can also check this issue on the sandbox site where I replicate the issue and apply the workaround to fix it.
hidden link

Look forward to your reply.
Thanks

Hi,

I got some information from our 2nd tier support, please check this below.

It's how the "vc_raw_html" element from WP Bakery works. There are also some encoding/decoding snippets on the WPBakery side that are important to make it work. That's why you see the encoded value on CTE (this is how the field is stored in the database).

There isn't an easy way to fix this issue, please try to use the workaround below to create a custom shortcode to display the video and use a custom XML configuration code to register the shortcode attribute for translation.

❌ IMPORTANT: Please backup your database and website before proceeding ❌

1. Add the following code to the functions.php file:

// WPML Workaround for compsupp-6783
function wpml_compsupp6783_video_container_shortcode($atts = []) {
    // Normalize attribute keys, lowercase
    $atts = array_change_key_case((array)$atts, CASE_LOWER);

    // Start output
    ob_start();

    // Start box
    echo '<div class="videoContainerEOW" style="position: relative; padding-top: 56.25%;"><iframe src="' . esc_url($atts['src']) . '" style="border: none; position: absolute; top: 0; left: 0; height: 100%; width: 100%; clip-path: inset(0% 0% 0% 0% round 10px);" allow="accelerometer; gyroscope; autoplay; encrypted-media;" allowfullscreen="true"></iframe></div>';

    // Return output
    return ob_get_clean();
}
add_shortcode('custom_video_container', 'wpml_compsupp6783_video_container_shortcode');

2. Add the following code to WPML > Settings > XML Configuration:

<wpml-config>
  <shortcodes>
    <shortcode>
      <tag>custom_video_container</tag>
      <attributes>
        <attribute>src</attribute>
      </attributes>
    </shortcode>
  </shortcodes>
</wpml-config>

3. Add the shortcode below to the "Text Block" element of WPBakery > Save changes and Update the translation. You can translate the URI in the ATE.

[custom_video_container src="<em><u>hidden link</u></em>"]

Note: I would like to inform you that helping you with custom code, is out of the scope of WPML, but we can suggest you an alternative way to solve the issue.
If you are not able to accomplish this, I would recommend you contact one of our certified partners that will be more than happy to help you with this. In this link you will find a list of our certified partners: https://wpml.org/contractors/

Look forward to your reply.
Thanks

Hi,

You may consider this thread resolved and feel free to create new tickets if you have more questions.

Thanks.