Javascript string translation for wordpress

3.6k views Asked by At

I am using campaign monitor plugin which is not WPML ready, i need to translate error messages in javascript file. This is the chunk of code in app.js file

function cmApp_validateForm()
{

    var signupContainerElem=jQuery("#cmApp_signupContainer");

    var errorElem = jQuery("#cmApp_emailError");
    var errorElemDOB = jQuery("#cmApp_dobError");
    var formElem = signupContainerElem.find("form");
    var processingMsgElem = signupContainerElem.find("div.cmApp_processingMsg");
    var successMsgElem = signupContainerElem.find("div.cmApp_successMsg");


    var errorMsgAr=[];
    var errorFieldSelectorAr=[];

    var errorMsg="";

    formElem.hide();
    errorElem.html("").hide();
    errorElemDOB.html("").hide();
    successMsgElem.hide();

    cmApp_showProcessing();

    signupContainerElem.find("input,select").css("outline","none");

    // validate the email field. make sure it is not empty and that it is valid. if invalid, add to the error array and outline the field in red
    var email = jQuery("#cmApp_signupEmail").val();

    if (email.length < 1) {
        errorMsg = "Geef een geldig e-mailadres in";
        errorMsgAr[errorMsgAr.length]="Please provide correct email";
        jQuery("#cmApp_signupEmail").focus().css("border" , "2px solid #D95350");
    }
    else {
        if (!cmApp_validateEmail(email)) {
            errorMsgAr[errorMsgAr.length]="This is an invalid email";
            errorFieldSelectorAr[errorFieldSelectorAr.length]="#cmApp_signupEmail";
            jQuery("#cmApp_signupEmail").focus().css("border","2px solid #D95350");
        }
    },

I tried to translate using this example to make it available in sting translation.

// Register the script
wp_register_script( 'some_handle', 'path/to/myscript.js' );

// Localize the script with new data
$translation_array = array(
    'some_string' => __( 'Some string to translate', 'plugin-domain' ),
    'a_value' => '10'
);
wp_localize_script( 'some_handle', 'object_name', $translation_array );

// Enqueued script with localized data.
wp_enqueue_script( 'some_handle' );

But i do not understand what should i fill in 'some handle' and what should be the objectname? Or is there any simple method to translate this?

Could anyone explain how can i translate these error text?

Thank you in advance.

1

There are 1 answers

2
TurtleTread On

'some_handle' is just the name you use to register your script through WordPress, can be whatever, just make sure the handle follows rules like no space, etc.

'object_name' is the JavaScript variable name that's going to be declared as the translation object.

e.g.

$translate_array['a'] = __('string_a'); 

If your object name is 'translation_obj', you would be able to retrieve translation_obj.a in your client-side JavaScript.

The translation is done by WordPress and its multi-lingual plugin that you choose. Read more on internationalization: https://codex.wordpress.org/I18n_for_WordPress_Developers.