Image Overview
The image element allows you to add images to your email body. Images can support or add value to your email content, increase your branding by adding logos, and guide recipients toward a call-to-action. Similar to the Button element, you can add an image that allows the email recipient to click on it so that an action is performed. The action includes navigating them to a website, sending an email, or calling a phone number.
How to Add the Image Element to Your Template
To add the image element to your email template, ensure you are in the Content section. Then, click the IMAGE icon and drag it to the email body.
Properties of the Image Element
You can choose to customize the Image element in Desktop or Mobile mode. However, the Mobile mode does not contain all the styling options. Specifically, the Mobile mode does not include the ability to:
- Use the Smart Image functionality to create an image with AI
- Upload an image from your computer or a URL
- Provide an alternate text for your image
- Set Actions so that when the image is clicked, it can open a survey, send an email, or initiate a phone call
Smart Image
The Smart Image section uses AI to generate an image based on the image description you enter. Once you type in your image description and click “Generate Images” it will show you image options you can put into the email body.
Image
The Image section is where you can upload an image and customize its formatting. You can customize the following:
- Image: Upload the image from a file on your computer or insert an image URL from an online source.
- Auto Width: The image will automatically size itself. You can toggle this off to make the image smaller.
- Align: Position the image left, center, right, or justified within the column or row.
- Alternate Text: Meant to convey the “why” of the image as it relates to the content of the email. It is read aloud to participants by screen reader software. It also displays on the page if the image fails to load, as in the example of a missing image.
Action
The Action section allows you to choose what happens when the participant clicks on an image. When a participant clicks the image, the following actions can occur:
- Open Website: Redirects the participant to a URL in a new tab or the same tab.
- Send Email: Opens an email message with your chosen mailing address, subject line, and body message.
- Call Phone Number: Initiates a phone call to a number of your choice. This option only works if the participant clicks the button while on a phone.
General
The General section allows you to control how much padding there is between the border of the image and the column or row it is in. You can toggle the “More Options” button (red) to customize how much padding is on the top, right, left, and bottom of the image.
Responsive Design
With responsive design, you can customize your emails to ensure they display properly across different devices. Images can be tailored to display perfectly or be hidden so that they don’t display on a certain device. To customize the email for a specific device, click on the desktop icon or mobile icon, or select the Desktop or Mobile tab at the bottom left of the editor body. You can edit different aspects of the image based on the device the recipient is using to view the email.
Under the responsive design section, you can hide the image on a desktop or mobile device. When either "Hide on Desktop" or "Hide on Mobile" is toggled on, the image will appear faded within the email template, making it invisible to participants depending on whether they are viewing the email on a desktop or a mobile device.
