Goal​

To add images to an email.

This procedure also shows how to edit an image, add an alternative text, and select the correct image handling.

Hint:

Large image sizes can reduce delivery speed and increase costs for your recipients. By default, the maximum image size that you can upload to Mapp Engage is 500 KB.

Prerequisites​

You have created the email message manually in Mapp Engage.

Procedure​

You can add images directly in the HTML code or with the graphical editor.


Add an Image with HTML Code

  1. Create or edit an email message and navigate to step ​2. Content​ of the message creation wizard.
    ⇒ By default, step ​2. Content​ opens in the ​HTML Code​ view.
    Images in HTML code are marked with an <img> tag. Insert the image in the HTML code with the tag <img src="[image name]">.
    The tag contains an src-attribute with the image and path to the file location. Many image properties can be modified in the tag, for example, image height, or border.
  2. Enter the alternative text for the image. The ​alt​ attribute specifies the text that the email client displays when the image is unavailable or images are turned off. The alt text is important for contacts who use a screen reader.
    Example: <img src="imagename.gif" alt="Description of the image" style="width:125px;height:125px;">
  3. To save your changes, click ​Save as Draft​.


Add an Image with the Graphical Editor

  1. Create or edit an email message and navigate to step ​2. Content​ of the message creation wizard.
    ⇒By default, step ​2. Content​ opens in the ​HTML Code​ view.
  2. Click ​HTML Editor​.
    ⇒ The ​HTML Editor​ view opens.
  3. Click
    ⇒ An ​Image Properties​ window opens.
  4. In the ​URL​ input field, enter the location of the image. For example, http://website.com/media/assets/apple.jpg
    Or, click ​Browse Server​ to upload an image from the Mapp Engage content store.
    In the ​Alternative Text​ field, enter the alternative text for the image. The ​alt​ attribute specifies the text that the email client displays when the image is unavailable or images are turned off. The alt text is important for contacts who use a screen reader.
  5. To turn the image into a link to a website, click the ​Link​ tab. When your contact clicks the image, the website opens in the web browser.
    In the ​URL​ input field, enter the destination URL. From the ​Target​ drop-down list, select whether the link opens in a new browser window or in the same browser window.
  6. To save your changes, click ​OK​.


Select the Image Handling Method

  1. Create or edit an email message and navigate to step ​2. Content​ of the message creation wizard.
    ⇒ By default, step ​2. Content​ opens in the ​HTML Code​ view.
  2. Expand the ​Advanced Options​ area.

  3. In the ​Image Handling​ area, select how Mapp Engage handles images in the email.

    Image Hosting

    Description

    ​Images Links are Unchanged​

    Mapp Engage does not change the image address in any way. When the email is downloaded in the inbox, the images are downloaded from the URL you defined. Use this option when the link contains additional information. For example, a link that contains parameters for a tracking pixel.

    ​Images are Inlined (Offline HTML)​

    Images are inserted into the email as inline attachments in the email. This option increases the size of your email messages.

    Use this option when you want email recipients to see the images even when offline. When you send the email, Mapp Engage retrieves the images from the image address you define. Mapp Engage changes the addresses of the pictures in the email (HTML tags) to the inline images, not to the external address. As a result, the email client must retrieve the images from an external address to display the images in the inbox. If Mapp Engage cannot retrieve one or more images, the system asks you to upload the missing images. This method does not affect the tracking pixel in any way. The tracking pixel is still hosted on the Mapp Engage server.

    For more information, see Upload Missing Images (window)​.

    ​Images are Hosted in Mapp Engage(Online HTML)​

    Images are uploaded to the Mapp Engage servers. When the recipient opens the email, the images are downloaded from Mapp Engage.

    Flash movies (*.swf) in the HTML and Flash HTML fields in the message are handled as images. You cannot inline files with these formats. The flash movies are specified with a specially formatted <object>-block. For more information, see Use a Content Store Element in an Email​.

    To override this option for a particular image, use the data-skip attribute, for example: <img data-skip width="1" height="1" border="0" src="http://imagelocation"/>.

  4. To save your changes, click ​Save as Draft​.


Hint:

You can exclude individual images from the selected image handling method. This method can help to keep the overall email size smaller. For instructions, see ​Exclude Images from Image Hosting​.