Translations not making it into Block UI but work in the rest of the plugin

admin管理员组

文章数量:1122846

I'm currently flummoxed by a translation issue I've run into with a Block inside of my plugin.

Both myself and the developer who did most of the work on the Block portions of the plugin have been unable to figure out what's wrong so far.

The plugin has been translated into a couple of languages and these translations have always worked well inside of the plugin so far.

However, we recently added a Block UI to the plugin and the block UI never loads the translations.

We've got a wp_set_script_translations call after the Block script is registered and it references the same handle as the script. There's definitely the necessary translation files in the references languages directory, etc...

But when you're in the WP Admin panel and editing a post the Block UI still only shows in English.

I looked at the page source and noticed that there's an i18n call for other blocks with a JSON string containing all of the translation values and there is not one for my plugin.

The plugin code that handles registering the script and setting the translation looks like this and is called on init:

// Register editor script.
wp_register_script(
    'm-chart-editor',
    m_chart()->plugin_url . '/components/block/index.js',
    [ 'wp-i18n' ],
    $this->version_str(),
    true
);

// Set editor script translation.
wp_set_script_translations(
    'm-chart-editor',
    'm-chart',
    plugin_dir_path( __DIR__ ) . 'components/languages/'
);

Nothing super unusual going on. I checked the paths and both paths are correct.

At this point I'm gonna start digging through the wp_set_script_translations method and track down where the i18n JSON stuff is coming from to see if I can figure out why our translations aren't loading.

But hoping someone might have run into this before and can point me in there right direction as to where the problem might be occurring.

I'm currently flummoxed by a translation issue I've run into with a Block inside of my plugin.

Both myself and the developer who did most of the work on the Block portions of the plugin have been unable to figure out what's wrong so far.

The plugin has been translated into a couple of languages and these translations have always worked well inside of the plugin so far.

However, we recently added a Block UI to the plugin and the block UI never loads the translations.

We've got a wp_set_script_translations call after the Block script is registered and it references the same handle as the script. There's definitely the necessary translation files in the references languages directory, etc...

But when you're in the WP Admin panel and editing a post the Block UI still only shows in English.

I looked at the page source and noticed that there's an i18n call for other blocks with a JSON string containing all of the translation values and there is not one for my plugin.

The plugin code that handles registering the script and setting the translation looks like this and is called on init:

// Register editor script.
wp_register_script(
    'm-chart-editor',
    m_chart()->plugin_url . '/components/block/index.js',
    [ 'wp-i18n' ],
    $this->version_str(),
    true
);

// Set editor script translation.
wp_set_script_translations(
    'm-chart-editor',
    'm-chart',
    plugin_dir_path( __DIR__ ) . 'components/languages/'
);

Nothing super unusual going on. I checked the paths and both paths are correct.

At this point I'm gonna start digging through the wp_set_script_translations method and track down where the i18n JSON stuff is coming from to see if I can figure out why our translations aren't loading.

But hoping someone might have run into this before and can point me in there right direction as to where the problem might be occurring.

• plugin-development
• block-editor
• translation

Share Improve this question asked May 5, 2024 at 22:13 Jamie PoitraJamie Poitra 101 3

• How does the script get enqueued into the block editor? Is the m-chart-editor handle used for a block's editorScript (or equivalent)? Or do you not mean a block when you say "block UI"? If not, what is your block UI? Are you using the internationalization functions from wp-i18n to get translated strings in the JavaScript file? – Wongjn Commented May 6, 2024 at 11:35
• Yes, sorry should have been more explicit about that. But, yes the m-chart-editor script is enqueued via its handle. And in the script we're importing the i18n __ function and using it in all instances of the text we want translated. As far as I can tell we've done it, all correctly, but there's obviously something we've missed. I'm just not clear on what it is. – Jamie Poitra Commented May 6, 2024 at 17:44
• The most recent branch of the plugin can be found here: github.com/methnen/m-chart/tree/1.11.1 And block stuff is all in the block, block-src directories and it gets loaded via the class-m-chart-block.php file. If you'd like to see it all in full context. – Jamie Poitra Commented May 6, 2024 at 17:45

Add a comment  | 

1 Answer 1

Sorted by: Reset to default 1

It seems like you do not have any JavaScript localization files to use with wp_set_script_translations(). If we consult the Gutenberg/JavaScript documentation for internationalization:

The translation files must be in the JED 1.x JSON format.

[…]

<?php
function myguten_set_script_translations() {
  wp_set_script_translations( 'myguten-script', 'myguten', plugin_dir_path( __FILE__ ) . 'languages' );
}
add_action( 'init', 'myguten_set_script_translations' );

WordPress will check for a file in that path with the format ${domain}-${locale}-${handle}.json as the source of translations. Alternatively, instead of the registered handle you can use the md5 hash of the relative path of the file, ${domain}-${locale} in the form of ${domain}-${locale}-${md5}.json.

Checking the branch you supplied, I do not see any candidate .json files in the path you called wp_set_script_translations() with that could be used as JavaScript translations.

本文标签： Translations not making it into Block UI but work in the rest of the plugin