IConfiguration Interface

A structure containing the web-to-print editor configuration. Extends IUiConfig.

    // Defining the editor configuration.
    configuration = {
        canvas: {
            color: "grey"
        grid: {
            stepX: 0.5,
            stepY: 0.5
        initialMode: "Advanced",
        customStyle: "mySiteStyles",
        rendering: {
            proofImageMockupEnabled: false
        backgroundUpdateParams: {
            foldedMode: {
                enabled: true,
                flip: true
        userInfo: {
            "FirstName": "John",
            "LastName": "Wood",
            "Phone": "1234567890"
        widgets: {
            ObjectInspector: {
                dndEnabled: false

    // Loading the editor with the given configuration.
    CustomersCanvas.IframeApi.loadEditor(iframe, productDefinition, configuration).then(function(e) {editor = e});


Optional alignToSafetyLineName

alignToSafetyLineName: string

Optional arbitraryResizeForImageItemEnabled

arbitraryResizeForImageItemEnabled: boolean

Optional autoLoadUserInfo

autoLoadUserInfo: boolean

Optional backgroundUpdateParams

backgroundUpdateParams: object

backgroundUpdateParams declaration

  • Optional foldedMode: object
    • Optional enabled: boolean
    • Optional flip: boolean
    • Optional flipOrder: FlipOrder

Optional canvas

canvas: ICanvasConfig

Optional customStyle

customStyle: string

A name of a CSS file (without extension) that will be loaded within the designer page; the file should be located in the ~/Configuration/customCss/ folder. You should pass this property to loadEditor but cannot specify it in clientConfig.json.

Optional defaultItemsConfig

defaultItemsConfig: IDefaultItemsConfig

Optional defaultLanguage

defaultLanguage: string

Optional defaultProductTheme

defaultProductTheme: string

Optional deleteItemConfirmationEnabled

deleteItemConfirmationEnabled: boolean

Optional fontList

fontList: string [] | object

Optional fontListMode

fontListMode: FontListModeType

Optional galleryOnly

galleryOnly: boolean

Optional grid

Optional imageEditorEnabled

imageEditorEnabled: boolean

Optional initialMode

initialMode: ModelModeType

Optional loadConfigFromState

loadConfigFromState: boolean

Enables loading the config settings from state files.

Optional loadUserInfoButtonEnabled

loadUserInfoButtonEnabled: boolean

Optional newImageName

newImageName: string

Optional perSurfaceConfiguration

perSurfaceConfiguration: IPerSurfaceConfiguration

Optional preloader

preloader: object

An object that sets up the embedded preloader of Customer's Canvas. For an example, refer to The Product Loading Screen topic.

preloader declaration

  • 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.

  • Optional errorMessage: string

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

  • 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.

Optional productThemes

productThemes: object

productThemes declaration

Optional restoreProductOnReloadEnabled

restoreProductOnReloadEnabled: boolean

Optional revertProductConfirmationEnabled

revertProductConfirmationEnabled: boolean

Optional spellCheckEnabled

spellCheckEnabled: boolean

Optional theme

theme: string

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.

Optional userId

userId: string

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

Optional userInfo

userInfo: object

userInfo declaration

  • [key: string ]: string

Optional variableItemsMaskSymbol

variableItemsMaskSymbol: string

Optional watermark

watermark: IWatermarkConfig

Optional widgets

widgets: IWidgetsConfig