Image

We love images, and all great emails contain images. We've done our best to make it easy for the marketeer to work with images, without having to worry too much about resizing and scaling.

The Image input allows images uploaded directly from the marketeers browser, or alternatively via a URL.

Template Editor

You can reference this image in your template code in several ways:

• {{ image.url }} - Outputs the URL of the image, resized with the width and DPR provided in the options.

• {{ image.originalUrl }} - Outputs the Original URL. Should only be used in together with the resizeImage filter to make sure image is probably resized and served from CDN.

• {{ image | imgTag }} - Outputs a complete <img> tag, read more about the imgTag filter.

You have the option to enter a width and a DPR to be used for this image. If you enter a width and/or DPR, we will auto-resize the image accordingly.

Additional variables are exposed on the image object with the width and height, which is useful for setting width/height in <img> attributes and in style attributes.

• {{ image.width }} - The width of the image in pixels (after automatic resizing). It ignores the DPR, so if width: 320 and DPR: 2 is set in options, image.width will output 320.

• {{ image.height }} - The height of the image. If image resizing is used with width only, the image will be resized preserving aspect ratio, and the outputted height will be the resulting height.

Email Editor

Before marketeer uploads/inserts image:

After image upload, the image is shown with a preview: