---
title: "Add and Configure Images in HTML Emails"
slug: "insert-images-in-an-email"
updated: 2026-02-12T11:50:02Z
published: 2026-02-12T11:50:02Z
canonical: "docs.mapp.com/insert-images-in-an-email"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://docs.mapp.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Add and Configure Images in HTML Emails

## Goal

Add and configure images in an HTML email.

## Procedure

### Add an Image with HTML Code

1. Create or edit an email and go to **Step 2. Content** in the message creation wizard.
2. Insert the image using the `&lt;img&gt;` tag:

```php-template
<img src="[image URL]">
```
3. You can add attributes to modify the image’s appearance (e.g., `height`, `border`).
4. Add an alternative text using the `alt` attribute:

```php-template
<img src="imagename.gif" alt="Description of the image">
```
5. This text appears when the image cannot be displayed and is essential for accessibility.
6. Click **Update Draft**.

> [!NOTE]
> **Note**: Large images (over 500 KB) may slow down delivery and increase costs.

---

### Add an Image with the Graphical Editor

1. Create or edit an email and go to **Step 2. Content** in the message creation wizard.
2. Click **HTML Editor**.
3. Click the **Insert/edit image** icon.
4. In the **Insert/edit image** window:
  - Enter the image URL under **Source**, or click **Browse files**to upload from the Mapp Engage content store.
  - Add the alternative description and, optionally, height and width.

![](https://cdn.document360.io/554b9b98-6720-4d8b-9919-c7b203d72648/Images/Documentation/image(862).png)
5. Click **Save**to save changes.

> [!NOTE]
> Note
> 
> If an image is not yet available in the Content Store, the system prompts you to upload it before continuing.

---

## Configure Image Handling (Optional)

When creating an email, you can define how images are handled during sendout. The selected method affects message size, rendering behavior, and offline availability.

---

### Image Handling Methods

| Option | Description |
| --- | --- |
| **Images Links are Unchanged** | Image URLs remain exactly as defined. |
| **Images are Inlined (Offline HTML)** | Images are embedded directly into the email. This increases message size but allows offline viewing. |
| **Images are Hosted in Mapp Engage (Online HTML)** | Images referenced in the HTML are uploaded to the Mapp Engage server during sendout preparation if not already available. Missing images trigger the Upload Missing Images dialog. Uploaded images are stored as Content Store elements and can be reused. The element name is derived from the image reference (for example, <img src="Kitten"> creates “Kitten”). |

---

### Exclude Individual Images from Hosting or Inlining

By default, the selected image handling method applies to all images in your email. If needed, you can exclude specific images from being hosted or inlined.

To prevent a specific image from being processed, add the following attribute to the `&lt;img&gt;` tag:

```http
ecm:process="false"
```

Example:

```http
<img src="http://www.website.com/image.gif" ecm:process="false"/>
```

Images with this attribute remain unchanged and are loaded from the original source.

---

## Best Practices

- Keep image file sizes as small as possible.
- Use hosted images for most campaigns.
- Use inline images only when offline visibility is required.
