Languages

Overview

Article Editor is made that all the words or sentences in it can be translated into any language. The default language is English.

To translate, you can download a file with English as an example and replace words and phrases in your language.

Download en.js

Language setting

To set the language in the editor, the translation file must be connected after the JS editor file. For example:

<!-- article editor js file -->
<script src="/your-folder/article-editor.min.js"></script>

<!-- language file -->
<script src="/your-folder/de.js"></script>

Now when you call the editor, specify your language in the settings, for example:

<script>
 ArticleEditor('#entry', {
    css: '/your-article-dist-path/',
    editor: {
        lang: 'de'
    }
});
</script>

Plugin translation

The easiest way to translate a plugin is to add language variables directly to its code, using the translations object.

For example:

ArticleEditor.add('plugin', 'myplugin', {
    translations: {
        en: {
            "myplugin": {
                "get-code": "Get Code",
                "set-code": "Set Code"
            }
        },
        de: {
            "myplugin": {
                "get-code": "Code abrufen",
                "set-code": "Code einstellen"
            }
        }
    },
    start: function() {
        // get the language variable
        var value = this.lang.get('myplugin.get-code');

        // parse a string with language variable
        var str = this.lang.parse('My string with  variable.');
    }
});

In the same example, in the start method, you can see how to access the language variables in the plugin and how to convert the variable if it is in a text string.

You can see how to specify language variables in the plugin, using the example of the Inline Format plugin.

The addLang method

There is a second way to translate plugins or to add the language variables to the editor. This is the ArticleEditor.addLang method. For example, you can specify for it a language index and an object with variables that will be added to this language:

ArticleEditor.addLang('de', {
    "myplugin": {
        "get-code": "Code abrufen",
        "set-code": "Code einstellen"
    }
});

Now the specified variables will be available in the editor language object and you can get them using the this.lang.get method, for example:

var value = this.lang.get('myplugin.get-code');