# Writing Your Own Email HTML

These pages are for developers and designers who write email HTML themselves and bring it into Envoke through the Templates, Messages, or Send API, or paste it into the Edit HTML page. They explain what the HTML needs so that it can be edited in Envoke's drag-and-drop editor, and what Envoke does to it between your code and the inbox.

---

## Two Editors

Every message and template in Envoke opens in one of two editors, and when HTML arrives through the API, one line decides which:

```html
<meta name="TEMPLATE_VERSION" content="230609">
```

| Your HTML | Opens in |
|---|---|
| Contains `<meta name="TEMPLATE_VERSION"` | The **drag-and-drop editor**, where each section and block can be selected, restyled, moved, duplicated, and deleted |
| Does not contain it | Envoke's older HTML editor |

The check is an exact text match on `<meta name="TEMPLATE_VERSION"`, so write the tag exactly as above: lower-case `meta`, the `name` attribute first, and double quotes. `<meta content="230609" name="TEMPLATE_VERSION">` or single quotes do not match. The `content` value is never read; `230609` is the value Envoke's own templates use.

The meta tag only chooses the editor. For the sections and blocks to be editable, the HTML also needs the structure described in [Making HTML Editable](https://envoke-developers.pages.dev/email-html/editable-templates/).

---

## What Envoke Does to Your HTML

| Stage | What happens | Read more |
|---|---|---|
| Saved through the API or the Edit HTML page | Stored exactly as sent. Nothing is checked or cleaned, apart from the APIs' 200 KB size limit. | [Getting HTML into Envoke](https://envoke-developers.pages.dev/email-html/getting-html-into-envoke/) |
| Opened in the drag-and-drop editor | The editor adds the classes and attributes it needs and replaces Envoke's style block with its current version. | [What the Editor Adds and Changes](https://envoke-developers.pages.dev/email-html/editable-templates/#what-the-editor-adds-and-changes) |
| Saved in the drag-and-drop editor | The document is rewritten: a standard doctype and `<HTML>` tag, `<style>` blocks other than Envoke's own removed, scripts removed. | [Styles, Fonts, and Mobile](https://envoke-developers.pages.dev/email-html/css-and-mobile/) |
| Sent | Merge tags are filled in for each contact, links can be tracked, Envoke's footer is added if there is no unsubscribe link, and a plain-text version is generated. | [What Happens When Envoke Sends](https://envoke-developers.pages.dev/email-html/what-happens-at-send/) |

---

## Checklist

- The `TEMPLATE_VERSION` meta tag, written exactly as shown above.
- A table layout: a 680-pixel content table holding 660-pixel sections.
- Content in sections, rows, and editable regions, with one editable region per row.
- Inline styles only, apart from Envoke's style block; no scripts.
- Images on absolute `https://` URLs, each with a `width` attribute and `alt` text.
- Either a `{@pref-0}` unsubscribe link and the `{@brand-address}` postal address, or neither, so that Envoke adds its own footer.
- Merge tags written in lower case, exactly as documented.
- Well under 100 KB of HTML, because Gmail clips longer emails.
- Opened in the drag-and-drop editor with every block clicked, and a test sent, before the first real send.

---

## Pages in This Section

| Page | Covers |
|---|---|
| [Getting HTML into Envoke](https://envoke-developers.pages.dev/email-html/getting-html-into-envoke/) | The APIs and the Edit HTML page, size limits, and which editor the HTML opens in |
| [Making HTML Editable](https://envoke-developers.pages.dev/email-html/editable-templates/) | The structure the drag-and-drop editor needs, with a complete template to start from |
| [Block Reference](https://envoke-developers.pages.dev/email-html/blocks/) | Markup for text, image, button, divider, and video blocks |
| [Styles, Fonts, and Mobile](https://envoke-developers.pages.dev/email-html/css-and-mobile/) | Inline styles, Envoke's style block, fonts, mobile classes, Outlook, dark mode |
| [Merge Tags and Conditionals](https://envoke-developers.pages.dev/email-html/merge-tags/) | Contact fields, custom fields, message and account tags, conditionals |
| [Unsubscribe Link, Address, and Footer](https://envoke-developers.pages.dev/email-html/unsubscribe-and-footer/) | `{@pref-0}`, `{@brand-address}`, and the footer Envoke adds when they are missing |
| [What Happens When Envoke Sends](https://envoke-developers.pages.dev/email-html/what-happens-at-send/) | Every change Envoke makes to the HTML at send time |
| [Accessibility and Testing](https://envoke-developers.pages.dev/email-html/testing-and-accessibility/) | Language, alt text, headings, contrast, and a test checklist |

---

*Full reference, OpenAPI description, and Postman collection: [developers.envoke.com](https://developers.envoke.com).*
