Update i18n module doc about adding new language

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]: <https://en.wikipedia.org/wiki/List_of_ISO_639-1_codes>
+[`en` locale file]: <https://github.com/artf/grapesjs/blob/master/src/i18n/locale/en.js>

package.json

@@ -71,7 +71,8 @@
             "> 1%",
             "ie 11",
             "safari 8"
-          ]
+          ],
+          "modules": false
         }
       ]
     ],

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