Localization

The default language of the UI is English, but you can choose from over 40 supported languages. If you want to use another language, you have to load its language resources file. Depending on the method of installation, you might want to load language resources using CDN, npm, or Zip package. The language can be then set using the language configuration option.

In the example below, CKBox is configured to use Spanish.

CKBox.mount(document.querySelector('#ckbox'), {
    tokenUrl: 'https://your.token.url',
    language: 'es'
});

If you use CDN, additional language files can be loaded together with CKBox. Use the following URL format to load the language script:
https://cdn.ckbox.io/ckbox/2.8.2/translations/[lang-code].js

<script src="https://cdn.ckbox.io/ckbox/2.8.2/ckbox.js"></script>
<script src="https://cdn.ckbox.io/ckbox/2.8.2/translations/es.js"></script>

If you use CKBox as an npm dependency, you can import the required languages in your application using the following pattern: import 'ckbox/dist/translations/[lang-code]';.

import * as CKBox from 'ckbox';
import 'ckbox/dist/styles/ckbox.css';
import 'ckbox/dist/translations/es';

CKBox.mount(document.querySelector('#ckbox'), {
    tokenUrl: 'https://your.token.url',
    language: 'es',
});

Please note that in this case, it’s still possible to load languages dynamically using the <script> tag.

In the Zip package, language files are located in the ckbox/translations folder and can be loaded together with the CKBox script:

<script src="ckbox/ckbox.js"></script>
<script src="ckbox/translations/[lang-code].js"></script>