Email Content Customization

In the Updated Editor, you can customize the email body size and add a background color or image to your email template.

To customize the canvas size:

1. Select Body in the breadcrumbs at the top of the screen.
2. In the Email Body Width section in the Details panel on the right side of the screen, you can adjust the width and height of your email content by dragging the sliders, using the up and down arrows, or entering the values manually.
   
   Note: The recommended width is 600-650 pixels for optimal display on mobile devices. 
   
3. To add a background color, expand the Body Background tab below the Email Content Width tab in the Details panel on the right side of the screen.
4. Click the color picker to select a color or enter a hex code to specify a custom color.
5. To add a background image, toggle the Background image switch and click Change to select an image from the Encompass Image Manager. Some mail clients will not display background images, so please bear this in mind when choosing to use background images. We recommend testing your email using varying mail clients to ensure your content displays properly both with and without the background image.
6. Adjust the position, repeat, and size settings as needed to customize the background image.
   
   1. Position options
      1. Center Top: Centered horizontally at the top of the background area. 
      2. Right Top: Centered horizontally at the top of the background area. 
      3. Right Center: Aligned to the right side and vertically centered within the background area. 
      4. Right Bottom: Aligned to the right side at the bottom of the background area. 
      5. Center Bottom: Centered horizontally at the bottom of the background area.
      6. Left Bottom: Aligned to the left side at the bottom of the background area. 
      7. Left Center: Aligned to the left side and vertically centered within the background area. 
      8. Left Top: Aligned to the left side at the top of the background area. 
      9. Center Center: Centered both horizontally and vertically within the background area. 
   2. Repeat options
      1. No-repeat: The image will not repeat and will be displayed only once. 
      2. Repeat-x: The image will repeat horizontally along the x-axis.
      3. Repeat-y: The image will repeat vertically along the y-axis.
      4. Repeat: The image will repeat both horizontally and vertically.
   3. Size options
      1. Auto: The image will be displayed in its original size.
      2. Cover: The image will be scaled to cover the entire background area, potentially cropping parts of the image if necessary.
      3. Contain: The image will be scaled to fit within the background area, maintaining its aspect ratio and potentially displaying empty spaces if the image doesn't fill the entire area.