diff --git a/docs/modules/I18n.md b/docs/modules/I18n.md index 0c6f047e82..253cd169ee 100644 --- a/docs/modules/I18n.md +++ b/docs/modules/I18n.md @@ -9,7 +9,7 @@ The **I18n** module allows the internalization and updates of strings in the edi ::: warning This guide is referring to GrapesJS v0.15.9 or higher -The module was added recently so we're open to receive help in translating strings in other languages. Your help will be much appreciated! +The module was added recently so we're open to receive help in [translating strings in other languages](#adding-new-language). Your help will be much appreciated! ::: [[toc]] @@ -19,7 +19,7 @@ The module was added recently so we're open to receive help in translating strin ## Configuration By default, the editor includes only the English language, if you need other languages you have to import them manually. -**Note**: The language code is defined in the [ISO 639-1](https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes) standard. +**Note**: The language code is defined in the [ISO 639-1] standard. ```js import grapesjs from 'grapesjs'; @@ -44,7 +44,7 @@ Now the editor will be translated in Italian for those browsers which default la ## Update strings If you need to change some default language strings you can easily update them by using [I18n API](/api/i18n.html). -To find the correth path of the string you can check the [`en` locale file](https://github.com/artf/grapesjs/blob/master/src/i18n/locale/en.js) and follow its inner path inside the locale object. +To find the correth path of the string you can check the [`en` locale file] and follow its inner path inside the locale object. Let's say we want to update the default message of the empty state in Style Manager when no elements are selected. @@ -137,6 +137,21 @@ We need to find the way to update the UI --> + +## Adding new language + +If you want to support GrapesJS by adding a new language to our repository all you need to do is to follow steps below: + +1. First of all, be sure to check the language file in [`src/i18n/locale`](https://github.com/artf/grapesjs/blob/master/src/i18n/locale) doesn't exist already +1. [Open a new issue](https://github.com/artf/grapesjs/issues/new?title=XX%20Language%20support) to avoid overlap with other contributos. To be sure, check also no one else has opened already an issue for the same language +1. Start a new branch from `dev` +1. Copy (in the same folder) and rename the [`en` locale file] to the name of your language of choice (be sure to be compliant to [ISO 639-1]) +1. Now you can start translating strings +1. By following comments you'll probably notice that some keys are not indicated (eg. `styleManager.properties`), for the reference you can check other locale files +1. Once you've done, you can create a new Pull Request on GitHub from your branch to `dev` by making also a reference to your issue in order to close it automatically once it's merged (your PR message should contain `Closes #1234` where 1234 is the issue ID) + + + ## Plugin development ::: warning @@ -217,3 +232,5 @@ const editor = grapesjs.init({ }); ``` +[ISO 639-1]: +[`en` locale file]: \ No newline at end of file diff --git a/package.json b/package.json index 6dfe533e04..03cab93ff6 100644 --- a/package.json +++ b/package.json @@ -71,7 +71,8 @@ "> 1%", "ie 11", "safari 8" - ] + ], + "modules": false } ] ], diff --git a/src/i18n/locale/en.js b/src/i18n/locale/en.js index 1c33d6d33c..4ea20906c4 100644 --- a/src/i18n/locale/en.js +++ b/src/i18n/locale/en.js @@ -74,13 +74,16 @@ export default { traits: { // The core library generates the name by their `name` property labels: { + // id: 'Id', + // alt: 'Alt', // title: 'Title', + // href: 'Href', }, // In a simple trait, like text input, these are used on input attributes attributes: { - title: traitInputAttr, - alt: traitInputAttr, id: traitInputAttr, + alt: traitInputAttr, + title: traitInputAttr, href: { placeholder: 'eg. https://google.com' } }, // In a trait like select, these are used to translate option names