Jumploon

Templates

Templates keep email design out of your code. Write the HTML once, with {{placeholders}}, and send it with data.

Jumploon templates use Handlebars and get IDs that start with d-. You can write HTML directly or build a template in the dashboard's visual designer.

Create a template

In the dashboard, open Templates and click New template. New templates open in the drag-and-drop builder:

  • Drag blocks (heading, text, button, image, columns, divider, spacer, social links, footer, custom HTML) from the left panel onto the email, or click one to add it after the selected block.
  • Drag blocks on the canvas to reorder them, or into and out of columns. Click a block to edit its content, alignment and colors in the right panel.
  • Start from a ready-made layout (Welcome, Newsletter, Receipt) in the Layouts tab, and set the background, accent color, font and width with no block selected.
  • In text, use **bold**, *italic* and [label](https://…). Handlebars {{variables}} work in every field.
  • Switch between desktop and mobile, and between editing and an exact preview of the HTML that gets sent. Columns stack on phones. Undo and redo with ⌘Z and ⇧⌘Z.

When you save, the builder generates table-based HTML for Outlook, Gmail and Apple Mail, plus a plain-text version. Switch to HTML to edit the markup by hand instead.

Through the API:

curl https://api.jumploon.com/v3/templates \
  -H "Authorization: Bearer $JUMPLOON_API_KEY" \
  -H "Content-Type: application/json" \
  -d '{
    "name": "Order shipped",
    "subject": "Order #{{order.number}} is on its way",
    "html_content": "<p>Hi {{first_name}},</p><p>Your order ships today.</p>{{#each order.items}}<p>{{this.name}} × {{this.qty}}</p>{{/each}}",
    "plain_content": "Hi {{first_name}}, your order ships today."
  }'

Send with a template

With POST /emails:

curl https://api.jumploon.com/emails \
  -H "Authorization: Bearer $JUMPLOON_API_KEY" -H "Content-Type: application/json" \
  -d '{
    "from": "Acme <orders@acme.com>",
    "to": ["ada@example.org"],
    "template": {
      "id": "d-8f2c9a7b3e1d4c5f",
      "variables": { "first_name": "Ada", "order": { "number": 1042, "items": [{ "name": "Mug", "qty": 2 }] } }
    }
  }'

With the v3 API, use template_id and dynamic_template_data on each personalization. An explicit subject on the request or personalization overrides the template's subject.

Handlebars basics

SyntaxDoes
{{name}}Inserts a value, HTML-escaped
{{{html}}}Inserts a value without escaping. Only use it for HTML you trust.
{{#if paid}}…{{else}}…{{/if}}Conditional
{{#each items}}{{this.name}}{{/each}}Loop

Versions

Every time you save a template, the previous version is kept. List them with GET /v3/templates/:id/versions and roll back with POST /v3/templates/:id/versions/:version/restore, or use the History panel in the dashboard.

Endpoints

MethodPath
POST/v3/templatesCreate
GET/v3/templatesList
GET/v3/templates/:idGet one
PATCH/v3/templates/:idUpdate name, subject, html_content, plain_content
DELETE/v3/templates/:idDelete
GET/v3/templates/:id/versionsList saved versions
POST/v3/templates/:id/versions/:version/restoreRestore a version