Skip to main content
Contact SalesFree Trial
Contact SalesFree Trial
Language:

Adding and Using Variables

The CreativeEditor SDK can be configured to offer a set of variables that can then be used by users during text editing.

Explore a full code sample of the integration on CodeSandbox or view the code on GitHub.

Added variables are directly accessible from the text canvas actions:



Configuring Custom Variables#

You can define your custom variables in the configuration under variables. The keys of this object should be i18n localization keys and the contained items of the following structure:

  • value: string describes the value to insert into the text when using this variable.

Localizing Variable Keys#

You can show localized labels for the registered variables to your users by adding a corresponding label property to the object stored at i18n.<language>.variables.<key>.label. Otherwise, the key used in variables will be shown.

File:


import 'https://cdn.img.ly/packages/imgly/cesdk-js/1.10.0/cesdk.umd.js';


let config = {
  baseURL: 'https://cdn.img.ly/packages/imgly/cesdk-js/1.10.0/assets',
  variables: {
    my_custom_variable: {
      value: 'IMG.LY'
    }
  },
  i18n: {
    en: {
      'variables.my_custom_variable.label': 'My Variable'
    }
  }
};


CreativeEditorSDK.init('#cesdk_container', config).then((instance) => {
  /** do something with the instance of CreativeEditor SDK **/
});