1. Add a background color for your email using the “Defaults” tab. This tab is located to the right of the editing area.
2. If using full width images, make them 600px wide for the best quality on desktop and mobile.
3. Wrap all rows in a box to be able to control padding and mobile settings (hide/show).
4. When using the multi-column element, place a box in each column to allow for padding adjustments.
5. If an element needs to look different on mobile than it does on desktop, you will need to create a separate element and use the Mobile Settings to show or hide the elements.
6. Use the breadcrumb trail to traverse your wrapped elements. This will ensure that you are working on the element that you intend to.
7. When dragging and dropping elements, be mindful of its drop location.
8. Use the “Favorite element manager” to save content pieces as Complex Elements that you will use frequently. If you make an update to a Complex Element after adding it, it will not update the saved element.
9. If you would like a full width color bar (for call-outs or other special featured content), you will need to drop in a Full-Width Element that is separate from other content (think of it like stacking blocks of content). Then you can change the background color and set the Typography styles. Then, add a Box Element, which will be the main "inner" wrapper for the content that will show inside the call-out. You can add padding to the top and bottom of the box to make sure your text doesn't bump up against the color borders of the parent Full-Width Element. Once you are done with your new call-out, drag in a new Full-Width Element below your call-out and start adding the rest of your body copy.
10. In order to have text look like it is wrapping around an image, please follow the steps below.
- Add a text element that spans the full width of the email (not in a column element or anything like that).
- Below that, add a box with a multi-column element in it that is set to two columns.
- Drop a text element in one column and an image element in the other. You can decide the widths of the columns based on how wide you want the image to be. You'll want to make sure the amount of text lines about matches the height of the image to keep the "wrapping" feel.
- Below the box with a column element, drop a text element like the first bullet point.