Elements feature update

The Elements feature in Blueshift's HTML editor is no longer available. For designing emails, we recommend using the Visual Editor which provides a more intuitive design experience.

JavaScript limitations

JavaScript is not supported in email templates. Major email clients (Gmail, Outlook, Apple Mail, Yahoo) block JavaScript for security reasons.

For interactive content, consider using CSS-based solutions or directing users to a web page with full JavaScript functionality.

Editable image & text blocks

You can make certain image elements & text blocks editable, without the need to change the HTML. This way you can allow non-technical members in your team to update content without any knowledge of HTML.

You can make the elements editable by adding an ID to the element. This element is then available on the Elements tab. When you edit the text or update the image for the element on the Element tab, this change is reflected in the email that is sent. You can also view the changes in the preview.

Images	Add an “ad_hero” ID to an image to make it editable. You can include up to 30 editable images in the template by adding IDs "ad_hero1" through "ad_hero30". For example: <img id="ad_hero1" src="`http://d3ad91huxqg64v.cloudfront.net/e/fd769820f734872f7e2935bef2d66611-image_600x490.jpg`"/>
Rich Text Area	Add an “ad_body” ID to the `<div>` surrounding the rich text block to make it editable. You can include up to 30 rich text areas in the template by adding IDs "ad_body1" through "ad_body30". Rich text elements are displayed in a WSYIWYG editor to the end user and the contents of the marked div are replaced with the HTML generated by the WSYIWYG editor. For example: `<div id="ad_body1"><p>Lorem ipsum dolor sit amet magna aliqua aliquip ex ea commodo consequat.</p></div>`
Plain Text	Add an “ad_text” ID to the `<p>` tag surrounding the text block to make it editable. You can include up to 30 plain text elements in the template by adding IDs "ad_text1" through "ad_text30". Plain text areas replace the contents of the marked paragraph with plain text, and no HTML. For example: `<p id="ad_text1">Hello World</p>` `<p id="ad_text2">Goodbye</p>`

Example:

Consider the following example where a Plain text element is added.

This plain text element is now available on the Elements tab and the contents can be seen in the preview.

After updating the content from the Elements tab, you can see the updated preview.

Elements in the HTML Editor

Editable image & text blocks