This is an old documentation. Go to the latest Customer's Canvas docs

The Image Editor

Customer's Canvas has a built-in image editor that allows for manipulating raster images in jpg, png, tif, gif, and bmp formats. Using the Image Editor, you can:

Editing Images

Your users can open the Image Editor from the designer for a specific item, and from the Gallery, where they can correct images and save modified copies in their private collections.

  • To edit images in the gallery before adding them to a product:

    1. Switch the web-to-print designer to the advanced mode by clicking the Switch to advanced editing button. If there is no such button, then the designer is already in the advanced mode (or this mode is disabled).
    2. In the toolbar, click the Image button.

      The left toolbar.

    3. In the Gallery, select an image and click the Edit button.
  • To edit images and the content of image placeholders in already loaded products, open the Image Editor:

    1. Right-click an image on the canvas or click the corresponding image layer in the Object Inspector to see the Item menu.

      The image pop-up menu.

    2. Click Edit image.

To start editing images, you can click the Background, Adjust, or Crop buttons. The Revert button discards your changes. Save allows for saving the edited image in the Gallery.

The Image Editor.

Erasing the Background

In the Image Editor, the Background button navigates to an edit mode where you can erase a single color or a color range, i.e. make them transparent. For example, this feature may be useful when you upload a logo without a transparent background, like a white background or green screen. Also, you can use this feature to make some parts of an image transparent for other purposes.

In this mode, when you move the cursor over the image, it becomes a crosshair pointing at the pixel to be erased. To remove a color, click the image. You can select the Contiguous option to remove the background only in an enclosed area of the same color. To remove the selected color from the whole image, clear Contiguous. Also, you can move the Tolerance slider to adjust how strongly colors may differ from the selected color.

Erasing the background in the Image Editor.

When you erase a color, it turns transparent. By default, transparent image areas are displayed as checkered areas in the Image Editor. If your image is too light and does not contrast strongly against the checkered area, then you can select a different highlight. In the Choose Background group, click another highlight color: white, black, magenta, lime, or a contrast color. This highlight does not affect the edited image and appears only in the preview.

Adjusting Image Colors

Customer's Canvas allows for changing:

  • Brightness
  • Contrast
  • Hue
  • Saturation

To adjust these settings in the Image Editor, use the corresponding sliders.

Adjusting colors in the Image Editor.

Also, you can apply the grayscale and sepia effects to your images using the Effect menu.

Cropping Images

When you need to accent a single fragment or just remove extra margins, you can crop your images. In the crop mode, a bounding rectangle appears to define an image fragment.

Cropping images in the Image Editor.

See Also