How to Add Another Language to Foxit PDF SDK for Web

Foxit PDF SDK for Web enables you to update all of the strings used by the PDF viewer so you can change it to your language. You can easily create a new folder for your own language at the ‘locales’ folder and translate the string content on ‘ui.json’ and ‘viewer.json’ for all objects. By directing your viewer to this JSON file, it will use the new strings in your language. This can work for almost any language provided you go through the strings and translate them to your language. Please follow the steps below to do this.

Assumption

Please ensure you have an assets/in your website root directory, where you will configure the language resources. Let’s call this path websiteRoot/assets/.

Configuration

1) Copy lib/locales inside the SDK to websiteRoot/assets/.

2) Set up the I18N path for loading resources.

new UIExtension.PDFUI({
    i18n: {
        absolutePath: 'websiteRoot/assets/locals'
    },
    // the other options...
});

3) Add more localization languages
Create a new folder in websiteRoot/assets/locals. The folder name should follow the language codes standard, such as zh-CN for Chinese.

Create two new files in that folder:  ui_.json and viewer_.json.The easiest way to generate your own language for the viewer is to copy the entire content of ui_.json and viewer_.json fileS in the en-US or zh-CN folder and copy in your new ui_json/viewer_.json files.

The general format of the ui_.json and viewer_.json files is an unformatted JSON string. You may format this code by yourself to display it better. The sample below just shows the first strings such as the toolbar options and general messages of the ui_.json file as an example:

{
   "retry":{
      "inputPassword":"Please input password.",
      "invalidPassword":"Invalid password"
   },
   "alert":{
      "incorrect-filetype":"Incorrect file type!",
      "openFailed":"File cannot be found or could not be opened.",
      "formatError":"The file format may be invalid or corrupted.",
      "securityError":"The current PDF document is encrypted by some unsupported security handler.",
      "unsupportedStamp":"This file type isn't supported now.",
      "browserNotSupportDownload":"Your browser does not support files downloading. Please try again in desktop browser."
   },
   "toolbar":{
      "tabs":{
         "home":{
            "title":"Home"
         },
         "comment":{
            "title":"Comment"
         },
         "edit":{
            "title":"Edit"
         },
         "protect":{
            "title":"Protect"
         }
      },
...

What you need to is to update all values for the fields to your own language in the file.

4) Set up a default language

new UIExtension.PDFUI({
    i18n: {
        absolutePath: `websiteRoot/assets/locals`,
        lng: 'zh-CN'
},
    // the other options
})

Verify the configuration in a developer environment

1) Clear your browser cache to ensure the latest I18N resources will be loaded.

2) Refresh your browser, open the Network panel in DevTools, and check if the ui_.json request URL points to your custom language path. If yes, then you’re fully set up!