---
title: "Interface: IConfiguration | Customer's Canvas On-Premises"
canonical: "https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IConfiguration/"
---

# Interface: IConfiguration

> A structure containing the web-to-print editor configuration.

## Remarks

Extends [IUiConfig](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).

## Example

``` js
   // Defining the editor configuration.
   var configuration = {
       canvas: {
           color: "grey"
       },
       grid: {
           stepX: 0.5,
           stepY: 0.5
       },
       initialMode: "Advanced",
       customStyle: "mySiteStyles",
       rendering: {
           proofImageMockupEnabled: false
       },
       userInfo: {
           "FirstName": "John",
           "LastName": "Wood",
           "Phone": "1234567890"
       },
       widgets: {
           ObjectInspector: {
               dndEnabled: false
           }
       },
       tokenId: "95c16577-75fe-4145-87ff-c0ba49d1a554"
   };

   // Loading the editor with the given configuration.
   var editor = await CustomersCanvas.IframeApi.loadEditor(iframe, productDefinition, configuration);
```

## Extends

- [`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`IPublicApiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IPublicApiConfig.md)

## Properties

### defaultLanguage?

> `optional` **defaultLanguage?**: `string`

A default interface language. The default value is `"en"`. For details, see the [Localization https://customerscanvas.com/dev/editors/iframe-api/customization/localization.html\|Localization](https://customerscanvas.com/dev/editors/iframe-api/customization/localization.html) topic.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`defaultLanguage`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#defaultlanguage)

***

### canvas?

> `optional` **canvas?**: [`ICanvasConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.ICanvasConfig.md)

A structure containing canvas settings.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`canvas`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#canvas)

***

### grid?

> `optional` **grid?**: [`IGridConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IGridConfig.md)

The grid configuration. For details, see the  [Grid https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/rulers-grids-snaplines.html\|Grid](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/rulers-grids-snaplines.html) topic.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`grid`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#grid)

***

### watermark?

> `optional` **watermark?**: [`IWatermarkConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IWatermarkConfig.md)

The watermark configuration.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`watermark`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#watermark)

***

### alignToSafetyLineName?

> `optional` **alignToSafetyLineName?**: `string`

A name of a safety line to which an item will be aligned; if there is no safety line with the name, then the item will be aligned to the first safety line in the safety lines array. The default value is `"bleed"`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`alignToSafetyLineName`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#aligntosafetylinename)

***

### initialMode?

> `optional` **initialMode?**: [`ModelModeType`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/types/ConfigurationTypes.ModelMode.ModelModeType.md)

The initial mode of the editor, either `"Simple"` or `"Advanced"`. The default value is `"Simple"`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`initialMode`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#initialmode)

***

### canvasOnlyMode?

> `optional` **canvasOnlyMode?**: `boolean`

The edit mode allowing you to hide all interface elements but the canvas. The default value is `false`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`canvasOnlyMode`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#canvasonlymode)

***

### loadUserInfoButtonEnabled?

> `optional` **loadUserInfoButtonEnabled?**: `boolean`

Displays the **Load my info** button. The default value is `false`. For details, see the [Populating designs with user info](https://customerscanvas.com/dev/editors/iframe-api/howto/user-info.html) topic.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`loadUserInfoButtonEnabled`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#loaduserinfobuttonenabled)

***

### autoLoadUserInfo?

> `optional` **autoLoadUserInfo?**: `boolean`

If `true`, then a product is automatically populated with predefined data when it is loaded into the editor; the **Load my info** button is not displayed. The default value is `false`. For details, see the [Populating designs with user info](https://customerscanvas.com/dev/editors/iframe-api/howto/user-info.html) topic.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`autoLoadUserInfo`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#autoloaduserinfo)

***

### imageEditorEnabled?

> `optional` **imageEditorEnabled?**: `boolean`

Enables the Image Editor. The default value is `true`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`imageEditorEnabled`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#imageeditorenabled)

***

### deleteItemConfirmationEnabled?

> `optional` **deleteItemConfirmationEnabled?**: `boolean`

Enables the confirmation dialog when deleting an item from a product. The default value is `false`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`deleteItemConfirmationEnabled`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#deleteitemconfirmationenabled)

***

### revertProductConfirmationEnabled?

> `optional` **revertProductConfirmationEnabled?**: `boolean`

Enables the confirmation dialog when reverting a product to its initial state. The default value is `true`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`revertProductConfirmationEnabled`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#revertproductconfirmationenabled)

***

### restoreProductOnReloadEnabled?

> `optional` **restoreProductOnReloadEnabled?**: `boolean`

Enables restoring a product state when the design page is reloaded in the browser; if `false`, the product is reverted on reloading. The default value is `false`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`restoreProductOnReloadEnabled`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#restoreproductonreloadenabled)

***

### spellCheckEnabled?

> `optional` **spellCheckEnabled?**: `boolean`

Enables spell checking for product text fields and for the Rich text dialog. The default value is `false`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`spellCheckEnabled`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#spellcheckenabled)

***

### variableItemsMaskSymbol?

> `optional` **variableItemsMaskSymbol?**: `string`

A symbol marking design elements as variable items. By default, it is `"%"`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`variableItemsMaskSymbol`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#variableitemsmasksymbol)

***

### fontList?

> `optional` **fontList?**: `string`[] \| \{ `appFonts?`: `string`[]; \}

A list of fonts available for a user in the editor; all these fonts should be uploaded to the font folder on server, by default it is `~/Fonts/`. For details, see the [Font list](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/font-list.html) topic.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`fontList`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#fontlist)

***

### fontListMode?

> `optional` **fontListMode?**: [`FontListModeType`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/types/ConfigurationTypes.FontListMode.FontListModeType.md)

A mode of the font list, either `"Simple"` or `"Advanced"`. The simple mode allows a user to select font and set font size; the advanced mode also provides an ability to change font style. The default value is `"Advanced"`.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`fontListMode`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#fontlistmode)

***

### defaultItemsConfig?

> `optional` **defaultItemsConfig?**: [`IDefaultItemsConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IDefaultItemsConfig.md)

The configuration of design elements being added to a product. For details, see the [Toolbox https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/toolbox.html\|Toolbox](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/toolbox.html) topic.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`defaultItemsConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#defaultitemsconfig)

***

### widgets?

> `optional` **widgets?**: [`IWidgetsConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/WidgetConfigurationInterfaces.IWidgetsConfig.md)

