Set the locale and units

Set the editor interface language and measurement units with the CreateEditorOptions ui option when you create an editor.

The locale controls editor text and number formatting. The unit controls measurements in the editor UI, such as ruler and page setup values. These settings don’t change document content; they only change the editor interface around it.

Before you start, make sure the Document Authoring library is installed and running in your app. If you haven’t set it up yet, refer to the getting started guide.

The examples omit error handling. Add it before you use this code in production.

Set the locale

Use UIOptions locale to set the editor language. Document Authoring supports en, fr, and de:

const editor = await system.createEditor(document.getElementById('editor'), {
  document: await system.createDocumentFromPlaintext('Bonjour'),
  ui: {
    locale: 'fr',
  },
});

Use auto to follow the user’s browser settings. Document Authoring falls back to the default locale when it doesn’t support the browser language:

const editor = await system.createEditor(document.getElementById('editor'), {
  document: doc,
  ui: {
    locale: 'auto',
  },
});

Set the units

Use UIOptions unit to set the measurement system in the editor UI. Document Authoring supports these values:

• cm
• mm
• in
• pt
• pc

const editor = await system.createEditor(document.getElementById('editor'), {
  document: doc,
  ui: {
    locale: 'de',
    unit: 'cm',
  },
});

This changes how the editor displays measurements. It doesn’t change the document, which stores dimensions in points.

Learn more

Customize actions and the toolbar
Configure the toolbar and actions with the same ui option.

Fonts
Add custom fonts to the system.