--- title: "IPlaceholderItemData | Customer's Canvas On-Premises" canonical: "https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IPlaceholderItemData/" --- # IPlaceholderItemData > A structure defining the default parameters of image placeholders. ## Interfaces ### IPlaceholderItemData #### Remarks You can apply these parameters to the `placeholder` object through either **clientConfig.json** or [IConfiguration https://customerscanvas.com/dev/editors/iframe-api/reference/design-editor-iframe/iconfiguration.html\|IConfiguration](https://customerscanvas.com/dev/editors/iframe-api/reference/design-editor-iframe/iconfiguration.html). #### Example ```json { "defaultItemsConfig": { "placeholder": { "allowedSubfolder": "europe_photos", "isCoverMode": false } } } ``` #### Extends - [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata) #### Type Parameters | Type Parameter | | ------ | | `TBarcodeFormat` | | `TBarcodeSubType` | | `TOverlayEffect` | #### Properties ##### adjustSize? ```ts optional adjustSize?: boolean; ``` ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`adjustSize`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#adjustsize) ##### allowedSubfolder? ```ts optional allowedSubfolder?: string; ``` Defines a subfolder of `/assets/images/` from which the user can select images for placeholders. When you specify this property, the gallery shows images only from the corresponding public subfolder. By default, your users can select images from any gallery tab or public subfolder. ##### allowedTabs? ```ts optional allowedTabs?: string[]; ``` Defines an array of gallery tab names from which the user can select images for placeholders. For example, to open only the **Public files** and **My files** tabs for image placeholders, set **allowedTabs** to `["Public files", "My files"]`. By default, your users can select images from any gallery tab. ##### angle? ```ts optional angle?: number; ``` An angle, which design elements are rotated to. By default, this value is `0`. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`angle`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#angle) ##### barcodeContent? ```ts optional barcodeContent?: BarcodeContentType; ``` Defines the barcode content type. ##### barcodeFormat? ```ts optional barcodeFormat?: TBarcodeFormat; ``` Defines the barcode format. ##### blendMode? ```ts optional blendMode?: BlendMode; ``` A blend mode that applies to design elements being added to the canvas. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`blendMode`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#blendmode) ##### borderColor? ```ts optional borderColor?: string; ``` The border color. The default value is `"rgba(0,0,0,1)"`. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`borderColor`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#bordercolor) ##### borderWidth? ```ts optional borderWidth?: number; ``` The border width, in points. The default value is `1`. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`borderWidth`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#borderwidth) ##### contentBarcodeColor? ```ts optional contentBarcodeColor?: string; ``` Defines the barcode color. The default value is `"rgb(0, 0, 0)"`. ##### contentBarcodeOptions? ```ts optional contentBarcodeOptions?: IBarcodeOptions; ``` ##### contentFillColor? ```ts optional contentFillColor?: string; ``` Defines the content fillColor. ##### contentImageUrl? ```ts optional contentImageUrl?: string; ``` Defines a link to an image used as the placeholder's content. You can define URLs, links to private images (`"user:someprivateimage.png"`), and images from the public gallery (`"public:logos/logo.png"`). ##### contentOverlayEffect? ```ts optional contentOverlayEffect?: TOverlayEffect; ``` ##### contentPermissions? ```ts optional contentPermissions?: IContentPermissionsData; ``` Defines permissions for the content of placeholders. ##### contentResizeMode? ```ts optional contentResizeMode?: ContentResizeMode; ``` Defines the resize mode for image placeholders. It can be either `fill`, `fit`, or `original`. The default value is `fill`. ##### fillColor? ```ts optional fillColor?: string; ``` The fill color for shapes and placeholders. The default value is `"rgba(112,112,112,1)"` for shapes and is `"rgba(0,0,0,0)"` for image placeholders. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`fillColor`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#fillcolor) ##### fixedStubContentSize? ```ts optional fixedStubContentSize?: boolean; ``` Maintains the size of stub images while resizing image placeholders. The default value is `false`. ##### height? ```ts optional height?: string | number; ``` The height of design elements being added to the canvas, in points or percent. For QR codes, the `width` value is used for both `width` and `height`. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`height`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#height) ##### isCoverMode? ```ts optional isCoverMode?: boolean; ``` Enables the cover mode for image placeholders. The default value is `true`. ##### isStubContent? ```ts optional isStubContent?: boolean; ``` Defines whether this is a stub placeholder. The default value is `false`. ##### isVariable? ```ts optional isVariable?: boolean; ``` Marks a design element as a variable item. The default value is `false`. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`isVariable`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#isvariable) ##### itemPermissions? ```ts optional itemPermissions?: IItemPermissionsData; ``` A structure defining the Item Menu and the Floating item toolbar for design elements. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`itemPermissions`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#itempermissions) ##### location? ```ts optional location?: ILocationData; ``` The coordinates of design elements being added to the canvas. By default, you can add them to the center of your product. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`location`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#location) ##### manipulationPermissions? ```ts optional manipulationPermissions?: IManipulationPermissionsData; ``` A structure defining the manipulation permissions for design elements. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`manipulationPermissions`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#manipulationpermissions) ##### name? ```ts optional name?: string; ``` The name of design elements being added to the canvas. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`name`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#name) ##### opacity? ```ts optional opacity?: number; ``` An opacity that applies to design elements. This value can be from `0` to `1`. By default, it is `1`. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`opacity`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#opacity) ##### overprintFill? ```ts optional overprintFill?: boolean; ``` ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`overprintFill`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#overprintfill) ##### overprintStroke? ```ts optional overprintStroke?: boolean; ``` ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`overprintStroke`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#overprintstroke) ##### placeholderPermissions? ```ts optional placeholderPermissions?: IPlaceholderPermissionsData; ``` Defines permissions for placeholders. ##### shapePermissions? ```ts optional shapePermissions?: IShapePermissionsData; ``` Defines permissions for shapes. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`shapePermissions`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#shapepermissions) ##### textWrappingMode? ```ts optional textWrappingMode?: WrappingMode; ``` A wrapping mode that applies to wrap text around design elements, one of `"none"`, `"square"`, or `"tight"`. By default, it is `"none"`. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`textWrappingMode`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#textwrappingmode) ##### themeBinding? ```ts optional themeBinding?: IThemeBindingData; ``` A style or a color that applies to new design elements. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`themeBinding`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#themebinding) ##### violationSettings? ```ts optional violationSettings?: IViolationSettings; ``` A structure defining the design validation parameters and warnings. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`violationSettings`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#violationsettings) ##### visible? ```ts optional visible?: boolean; ``` Indicates whether the design element is visible on the canvas. The default value is `true`. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`visible`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#visible) ##### visualizationPermissions? ```ts optional visualizationPermissions?: IVisualizationPermissionsData; ``` A structure defining the visualization permissions for design elements. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`visualizationPermissions`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#visualizationpermissions) ##### width? ```ts optional width?: string | number; ``` The width of design elements being added to the canvas, in points or percent. ###### Inherited from [`IShapeItemData`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#ishapeitemdata).[`width`](https://customerscanvas.com/docs/on-premises/design-atoms-js/reference/design-atoms-interfaces/IShapeItemData.md#width)