Templates: Using HTML Templates

Steps

• Export HTML from wherever you design your Newsletter (I.e. MailChimp, Active Campaign, Microsoft Word)
• Within the Templates tab on the left menu, click the "Create Template" button
• Instead of Rich Text, select HTML from the editor type dropdown
• Paste the HTML into the Template editor
• The HTML will preview on the right (or below on smaller screens)

Key Considerations

Outlined below are a few considerations to keep in mind when designing your copy and templates. In addition to these items, we recommend testing your HTML by sending the templates to different email clients (Gmail, Outlook, etc...) as well as checking the output on web and mobile devices.

Links

To insert a link into an HTML template, use a standard <a> tag. Place your cursor between the quotes in href="", then click the plus (+) icon to add a template value. Select the link type you need. For the Display Text field, use: $LINK_ONLY

CSS

Some email clients do not offer support for more modern CSS properties (like flexbox, grid, box-shadow, max-width, etc...) which can result in the email rendering improperly. Additionally, importing stylesheets is generally not supported. For better compatibility, use inline styles and avoid newer CSS techniques.

Font

Not all email clients support external font loading (like Google Fonts) and will default to a generic font. It's best to use web-safe fonts (like Arial, Verdana, or Times New Roman).

Images

Best practice for images would be to host the image externally and use a regular URL for the source. If hosting the image externally is not an option, you can simply upload the image to the "Files" section of Tellescope and click the "copy" icon to capture the URL for the file. Embedding images with Base64 encoding is not recommended.

Javascript / Media Queries

JavaScript and media queries are not supported in most email clients, meaning interactive elements (like forms, pop-up windows, or media-based responsiveness) will not work. Any reliance on JavaScript or media queries for functionality will likely fail. Ensure your HTML template doesn’t rely on or incorporate JavaScript for critical features or interactions.