Language of the nuvo importer
languageβ
Type | "en" , "de" , "es" , "pt" , "pl" , "fr" , "it" , "nl' , or "sv" |
Default | en |
Description | This feature enables you to choose the default language for the nuvo Importer, which can be tailored to your particular requirements. Additionally, you have the option to switch languages dynamically before initializing the importer. We currently offer support for a variety of languages, including English, German, Spanish, Portuguese, Polish, French, Italian, Dutch, and Swedish. |
Below, you can see an example of how to use it.
- React
- Angular
- Vue.js 2
- Vue.js 3
- JavaScript
<NuvoImporter
licenseKey="Your License Key"
settings={{
developerMode: true,
identifier: "product_data",
language: "de"
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
],
}}
>
Select File
</NuvoImporter>
licenseKey!: string
settings!: SettingsAPI;
ngOnInit(): void {
this.licenseKey = "Your License Key"
this.settings = {
developerMode: true,
identifier: "product_data",
language: "de"
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
]
};
}
export default {
name: "App",
components: {
NuvoImporter,
},
data: () => {
return {
licenseKey: "Your License Key",
settings: {
developerMode: true,
identifier: "product_data",
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
],
language: "de",
},
};
},
};
export default {
name: "App",
components: {
NuvoImporter,
},
setup() {
const settings = {
developerMode: true,
identifier: "product_data",
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
],
language: "de",
};
return { settings };
},
data: () => {
return {
licenseKey: "Your License Key",
};
},
};
<script type="text/javascript">
const settings = {
developerMode: true,
identifier: "product_data",
language: "de",
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
],
};
</script>
i18nOverridesβ
The i18nOverrides
feature in the NuvoImporter
enables you to customize the application's default language keys according to your unique requirements. You can override the language keys for each language by using the i18nOverrides
option in the settings
of the NuvoImporter
.
Below, you can see an example of how to use it.
- React
- Angular
- Vue.js 2
- Vue.js 3
- JavaScript
<NuvoImporter
licenseKey="Your License Key"
settings={{
developerMode: true,
identifier: "product_data",
i18nOverrides: {
txt_page_upload_desc: "Hi there π",
},
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
],
}}
>
Select File
</NuvoImporter>
licenseKey!: string
settings!: SettingsAPI;
ngOnInit(): void {
this.licenseKey = "Your License Key"
this.settings = {
developerMode: true,
identifier: "product_data",
i18nOverrides: {
"txt_page_upload_desc": "Hi there π"
}
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
]
};
}
export default {
name: "App",
components: {
NuvoImporter,
},
data: () => {
return {
licenseKey: "Your License Key",
settings: {
developerMode: true,
identifier: "product_data",
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
],
i18nOverrides: {
txt_page_upload_desc: "Hi there π",
},
},
};
},
};
export default {
name: "App",
components: {
NuvoImporter,
},
setup() {
const settings = {
developerMode: true,
identifier: "product_data",
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
],
i18nOverrides: {
txt_page_upload_desc: "Hi there π",
},
};
return { settings };
},
data: () => {
return {
licenseKey: "Your License Key",
};
},
};
<script type="text/javascript">
const settings = {
developerMode: true,
identifier: "product_data",
i18nOverrides: {
"txt_page_upload_desc": "Hi there π"
}
columns: [
{
label: "Product ID",
key: "product_id",
},
{
label: "Article Name",
key: "article_name",
},
],
};
</script>
Multilingual applicationβ
The i18nOverrides
feature also works with multilingual applications. You can easily customize the language keys for each language, ensuring a consistent user experience across all languages.
Here is an example of how to use i18nOverrides
inside a multilingual application:
i18nOverrides: {
"de": {
"txt_upload_data": "Hochladen",
"txt_allow_data_type": "Datei zum Hochladen hierher ziehen",
"txt_select_files": "Datei auswΓ€hlen"
},
"en": {
"txt_upload_data": "Upload",
"txt_allow_data_type": "Drop your file here",
"txt_select_files": "Select file"
},
"es": {
"txt_upload_data":"Subir",
"txt_allow_data_type":".xls, .xlsx, .csv, .xml y .json archivo aceptado.",
"txt_select_files":"Seleccione Archivo"
}
}
In the example code above, we have defined i18n overrides for English (en), German (de), and Spanish (es). By following the same pattern, you can easily add more language overrides to meet your specific needs.
It's worth noting that the overrides will automatically be applied to the default language defined in the settings
of the NuvoImporter
. This means that any language key that is not overridden will be displayed in the default language. With this level of customization, you can ensure a consistent and tailored user experience for all users, regardless of their language preferences.
i18n keysβ
To help you finding the correct i18n keys faster, you can take a look at our default translation templates below:
Translations | Download |
---|---|
English | download |
German | download |
Dutch | download |
Italian | download |
Swedish | download |
Portuguese | download |
Polish | download |
French | download |
Spanish | download |
If you have any questions or your language still needs to be included inside the language property, please get in touch with us at [email protected].