Internationalization
Nectar is multi-lingual. It supports Internationalization (i18n) and Right-to-Left languages such as Arabic, Hebrew etc.
By default, Nectar is configured for internationalization. The primary language is set to English
en
The translation files in JSON format are present inside
/assets/custom/i18n
folder.To change the primary language from English to other language (suppose French), follow these steps:
- 1.Open
/assets/custom/js/config.js
file. - 2.Inside
window.config.i18n = {
changelang: 'en'
tolang: 'fr'
and keepdir: 'ltr'
as it is. - 3.Go to
/assets/custom/i18n/
and create a new json file with the namefr.json
and write the translations. - 4.Now open
/assets/custom/js/init.js
file. - 5.Go to
initializeI18n();
function. - 6.Inside this function change
whitelist: ['en', 'hi', 'ar']
to the languages your app supports, for example,whitelist: ['fr', 'en']
. Similarly changepreload: ['en', 'hi', 'ar']
towhitelist: ['fr', 'en']
- 7.Open index.html file change
<html lang="en" dir="ltr">
to<html lang="fr" dir="ltr">
In case your primary language is RTL such as Arabic, you will need to make an additional change in index.html file.
Inside index.html file, change
<link class="f7" rel="stylesheet" href="assets/vendor/framework7/css/framework7.min.css" />
to <link class="f7" rel="stylesheet" href="assets/vendor/framework7/css/framework7.rtl.min.css" />
If your app has both LTR and RTL languages, then the app would restart when the user switches from
LTR to RTL
or vice versa. This is because Framework7 requires to reinitialize for making the changes effective. This is not the case for LTR to LTR
or RTL to RTL
switching.Last modified 4yr ago