Change the language of the nuvo importer

If you want to change the user interface texts for supporting multiple languages or use custom texts, you can do that with the i18nOverrides option in settings of the NuvoImporter.

To implement text customizations, please use the i18nOverrides property. You can see below an example how to use it:

React

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

Angular

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",
      },
    ]
  };
}

Vue.js 2

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 🙏",
        },
      },
    };
  },
};

Vue.js 3

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",
    };
  },
};

JavaScript

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

The i18nOverrides class has a key for each customizable text. The following displays some examples:

i18nOverrides: {
  "txt_upload_data": "Upload",
  "txt_allow_data_type": "Drop your file here",
  "txt_back": "Back",
  "txt_continue": "Continue",
  "txt_data_processing": "Data is processing...",
  "txt_field_category_required": "Select an option",
  "txt_progress_review_entries": "Review Entries",
  "txt_title_submit_success": "Congrats, your data has been uploaded."
}

Here, you can access a comprehensive list of all languages along with their corresponding i18n translations.

Translations	Download
English	download
German	download
Dutch	download
Italien	download
Swedish	download
Portuguese	download
Polish	download
French	download
Spanish	download

---

If you have any questions or need a complete translation to another language, please get in touch with us at [email protected].