Skip Navigation

This is the technical support forum for WPML - the multilingual WordPress plugin.

Everyone can read, but only WPML clients can post here. WPML team is replying on the forum 6 days per week, 22 hours per day.

This topic contains 23 replies, has 4 voices.

Last updated by usahello 1 year, 11 months ago.

Assigned support staff: Raja Mohammed.

Author Posts
April 2, 2019 at 12:22 am #3512229

heidiS-4

1. This example (hidden link), provided in the form of a WordPress plugin, is a dynamic block. Judging from the source code, WPML does not even attempt to handle dynamic blocks for translation. This is unacceptable for our requirements for a number of reasons. Dynamic blocks are a core feature of WordPress and therefore should be supported by WPML based on this release https://wpml.org/2018/11/wpml-4-1-adds-gutenberg-compatibility/ that indicated complete compatibility.

2. There are a number of issues with static blocks that are much more difficult to illustrate with a simple example (or even a dozen simple examples). But essentially they all come down to choices that WPML has made in their parsing engine. Here is a very simple code example from the WPML plugin:

 
    private function get_inner_HTML( DOMNode $element ) {
        $innerHTML = "";
        $children  = $element->childNodes;
        foreach ( $children as $child ) {
            $innerHTML .= $element->ownerDocument->saveHTML( $child );
        }
 

WPML uses a list of xpath queries from our developer-supplied wpml-config.xml file to retrieve HTML elements and transform them into strings for their translation functionality. The above is the start of the PHP function that gets a string from an html element found via xpath query. In the code, it assumes that each element will have a child node (

$children  = $element->childNodes;

). Unfortunately, this causes errors even for valid xpath queries. For example, this query works with WMPL code:

<xpath>//h2[@slot="pacsys-carousel-content-eyebrow"]</xpath>
 

However, this query (although it is valid), fails:

 
<xpath>//h2[@slot="pacsys-carousel-content-eyebrow"]/text()</xpath>
 

We believe that the issues lie in this parsing code

April 2, 2019 at 12:03 pm #3516829

Raja Mohammed
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hi There,

I have checked your code, However, I am not sure about the purpose can you please explain the steps how to use the example plugin. I have tried it a sandbox installation it's showing me login pop since the code calls for user capability.

I can also see the code uses ACF fields, Can you please clarify whether the Dynamic content is not handled by WPML or certain fields?

If you are using ACF fields then You should also use our Advanced Custom Field Multilingual plugin which serves as a glue plugin to translate ACF plugins. Can you please confirm the version of ACF plugin and the ACFML installed in your site.

Can you please help us isolate the issue, Try to reproduce the issue in the clean installation hidden link you will have access to WPML and its add-ons, Please complete the configuration and let you know, How we can reproduce the issue.

For support rules, I would request you to continue with the dynamic block issue in this thread.

Let me know the results

Kind regards
Raja

April 9, 2019 at 1:59 pm #3567665

heidiS-4

We’ve uploaded our example plugin to their sandbox environment and created an example post for them to inspect: hidden link

To clarify, the code Gutenberg block code that we are attempting to illustrate does not use ACF. I have removed the ACF calls from the plugin entirely for clarity. Additionally, the supplied example code does not call for any user capability beyond standard WordPress editing that any WPML translation would need.

The first problem: We are using dynamic blocks (https://wordpress.org/gutenberg/handbook/designers-developers/developers/tutorials/block-tutorial/creating-dynamic-blocks/) and the render_callback function to output content edited within the Gutenberg interface. Here are some articles illustrating use-cases similar to ours:

● How to make a dynamic WordPress Gutenberg block with server side rendering (hidden link)
● Rendering Dynamic Gutenberg Blocks in Theme Template Parts – John Blackbourn (hidden link)

Under the conditions illustrated by the example code and the above articles, WPML does not translate any of the block content. Unless I am missing something when reading the WPML source code, this is because WPML relies on parsing static html block content instead of the saved block attributes. If you look at the database content of a statically rendered block, you see something like this:

<!-- wp:pacsys/pacsys-carousel-content {"pacsysCarouselContent":{"pacsysCarouselContentEyebrow":"Test ","pacsysCarouselContentHeading":"Heading Test","pacsysCarouselContentSubheading":"Subheading Test"}} -->
<pacsys-carousel-content heading-color="primary" align-items="left" content-background-image-url-small="undefined || '' " content-background-image-url-large="undefined || ''" data-image-id="undefined" class="wp-block-pacsys-pacsys-carousel-content"><h2 slot="pacsys-carousel-content-eyebrow">Test </h2><h1 slot="pacsys-carousel-content-heading">Heading Test</h1><h2 slot="pacsys-carousel-content-subheading">Subheading Test</h2><div slot="pacsys-carousel-content-body"></div><pacsys-cta-link slot="pacsys-cta-link" link-type="text" link-style="text" link-target="_self"><span slot="pacsys-link-text"></span></pacsys-cta-link><pacsys-cta-link slot="pacsys-cta-link" link-type="text" link-style="text" link-target="_self"><span slot="pacsys-link-text"></span></pacsys-cta-link></pacsys-carousel-content>
<!-- /wp:pacsys/pacsys-carousel-content →

There is plenty of HTML there to parse. However with dynamic blocks, this is what the database content looks like:

<!-- wp:pacsys/pacsys-carousel-content {"pacsysCarouselContent":{"pacsysCarouselContentEyebrow":"Test","pacsysCarouselContentHeading":"Test Title","pacsysCarouselContentSubheading":"Test Subheading"}} /-->

In this second case, WPML attempts to parse the html (which doesn’t exist since it’s being rendered in PHP) and fails to translate any of the attributes.
The second problem is that even when we do use static blocks, WPML does not parse them properly due to this code in the plugin source:

private function get_inner_HTML( DOMNode $element ) {
    $innerHTML = "";
    $children = $element->childNodes;
    foreach ( $children as $child ) {
        $innerHTML .= $element->ownerDocument->saveHTML( $child );
    }

As stated previously, WPML uses a list of xpath queries from our developer-supplied wpml-config.xml file to retrieve HTML elements and transform them into strings for their translation functionality. The above is the start of the PHP function that gets a string from an html element found via xpath query.

In the code, it assumes that each element will have a child node (

$children = $element->childNodes;

). Unfortunately, this causes errors even for valid xpath queries. For example, this query works with WMPL code:

<xpath>//h2[@slot="pacsys-carousel-content-eyebrow"]</xpath>
However, this query (although it is valid), fails:
<xpath>//h2[@slot="pacsys-carousel-content-eyebrow"]/text()</xpath>
April 10, 2019 at 4:44 pm #3578865

Raja Mohammed
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hi there,

I check the Sandbox site and tried to create a translation. I can confirm that the content is not available for translation while using WPML Translation Editor. I think this might be something to do with the configuration or the PHP rendering.

I'm checking this with the second tier of supporters, I will update you once I hear from them.

Kind regards
Raja

April 13, 2019 at 12:03 am #3602389

heidiS-4

Thank you for looking into this. Any update?

April 15, 2019 at 4:01 am #3609613

Raja Mohammed
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hi there,

The issue is now escalated to our developers, we have not thought about this use case until now, Thanks for bringing it to our attention. Since the block is generated at runtime this needs to be handled differently to make the block translation ready.

I have added this ticket to our developers' queue I will update you once I hear from them.

Kind regards
Raja

April 15, 2019 at 11:18 am #3612909

heidiS-4

Sounds good. Will check back soon.

April 30, 2019 at 3:19 am #3707757

heidiS-4

Any update?

May 2, 2019 at 12:49 pm #3724631

heidiS-4

Do you have an update?

May 2, 2019 at 1:02 pm #3724667

Raja Mohammed
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hi,

Sorry, I missed your previous message, Thanks for the followup, Our developers are working towards adding compatibility for dynamic blocks since the scope of the dynamic block are numerous, We are approaching a generic approach to make it widely compatible with WPML. I am following the ticket I will update you once the development reaches the production phase.

Thanks for your understanding.

Kind regards
Raja

May 31, 2019 at 10:57 am #3929963

Raja Mohammed
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

Hi there,

Our developers have developed a way to translate these type of blocks, which will be available in our next stable release.

However, the plugin you have shared is not working with the latest version of WordPress 5.2.1 please check the sandbox site. hidden link

Please share with us the updated version of the plugin which works with WordPress 5.2.1, You can upload the updated plugin to the above sandbox installation. this will help us complete the testing process.

Please let me know once the updated plugin is updated to the sandbox site.

Kind regards
Raja

June 10, 2019 at 9:07 pm #3990417

billL-7

Hi Raja,

Is this dynamic block translation feature currently available in a beta version of WPML?

Thanks

September 17, 2019 at 2:36 am #4584999

usahello

I'd also like to know what the status of the WPML dynamic block translation feature. It is essential at this point for a lot of developers. Do you all have an update of when it will be available? I just downloaded the beta version of WPML Multilingual CMS 4.3.0-b.8 (as well as the String Translation and Translation Management beta releases), but that didn't allow me to translate my dynamic custom block.

September 17, 2019 at 4:08 am #4585527

Raja Mohammed
Supporter

Languages: English (English )

Timezone: Asia/Kolkata (GMT+05:30)

@jessicam-13 Please let me know the exact type of block you are using and how they are rendered in the backend.

September 17, 2019 at 4:37 am #4585581

usahello

Raja, it is a custom dynamic block that I built (the save output happens via render_callback and PHP as per WordPress documentation). Everything functions as desired in the editor and on the front-end, but none of the fields show up in the translation editor even when defined in my wpml-config.xml file. Other non-dynamic blocks that I've built show up for translation just fine when the fields are mapped in the XML configuration file.

Anyway, this is what the post_content looks like for the dynamic block in the database: hidden link

Here is the PHP code that registers the block and handles the render_callback: hidden link

Here is the Javascript that handles the WordPress editor registration and edit() functionality: hidden link

The topic ‘[Closed] Dynamic block translation’ is closed to new replies.