Create and send an HTML email

Last updated:

HTML emails let you build an Orchestrate email by pasting raw HTML directly into a code editor, instead of building it block-by-block in the Visual Design Studio. Use this option if you already have HTML from an external email builder or email service provider (ESP) and want to send it through Orchestrate's existing segmentation, scheduling, and send infrastructure.

This article covers the parts of HTML emails that work differently from template-based emails: the HTML editor, personalization tokens, and the unsubscribe requirement. For concepts that work the same for both email types, such as email settings, choosing recipients, scheduling, throttling, and sending, see Create and send an email.

Note: HTML emails support standalone emails only. For the full list of what isn't supported yet, see the What HTML emails don't support yet section

Prerequisites

To create and send an HTML email, you must:

Create an HTML email

  1. In the left-side menu, go to Orchestrate > Emails.
  2. Select + Create email, then choose the HTML email option.
  3. Choose Marketing or Transactional as the email type. As with template emails, this can't be changed later. Create a new email if you need a different type. See Marketing and transactional email templates.
  4. Select the app the email should be sent from.
  5. Confirm to open Email details.

Note: Unlike template emails, an HTML email doesn't create a guide, so there's no Visual Design Studio step. You write and preview the HTML directly.

Edit the HTML content

  1. On the Email details page, in the Email template card, select Edit email.
  2. The HTML editor opens with two side-by-side panels: a code panel on the left and a live preview panel on the right.
  3. Paste or type your HTML into the code panel.
  4. Select Show preview to render your HTML in the preview panel. Select it again any time you change the HTML to refresh the preview.
  5. Select Save to store your changes. See Save your email.

Tip: The preview and the saved version go through the same processing. Your HTML is sanitized for security, and personalization tokens are reformatted automatically, so what you see in Show preview is what recipients receive.

Follow these guidelines when building your HTML

Pendo sanitizes and processes your HTML before it's saved or sent, so the delivered email might not exactly match what you pasted. Pendo helps keep your HTML safe and compatible across email clients, but you're responsible for testing that your email renders correctly in the email clients you want to support.

Use table-based layouts. Email clients such as Gmail, Outlook, and Apple Mail have inconsistent support for modern CSS. Use <table>, <tr>, and <td> for layout instead of <div>-based flexbox or grid, and use inline style attributes instead of <head> stylesheets, which many clients strip or ignore.

Host images externally. Only http:// and https:// image URLs are supported. Base64-encoded data URLs aren't supported, so host images on a publicly accessible CDN or server.

Control your preview text. The first visible text in your HTML is used as the inbox preview snippet. To set this explicitly, add a hidden element near the top of your <body>:

<span style="display:none;max-height:0;overflow:hidden;">
Your preview text here.
</span>

Pendo automatically adds invisible padding after this so inbox clients don't pull in unintended body content.

Know what gets removed. JavaScript isn't supported and is stripped before saving or sending. This includes <script> tags, inline event attributes such as onclick, onload, and onmouseover, and javascript: URLs. Only http://, https://, and mailto: URL schemes are allowed in links. Unsupported tags and attributes are removed silently. Supported tags include html, head, body, style, table, tr, td, p, div, span, a, img, h1 to h6, ul, ol, li, and others. <form>, <input>, <script>, <iframe>, and <video> aren't allowed.

Keep HTML under 100 MB. Larger HTML content can't be saved.

Add personalization

Like template emails, you can personalize HTML emails using the same visitor and account metadata token syntax as the block-based editor.

Use case Syntax Example
Visitor field, no fallback {visitor.propertyname/} {visitor.email/}
Account field, with a fallback default {account.propertyname|default/} {account.name|Your company/}
  • Supported roots are visitor and account.
  • You can add up to 20 personalization tokens per email.
  • Default values are capped at 100 characters.

Add an unsubscribe link

Marketing emails must include an unsubscribe token before you can save or test them.

  1. In the HTML editor toolbar, select Add Unsubscribe. This button appears for marketing emails only. Transactional emails don't require an unsubscribe link.
  2. Pendo inserts the unsubscribe token wrapped in a clickable link: <a href="{{ UnsubscribeURI }}">Unsubscribe</a>. When the email sends, Pendo replaces the token with a working, per-recipient unsubscribe link.
  3. You can also type the token directly into your HTML instead of using the button. Write it exactly as {{ UnsubscribeURI }}, with a space after {{ and before }}, and always wrap it in an <a> tag. A bare token with no surrounding link is valid but gives recipients no way to open it.

Important: If a marketing email's HTML doesn't include {{ UnsubscribeURI }}, Pendo shows a warning and keeps both Save and Send test email disabled until you add the token. Keep the unsubscribe link visible at all times, and remove any display: none or similar CSS that could hide it.

Unsubscribe behavior otherwise matches template emails. Once a recipient unsubscribes, they stop receiving all Orchestrate marketing emails, regardless of segment. See "Unsubscribe settings" in Create and send an email.

Save your email

Select Save in the HTML editor. Save is disabled until you've made a change and, for marketing emails, until the unsubscribe token is present. When you save, Pendo sanitizes and stores your HTML, and the preview on Email details updates immediately.

If saving fails, Pendo shows an error notification, the editor stays open, and your edits aren't lost.

Configure settings, recipients, and scheduling

These work the same as template-based emails, including the subject line, sender details, recipient metadata, segment, and scheduling options. See "Configure email settings," "Choose your recipients," and "Schedule delivery" in Create and send an email.

Send a test email

  1. In the Email template card, select Send a test email.
  2. Enter recipient email addresses, pressing Enter after each.
  3. Select Send email.

Send a test email is disabled if:

  • Email settings are incomplete, such as a missing From address or Subject.
  • The code panel is empty.
  • The unsubscribe token is missing, for marketing emails.

Send or activate your email

Sending and activating an HTML email works the same as a template email. See "Send or activate your email" in Create and send an email.

What HTML emails don't support yet

  • Adding an HTML email to a journey. HTML emails support standalone sends only.
  • Per-element click analytics. Opens, clicks, and unsubscribes roll up at the whole-email level.
  • Themes, localization, the AI email builder, API-first send, and Pendo code blocks.
  • Switching an existing email between the HTML editor and the block-based Visual Design Studio.
Was this article helpful?
0 out of 0 found this helpful