I'm working in a plugin (My first plugin) that uses autocomplete (Via JQuery UI) via an array and I'm wondering if I have to translate the array too if I want to make my plugin fully translatable.

jQuery(function(){ 
   let supportedServices = [
    'Academia', 'Airbnb', 'Amazon', 'AppStore', 'Bandcamp', 'Blogger',
   ];

   jQuery('#service_name ').autocomplete({
    source: supportedServices,
    classes: {
     "ui-autocomplete": "contactmefy_ui_autocomplete"
    },
    select: SomeFunction,
   });
});

In that case, it's a good idea to use the new wp-i18n JavaScript package? Internationalization in WordPress 5.0

I'm working in a plugin (My first plugin) that uses autocomplete (Via JQuery UI) via an array and I'm wondering if I have to translate the array too if I want to make my plugin fully translatable.

jQuery(function(){ 
   let supportedServices = [
    'Academia', 'Airbnb', 'Amazon', 'AppStore', 'Bandcamp', 'Blogger',
   ];

   jQuery('#service_name ').autocomplete({
    source: supportedServices,
    classes: {
     "ui-autocomplete": "contactmefy_ui_autocomplete"
    },
    select: SomeFunction,
   });
});

In that case, it's a good idea to use the new wp-i18n JavaScript package? Internationalization in WordPress 5.0

• plugins
• javascript
• translation
• autocomplete

1 Answer 1

And I'm wondering if I have to translate the array too if I want to make my plugin fully translatable.

It wouldn't be fully translatable if you didn't, would it? So yes, you need to make these translatable for that to be true.

In that case, it's a good idea to use the new wp-i18n JavaScript package? Internationalization in WordPress 5.0

It could be, yes. The previous way, which still works, is what wp_localize_script() is for. For example, if you enqueue this script like this:

wp_enqueue_script( 'my-plugin', // etc. etc.

Then you can provide translatable strings like this:

wp_localize_script(
    'my-plugin',
    'myPlugin',
    [
        'supportedServices' => [
            __( 'Academia', 'my-plugin' ),
            __( 'Airbnb', 'my-plugin' ),
            __( 'Amazon', 'my-plugin' ),
            __( 'AppStore', 'my-plugin' ),
            __( 'Bandcamp', 'my-plugin' ),
            __( 'Blogger','my-plugin' ),
        ],
    ]
);

The supported service names would now be translatable in PHP, but you can access them in JavaScript like this:

let supportedServices = myPlugin.supportedServices;