The configuration of the editor widgets. For details, see the [UI overview](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/ui-overview.html) topic.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`widgets`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#widgets)

***

### userInfo?

> `optional` **userInfo?**: `object`

Data to populate the loaded product template with.

#### Index Signature

\[`key`: `string`\]: `string` \| [`IBarcodeData`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/Barcode.IBarcodeData.md)

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`userInfo`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#userinfo)

***

### perSurfaceConfiguration?

> `optional` **perSurfaceConfiguration?**: `IPerSurfaceConfiguration`

A configuration of widgets, that is defined for separate surfaces.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`perSurfaceConfiguration`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#persurfaceconfiguration)

***

### productThemes?

> `optional` **productThemes?**: `object`

A predefined set of color themes and text styles for the product.

#### Index Signature

\[`name`: `string`\]: `IProductThemeConfig`

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`productThemes`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#productthemes)

***

### defaultProductTheme?

> `optional` **defaultProductTheme?**: `string`

Allows for specifying the default color theme.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`defaultProductTheme`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#defaultproducttheme)

***

### assetSources?

> `optional` **assetSources?**: `IAssetSources`

Asset sources defined for the [Asset Manager](https://customerscanvas.com/dev/editors/iframe-api/editor-configuration/image-manager.html).

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`assetSources`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#assetsources)

***

### themeConfiguration?

> `optional` **themeConfiguration?**: [`IThemeConfiguration`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IThemeConfiguration.md)

Defines the primary theme color and a new image for the standard preloader.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`themeConfiguration`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#themeconfiguration)

***

### variableTokens?

> `optional` **variableTokens?**: [`VariableToken`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.VariableToken.md)[]

A list of tokens available for insertion into text via a drop-down button in the Top toolbar, shown only while a user is editing text. If not set, the button is hidden.

#### Inherited from

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`variableTokens`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#variabletokens)

***

### rendering?

> `optional` **rendering?**: [`IRenderingProperty`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IRenderingProperty.md)

The [hi-res output](https://customerscanvas.com/dev/editors/iframe-api/rendering/print-files.html) and [proof images](https://customerscanvas.com/dev/editors/iframe-api/rendering/proof-images.html) configuration.

#### Inherited from

[`IPublicApiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IPublicApiConfig.md).[`rendering`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IPublicApiConfig.md#rendering)

***

### userId?

> `optional` **userId?**: `string`

The identifier of the user who currently works with the editor.

***

### tokenId?

> `optional` **tokenId?**: `string`

The security token required when accessing the user's private data and the Web API endpoints in the [secure mode](https://customerscanvas.com/dev/editors/design-editor-web-app/it-ops/config-backend/appsettings.html#SecureModeEnabled).

***

### customStyle?

> `optional` **customStyle?**: `string`

The name of a CSS file (without extension) that will be loaded into the Design Editor; the file should be located in the **~/Configuration/customCss/ ** folder. You should pass this property to `loadEditor` but cannot specify it in `clientConfig.json`.

***

### inlineStyle?

> `optional` **inlineStyle?**: `string`

An inline CSS style that will be loaded into the Design Editor.

***

### theme?

> `optional` **theme?**: `string`

The name of a theme. Possible values are `"BootstrapDefault"`, `"BootstrapEmpty"`, or `"Md"`. The default value is `"Md"`. You should pass this property to `loadEditor` but cannot specify it in `clientConfig.json`.

***

### loadConfigFromState?

> `optional` **loadConfigFromState?**: `boolean`

Enables loading the config settings from state files.

***

### enableTrace?

> `optional` **enableTrace?**: `boolean`

#### Overrides

[`IUiConfig`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md).[`enableTrace`](https://customerscanvas.com/docs/on-premises/design-editor/iframe-api/reference/design-editor-iframe/interfaces/ConfigurationInterfaces.IUiConfig.md#enabletrace)

***

### preloader?

> `optional` **preloader?**: `object`

An object that sets up the embedded preloader of Customer's Canvas. For an example, refer to [Preloader https://customerscanvas.com/dev/editors/iframe-api/customization/preloader.html\|Preloader](https://customerscanvas.com/dev/editors/iframe-api/customization/preloader.html) topic.

#### enabled?

> `optional` **enabled?**: `boolean`

Enables the embedded preloader of Customer's Canvas. If it is `false`, then you can implement your own preloader. The default value is `true`.

#### errorMessage?

> `optional` **errorMessage?**: `string`

This message shows when an error occurs. If it is not set, then "Initialization error." message shows by default.

#### firstTimeMessage?

> `optional` **firstTimeMessage?**: `string`

This message shows when a product is being loaded for the first time. If it is not set, then "The product is being configured for the first time. It may take a while." message is shown by default.

***

### enableLargeProductLoadOptimization?

> `optional` **enableLargeProductLoadOptimization?**: `boolean`