# Adding New Language

In order to add new language to the template, follow the following steps:-

1\. Make a {new\_locale}.json file in the folder with the path :-

```
src/shared/localization/locales
```

2\. Copy the content of the file 'en-US.json' kept adjacent to the file you made and paste it into your file. The path of file 'en-US.json' is:-

```
src/shared/localization/locales/en_US.json
```

3\. In the next step, you need to translate the values of translation variables into the new language.

```json
  "ecommerce.exclusivePrice": "Price",
  "ecommerce.mrp": "MRP",
  "ecommerce.off": "OFF",
  "ecommerce.addToCompare": "Add to compare",
  "ecommerce.addToCart": "Add to cart",
  "ecommerce.orderSummary": "Order Summary",
```

4\. Now make a new file in the folder with the path:-

```
src/shared/localization/entries
```

The name of the file should be same as the above-created file, just the extension will be different, this will be {new\_locale}.js file, earlier we created {new\_locale}.json file.

Copy the following code, paste it into the newly made file and modify the content according to the changes suggested in the image given below the code.

```javascript
import saMessages from '../locales/es_ES.json';
import {esES} from '@material-ui/core/locale';

const saLang = {
	messages: {
		...saMessages,
	},
	muiLocale: esES,
	locale: 'es',
};
export default saLang;
```

5\. Now go to the file with the following path:-

```
src/@crema/core/AppLngSwitcher/data.js
```

and add the new object corresponding to the new language, code should look something like this:-

```javascript
const languageData = [
  {
    languageId: 'english',
    locale: 'en',
    name: 'English',
  },
  {
    languageId: 'chinese',
    locale: 'zh',
    name: '中国人',
  },
  {
    languageId: 'spanish',
    locale: 'es',
    name: 'Español',
  },
  {
    languageId: 'french',
    locale: 'fr',
    name: 'français',
  },
  {
    languageId: 'italian',
    locale: 'it',
    name: 'Italiano',
  },
  {
    languageId: 'saudi-arabia',
    locale: 'ar',
    name: 'عربي',
  },
  
//New Locale will be add here
];
export default languageData;

```

6\. In the last step, open the file on the path:-

```
src/shared/localization/index.js
```

and add the language code defined in the above step and assign the value of the variable exported in step 4 to this code. Follow the following code for reference:-

```javascript
import enLang from './entries/en-US';
import zhLang from './entries/zh-Hans-CN';
import arLang from './entries/ar_SA';
import itLang from './entries/it_IT';
import esLang from './entries/es_ES';
import frLang from './entries/fr_FR';

const AppLocale = {
  en: enLang,
  zh: zhLang,
  ar: arLang,
  it: itLang,
  es: esLang,
  fr: frLang,
  //New Locale will be add here
};

export default AppLocale;

```