Adding New Language

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

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.

  "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.

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:-

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:-

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;