The Image Editor

  • Updated

Overview

Some paragraph types in the template editor let you add images. An integrated image editor enables you to edit these images directly in Optimizely Campaign.

Template_Kit_2_Image_Editor.png

Working with the image editor

General layout and functionality

The image editor is displayed as a large pop-up menu on top of the template editor user interface. It does not have a separate entry in the page selector in the top bar. If you switched to another page while the image editor was open, you can go back by selecting the Edit Content-Page where you opened the editor.

On the left of the image editor is the tool selection. On the far-left-hand side, vertically stacked tabs cluster the tools into following categories (top-to-bottom):

  • Transform (cropping and rotating)
  • Filters (pre-set color and contrast adjustments)
  • Adjust (custom color and contrast adjustments)
  • Focus (blur image or parts of image)
  • Overlays (add special effects)
  • Text (write on your image)
  • Stickers (add shapes and emoticons)
  • Brush (paint on your image)

Opening an image in the editor

Prerequisites: You see a message draft in the template editor. There is a paragraph of the type text/image or image bar which contains an image.

  1. In the left-hand preview section of the template editor, find the content paragraph containing the image you want to edit.
  2. In the header menu of the content paragraph, click template_kit_-_edit.png (edit).
    → The paragraph is opened in the paragraph editor on the right-hand side.
  3. In the paragraph editor, open the tab Image.
  4. In the section Image, click on Edit.
    → The image is opened in the image editor.

Editing an image

Use the menu on the left of the image editor to select tool categories and tools. Adjust values, paint or write on the image and drag selection frame handles as you would in a desktop graphics software. To undo or redo editing steps, use the buttons Undo and Redo below the image.

Saving changes

Prerequisites: You see an image in the image editor. You made changes that you want to save.

  1. In the bottom right of the image editor, click on Apply.
    → The image editor is closed.
  2. In the bottom right of the paragraph editor, click on Apply.
    → The preview section on the left is updated.
  3. Optional: Continue editing the message draft.
  4. Close the template editor and save the campaign.