/
Image Block

Image Block

Owned by Tristy Lee (Unlicensed)
Last updated: Oct 13, 2023 by Rebecca Kornblum
5 min read

Description

Incorporating images into emails offers several advantages, including enhanced readability and perception, increased brand awareness, and improved customer engagement.

An image block in an email content editor allows users to upload and customize images. The primary image formats to choose from are JPEG, GIF, and PNG. When selecting an image format for your email, consider the following:

  • JPEG format is ideal for preserving colors but may result in a significant quality reduction.

  • GIF format is helpful for adding action to your email but may render colors less brightly than JPEG.

  • PNG format is recommended for images with sharp edges, logos, or transparent backgrounds and preserves quality regardless of size and color saturation. Large PNG images can slow down email loading times, and the maximum image size for upload is 3MB with a resolution of 4000 x 4000 pixels.

This article discusses the following topics regarding images:

Adding Images

Images can be added in several ways.

Drag and Drop

Drag and drop the image block into one of the structured containers.

Add a Link

Add an external link to an image.

  • Tiles provide the option to tile an image as a background allowing you to repeat the image seamlessly across the element, creating a pattern-like effect.

     

  • Accept the link by selecting the check mark.

     

  • Store the image.

    • Download to the gallery will store the image in the gallery for use in other communications.

    • Leave as external link will reference the link when used. 

Access Stock Images

Use the search feature to find stock images through keyword searches.

Modifying Images

Users can change an image or modify the appearance and layout of images once they have been selected.

  • Change selected images. Clicking the Change Image button allows users to change the selected image.

 

  • Edit a selected image. Clicking the Edit Image button allows users to edit the selected image.

      Clicking the Edit Image button opens the image editor where the selected image can be modified. Users can apply filters, resize and crop images, draw over them, put any text over them, add stickers and frames, and apply backgrounds. Clicking Save saves the completed edits.

     

    • Rollover Effect Toggle
      This displays an image over the current image when the mouse hovers over the image. To create the rollover effect, users turn the Rollover Effect Toggle to On and then upload images or URLs for the secondary (rollover) image path.

      Note: The image rollover effect works on desktop devices; other users will see the primary image only. This feature works in a limited number of email services: Yahoo! Mail, AOL, Gmail, iCloud Mail, Outlook 2003, and macOS Apple Mail.

       

    • Link
      Users can add a link for Site, Mailto, Call, or Share directly from the image.

       

    • Alternate Text
      Users can add a description for the image.

       

    • Alignment
      Users can set the alignment of the picture to centered, left-aligned, or right-aligned.

       

    • Size
      This allows users to adjust the overall size of the image.

       

    • Adjust to Width
      Users can make the image the size of the width of the screen.

       

    • Responsive Image
      Users can adjust the image to the width of the screen of the mobile device. It is recommended that this toggle is set to On.

       

    • Padding refers to the amount of space between the edges of the block and the surrounding content. It can be adjusted to create an email that is visually balanced and aesthetically pleasing by adding space to the width or height of the block. The More toggle allows users to adjust the sides of the spacer block either independently or separately.

      • The More toggle default is set to Off. This allows users to adjust all sides of the button uniformly.

      • Turning the More toggle On allows all sides to be adjusted independently.

         

    • Add an Anchor Link
      Anchor hyperlinks take readers to specific paragraphs within the email.

       

    • Hide Element
      Users have the option to hide the text on either the desktop or the mobile application.

       

      • Click the desktop icon to hide the text on the desktop application.

         

      • Click the mobile device icon to hide the text on the mobile application.

More About Blocks

More About the Content Library