The top bar includes high-level meta controls:

Breadcrumbs sit above your work area. They indicate which part of the template is being worked on. They are clickable, so you could, for example, click “Body” and then edit the entire template.

Details sit to the right of the work area. They dynamically change based on whichever part of the template you’re working on:

Elements and Blocks sit to the left of the work area. More on those below:

· Templates are formed by one or more blocks.

· Blocks are formed by one or more elements.

Blocks can be saved for use in future templates. For example, you can create and save a header block, a signature block, and a footer block—saving you time and effort when creating future templates.

You also have some formatting options with a block of elements.

If you don’t care about saving and reusing parts of your template in the future and don’t care about formatting blocks of elements, it doesn’t matter if you put all of your elements into one block, put each element in a separate block, or mix it up.

Step 1: Drag an element or block from the Content area into the workspace.

Step 2: If necessary/desired, make edits.

Step 3: If necessary/desired, use the Details panel to make any other changes.

Repeat steps 1, 2 and 3 until your template is built.

To edit an existing block or element, simply click or double-click it.

Click and drag content into the work area—an element or a block. Then make whatever adjustments you want. If you drag an element, as shown below, this will create your first element inside your first block.

If you want to add an element to the same block, drag the element on top of the existing elements. Four arrows in boxes will appear. Drop the new element where you want it to appear—if you want the new element to be below the previous element, for example, drop it on the arrow pointing down. Let’s put an image above our text:

If instead you want to put an element into a new block, drop the new element into one of the “New Block” buttons that appears on the right when you drag the element into the work area:

If you’ve previously saved any blocks, you can drag it into your workspace the same way:

The example template now has three different blocks:

1. The block on top has a logo and text

2. The middle block has a button

3. The bottom block has five lines of signature content

Blocks are always arranged above and below one another and take up the width of the work area. You can see each block’s borders if you move your mouse along the side of the work area off the content. See how there are blue bars that appear above and below the mouse as it moves up and down the edge of the work area below? Those are the borders for the three blocks:

When you click to select a block, a button with three dots appears in the block’s top right corner. You can click on it, and you’ll get four icons:

· Drag block

· Save block

· Duplicate block

· Delete block

In the following example, we will delete one block and save another using these icons. (Details need to be visible to complete the save process.)

You also get four icons if you click on an element in your template:

· Drag element

· Edit element

· Duplicate element

· Delete element

You can drag an element from one block into another:

Now that you know the basic controls and core concepts, you can get started building or editing your own templates.

For information on specific controls in the email editor, see Email Editor: Specific Controls.

If you design your own template, you might be interested in this (external) resource:

https://chamaileon.io/resources/