Skip to main content

Documentation Index

Fetch the complete documentation index at: https://kb.aampe.com/llms.txt

Use this file to discover all available pages before exploring further.

The Aampe Email Configurator helps turn static HTML email templates into dynamic templates with Aampe-ready placeholder fields. It is best understood as a setup tool. You start with existing email HTML, mark which parts should become dynamic, preview the result, and then hand the configured template off for use in your email workflow.
It is NOT:
  • a drag-and-drop email builder
  • your sending platform
  • a replacement for Composer

​
Why it matters

Email templates often already exist, but they are usually static and hard to personalize safely. The configurator helps you:
  • reuse existing email templates instead of rebuilding them
  • mark headlines, paragraphs, images, links, and buttons as dynamic fields
  • preserve advanced code such as JSON-LD and template syntax
  • preview the finished template before handoff
In practice, this has been especially helpful for teams importing real customer HTML from platforms like Braze, Customer.io, and SFMC.

​
How it works

The tool follows a three-step workflow:
  1. Add HTML
  2. Configure Fields
  3. Preview and Export

​
Step 1: Add Original HTML

Bring your HTML email template into the editor in one of three ways:
  • paste HTML directly into the editor
  • upload an HTML file
  • load a sample template from Saved Templates
We have built-in sample templates like product recommendations, these samples are read-only and are useful for learning the workflow before using your own HTML.

​
Cleanup HTML

Do not use Cleanup HTML if your template includes:
  • JSON-LD structured data
  • Jinja2 template tags
  • Liquid template tags
  • custom script blocks
Those should be added or preserved through the code editor in Step 2 instead. This is feature is in Beta, please use with caution. Always have a backup of your template before using the cleanup feature.
After loading HTML, you can use Cleanup HTML to sanitize the template.It helps with:
  • removes script blocks
  • removes noscript blocks
  • strips tracking-pixel images
  • removes data attributes and inline event handlers
  • preserves Outlook-specific MSO conditional comments
Use Cleanup HTML if the preview is blank or if you want a cleaner baseline for editing.

​
Render Preview

Click Render Preview to see a live rendering of your HTML. When preview mode is active, the Continue to Configure Fields button stays visible at the top of the editor panel.

​
Save and Load

You can save your work at any time with Save Template and reload it later through Saved Templates. Keep in mind:
  • templates are stored in your browser’s local storage only
  • they are not synced across devices
  • always save a backup by downloading or copying the final template

​
Step 2: Configure Fields

This is the core step. You assign dynamic placeholder fields to specific parts of the email by clicking directly in the live preview.

​
Clicking to assign a field

  1. Hover over the preview and let elements highlight.
  2. Click an element.
  3. Enter a field name and choose a field type.
  4. Confirm to create the placeholder.
The selected element is then marked in the template source.

​
Tagging only part of an element

If you want to tag only part of a paragraph, bullet, or mixed-content block:
  1. Click and drag to select the exact text you want.
  2. Release the mouse.
  3. Click inside the highlighted element.
  4. Choose Specific text only.
This is helpful when an element contains both bold and plain text, or when only one span inside a larger block should become dynamic.

​
Supported Dynamic fields

When building out the email template, use a {{fieldname--field}} placeholder to designate dynamic fields. Refer to the following syntax to insert dynamic fields:
ElementDynamic field format
Single line header{{headline--field}}
Another Single line header{{headline_2--field}}
Multi-line Body{{body--multiline}}
Another Multi-line Body{{body_2--multiline}}
Button labels{{button--field}}
Another button label{{button_2--field}}
Button URL{{button_url--link}}
Image URL for image components{{image_url--image}}
Image Link (on click of image){{image_url--link}}
  • If you’re comfortable editing HTML, you can place the dynamic fields anywhere. Image URLs, font sizes, or text.

​
Notes on supported fields

The subject and preheader fields are automatically added to every template. You do not need to assign them manually. Both are visible in the envelope bar above the email preview. When you click a button or linked element, you can choose between:
  • the visible CTA text
  • the destination URL
  • a general single-line text replacement
If an image is wrapped in a link, clicking the image also lets you target the wrapping link URL.

​
Target selection

For text elements, you can choose whether the field should replace:
  • the entire element content
  • only the selected text
  • the parent container

​
JSON-LD, scripts, and custom code

If your template contains JSON-LD or other script blocks, the preview shows blue info badges at the top of the iframe.These scripts are not rendered as visible email content, but they are preserved in the exported HTML.Use the Edit HTML code editor in Step 2 to add or maintain:
  • JSON-LD
  • Jinja2 syntax
  • Liquid syntax
  • any other custom code that should survive to export unchanged
Code editor changes are preserved even if you continue assigning fields from the preview.

​
Viewport preview

Desktop is the default view and You can switch between Mobile (375px) and Desktop (800px).

​
Managing fields

The field list on the right shows every configured field. You can rename or delete most fields. The subject and preheader fields are pinned and cannot be removed.

​
Step 3: Preview and Export

Preview mode lets you type real values into each configured field and see exactly how the email will look before final handoff.

​
Filling in preview values

Each field appears in a form under Preview. As you type values, the email preview updates live. This includes:
  • subject
  • preheader
  • text fields
  • image URLs
  • links
  • button labels

​
Email envelope bar

Above the email body preview, the tool shows a two-row bar for:
  • Subject
  • Preview, meaning preheader
These values update instantly as you type.

​
Hover highlighting

When you hover over a field row in the left panel, the matching area in the preview is highlighted so you can verify that each field targets the correct element.

​
Final handoff

Click Export Template to open the handoff panel. It guides you through:
  1. Copying the configured HTML
  2. Opening Aampe Composer so you can paste it into the email template editor
You can also set a filename and download the HTML file directly. Important:
  • the final HTML contains placeholder tokens, not preview values
  • custom code such as JSON-LD, Jinja2, and Liquid is preserved verbatim

​
Best practices

  • start with a sample template if you want to learn the workflow quickly
  • keep field names short and descriptive
  • drag-select only the text you want when tagging part of a larger block
  • use the code editor for JSON-LD, Jinja2, and Liquid syntax
  • preview at both 375 px and 800 px widths before final handoff
  • save often and keep a backup
  • start simple if your team is new to email personalization, using subject, preheader, and a few safe text fields first

​
Common questions

​
Can I use this without having my own HTML ready?

Yes. You can start with one of the built-in sample templates from Saved Templates.

​
What kinds of things can I tag as fields?

You can tag text, long-form text, images, links, button labels, button URLs, video URLs, subject, and preheader.

​
Do I need to add subject and preheader manually?

No. The tool automatically adds both fields to every template.

​
Will custom template syntax survive?

Yes. JSON-LD, Jinja2, Liquid, and other custom code added in the code editor are preserved through final output.

​
Why does the subject and preheader bar show placeholders instead of real text?

In Step 2, the bar shows placeholder tokens. In Step 3, once you enter preview values, it shows the actual typed text.

​
What happens if copy to clipboard fails?

Use the download option instead and copy the HTML from the downloaded file.

​
Troubleshooting

​
The preview is blank or broken

Use Cleanup HTML in Step 1. Some email HTML contains scripts, noscript blocks, or tracking pixels that can interfere with the preview.

​
My JSON-LD or template tags disappeared

Do not use Cleanup HTML on templates that contain script blocks or template control syntax. Add or preserve those through the Step 2 code editor instead.

​
Fields are not appearing after I click an element

Make sure you clicked a valid element and entered a field name. If the placeholder syntax was manually edited and became malformed, delete the field and assign it again.

​
I want to tag a button URL and its label separately

Tag the button URL and the button label as separate fields.

​
Saving or loading templates is failing

Templates are stored in browser local storage, which has a size limit. If storage is full, keep the HTML file as a backup instead.

​
The final HTML is not rendering correctly in my email client

Test the final HTML in the target email client. Some clients strip or alter CSS, and that behavior is outside the scope of the configurator itself. Also note that real setup feedback included cases where making a header dynamic affected its styling and required follow-up correction. If a fielded element looks visually off, inspect both the placeholder placement and the surrounding HTML and CSS rather than assuming the field itself is wrong.