How to Build a Salesforce Email Template With a Free Drag-and-Drop Builder

Salesforce gives you several ways to make an email template, and none of them is a pleasant place to design one. The Lightning template editor is a rich text box. Email Template Builder is drag-and-drop, but it has component limits and doesn’t reach every place you send from. Account Engagement (the product that used to be called Pardot) has its own builders, again with their own rules.

What every one of them does accept is HTML. So a practical approach is to design the email somewhere comfortable, export clean HTML, and paste it into Salesforce. This guide walks through that with our free email template builder, which needs no signup, but the Salesforce steps work the same for HTML from anywhere.

A note before we start: Salesforce changes its UI often, and some paths differ by edition and by whether you use Lightning Experience or Salesforce Classic. Every menu path below comes from Salesforce’s own help pages as of September 2026, and each section links to the page it came from. If your org looks different, those pages are the source of truth.

Step 1: Design the email and export the HTML

Open the free email template builder and either start from one of the templates or from a blank canvas. Drag in headings, text, images, buttons, columns, and a footer, then adjust the theme colors and fonts.

A few things to set up while you design, because they make the Salesforce side easier:

• Keep the width at 600px. It’s the builder’s default and fits the reading pane of desktop clients.
• Use image URLs, not uploads. The builder references images by URL, because email clients can’t show an image that only exists on your computer. If you already know where the images will live in Salesforce (see the images section below), use those URLs now.
• Fill in the preview text. It becomes the hidden preheader at the top of the HTML.
• Don’t worry about merge fields yet. Use the builder’s merge tags ({{ subscriber.first_name }} and so on) as placeholders. We’ll swap them for Salesforce syntax in step 3.

When the design is done, click Get HTML, then Copy HTML or Download. What you get is a complete HTML document: table-based layout, inline styles, a VML button for Outlook on desktop, Outlook conditional comments, and a single mobile breakpoint. That’s the same structure email developers write by hand, and it’s the reason the file looks dense.

Keep the downloaded file. If Salesforce’s editor mangles something, you want the original to go back to.

Step 2: Paste the HTML into Salesforce

Where it goes depends on which part of Salesforce sends the email. There are three common cases.

Lightning Email Templates (Sales Cloud and Service Cloud)

These are the templates your reps pick from the email composer on a record, and the ones used for list email from Lightning Experience. Salesforce’s steps:

1. From the App Launcher, select Email Templates.
2. Click New Email Template and enter a name.
3. Click Select Folder, pick a folder, and confirm.
4. Add a subject. Merge fields in the subject have to be typed by hand.
5. Optionally set a Related Entity Type if the template should only be used from one kind of record.
6. In the HTML Value area, click the Source icon, which switches the editor to raw HTML, and paste your exported HTML.
7. Save.

Source: Modify or Create Email Templates in Lightning Experience and Create an Email Template in Lightning Experience. Salesforce lists Lightning email templates as available in Essentials, Professional, Enterprise, Performance, Unlimited, and Developer editions.

After saving, reopen the template and check the Source view again. The Lightning editor is a rich text editor, and rich text editors tend to tidy up HTML they didn’t write. Compare it against your original, especially the <head> styles and the Outlook-only blocks. If something important is gone, the Classic HTML template below is the more literal option.

Email Template Builder (the drag-and-drop one inside Salesforce)

Salesforce also has its own drag-and-drop tool, Email Template Builder, reached with the Edit in Builder button on a template’s detail page. It has an HTML component, so you might be tempted to paste the whole export into it. In most cases that won’t work: Salesforce limits each component’s property value to 10,000 characters, and a designed newsletter’s HTML is usually well past that. Salesforce’s own advice when you hit the limit is to split the HTML across several HTML components (Considerations for Using Email Template Builder).

There are a couple of other things to know from Salesforce’s guidelines: HTML comments are listed as “active content” that isn’t supported in HTML or Rich Text components, though Microsoft Office (MSO) tags are allowed; and Email Template Builder templates aren’t available in the Outlook and Gmail integrations or Experience Cloud. For a template designed elsewhere, the plain Lightning template in the previous section is the simpler home.

Classic HTML templates (“Custom (without using Classic Letterhead)”)

Salesforce Classic’s custom HTML templates take your HTML more or less as written, which makes them the most faithful option for a hand-built or exported design. The catch: per Salesforce, these templates “can be used, but not created, in Lightning Experience.” To create one:

1. If you can edit public templates: from Setup, enter Email Templates in the Quick Find box and select Classic Email Templates. Otherwise, go to your personal settings and search for Templates, then choose Email Templates or My Templates, whichever appears.
2. Click New Template, choose Custom (without using Classic Letterhead), and click Next.
3. Pick a folder, tick Available For Use, name the template, and enter a subject.
4. Click Next, paste your HTML as the HTML source, and click Next again.
5. Leave the text-only version blank unless you have a reason not to. Salesforce generates it from the HTML when you send from the UI, though you have to supply it yourself if you send the template through the API or Apex.
6. Save, then use Send Test and Verify Merge Fields to check it.

Source: Create Custom HTML Email Templates in Salesforce Classic. Creating these needs the Edit HTML Templates permission. Visualforce email templates are another Classic option, but they’re code you write in Visualforce markup, not somewhere to paste an export.

Account Engagement (Pardot) email templates

Account Engagement is where marketing email usually lives: list emails, autoresponders, and Engagement Studio. Its classic builder gives you direct access to the HTML. From Create an Email Template in Account Engagement:

1. Open the Email Templates page. In the Account Engagement app, select Marketing | Emails | Templates. In the Lightning app, select Account Engagement Email, then Templates.
2. Click Add Email Template and enter a name (internal only).
3. Choose a folder and a campaign, and pick the email type. HTML emails also carry a plain-text version.
4. Choose which kinds of email can use the template: list emails, autoresponders, and Engagement Studio are on by default, and one-to-one emails are optional. Save.
5. When asked for a layout, click Skip to start from scratch, since your export already has its own structure.
6. On the Building tab, switch to the HTML view and paste your exported HTML. The Text view holds the plain-text version, which is worth reviewing (Navigating the Classic Builder).
7. Test it on the Testing tab, then click Publish to Template so it shows up when someone creates an email.

Account Engagement also has a newer Lightning email builder based on Salesforce’s Email Content Builder. It uses the same kind of HTML component as Email Template Builder, with the same 10,000-character limit per component, so the classic builder’s HTML view is the easier place to paste a full design.

Step 3: Replace the merge tags with Salesforce merge fields

The builder writes merge tags in a generic Liquid-style format so you can map them to any platform. Salesforce won’t recognise them, so they have to be replaced before you send. Here’s how the builder’s tags map:

Watch the braces, because they’re the most common mistake:

• Lightning email templates use three. Salesforce’s syntax guide: three opening curly braces, the object name, a period, the field name, and three closing braces, as in {{{Recipient.FirstName}}}. Recipient fields work across contacts, leads, and person accounts, but not every field works for every recipient type, and none work when the recipient is a user (Use the Handlebars Merge Language). If you want to be sure of a field name, insert it with the merge field picker rather than typing it.
• Account Engagement HML uses two for prospect fields, like {{Recipient.FirstName}}, {{Recipient.LastName}}, and {{Recipient.Email}}, and {{Unsubscribe}} and {{EmailPreferenceCenter}} for the subscription links (Handlebars Merge Fields in Account Engagement). A few organization fields, like {{{Organization.Address}}}, use three, so copy from that reference table rather than guessing.
• Legacy %%tags%% only exist in Account Engagement business units bought before June 12, 2020, and Salesforce recommends moving to HML (Personalize Account Engagement Emails with Variable Tags). The full list is in Salesforce’s Variable Tags reference.
• Classic HTML templates use the older Salesforce Merge Language, with one curly brace and an exclamation mark, like {!Contact.FirstName}. The Classic editor has a merge field picker too.

Some of the builder’s templates use a fallback, like {{ subscriber.first_name | default: "there" }}. The | default: filter is Liquid, which Salesforce doesn’t run, so delete the whole tag and write the fallback another way. In Account Engagement, HML supports conditionals, so Hi {{#if Recipient.FirstName}}{{Recipient.FirstName}}{{else}}there{{/if}}, does the job. In a Lightning template, the simplest fix is a greeting that reads fine without a name.

The unsubscribe link needs its own decision:

• In Account Engagement, put {{Unsubscribe}} (or {{EmailPreferenceCenter}}) in the footer link’s href, replacing {{ unsubscribe_url }}.
• In a Lightning template for one-to-one sales email, there’s usually no unsubscribe link. We didn’t find a documented unsubscribe merge field for Lightning templates, so either remove the footer link or point it at your own preference page. If you’re sending marketing email to a list, it probably belongs in Account Engagement or Marketing Cloud, which manage opt-outs for you.

The fastest way to do the replacements is find-and-replace in a text editor on the downloaded file, before you paste. Then search the file for {{ (two braces and a space). Salesforce’s tags don’t have a space after the braces and the builder’s do, so anything that search finds is a tag you missed.

Step 4: The gotchas

Images need a public home

Every image in the export is an <img src="..."> pointing at a URL. That URL has to be public and should start with https://, which Salesforce’s guidelines specifically ask for in HTML image tags. Options:

• Account Engagement Files. In the Account Engagement app, go to Marketing | Content | Files; in the Lightning app, Content, then Files. Uploaded files get a public URL you can use in the HTML. Salesforce’s warning is worth repeating: anything you host there is publicly reachable, so don’t upload anything sensitive (Upload Files to Account Engagement).
• Salesforce CMS can supply images to Email Template Builder components for users with an Account Engagement license, if a default channel is set up and the user contributes to a CMS workspace tied to the Lightning Content Builder channel.
• Salesforce Files inserted through the Lightning editor. When you insert an image this way, Salesforce converts it to a content asset link when the template is saved, so you can’t just copy the file’s public link into your HTML.
• Your own website or CDN. Often the least friction: upload the images wherever your site’s images live and use those URLs in the builder from the start.

SVG images aren’t supported in Email Template Builder, and many email clients don’t show them anyway. Use PNG or JPG.

The editor and the size limits

Salesforce’s own advice is to use inline styles because some email clients ignore <style> tags, which is how the builder exports anyway. Its guidelines also say the <style> tag isn’t supported in rich text fields that also contain merge fields. The exported layout is inline-styled, so it holds up without the <style> block, but the mobile breakpoint lives there. If it gets stripped, the email still displays, just without the phone-specific adjustments.

Size is the other thing. According to Salesforce’s article on email body character limits, the email composer in Lightning Experience has an org-level limit of 131,072 characters for the email body, and all HTML and line breaks count toward it. A template from the builder is normally well under that. If your rep’s thread plus the template goes over, though, the send fails. Keeping images as URLs, not pasted inline, keeps the size down.

Test before anyone sends it

• In Lightning, send the template to yourself from a record, and use a real contact or lead so the merge fields actually resolve. Salesforce recommends this for Email Template Builder templates, and it’s just as useful for the others.
• In Classic, use Send Test and Verify Merge Fields.
• In Account Engagement, use the Testing tab on the template.

Check the test in Outlook on desktop and in Gmail on a phone at minimum. Those two account for most rendering surprises, and they’re the two the export’s Outlook button and mobile breakpoint are there for.

Unsubscribe links in Account Engagement aren’t optional

Salesforce is explicit: “Every list email must include an unsubscribe or email preference page link” (Manage Email Unsubscribe Settings). If you forgot to swap the builder’s {{ unsubscribe_url }} for {{Unsubscribe}} or {{EmailPreferenceCenter}}, fix it before you try to send. Beyond Salesforce’s rule, laws like CAN-SPAM, and Gmail’s and Yahoo’s sender requirements, expect a working way to opt out of marketing email.

If you’re sending newsletters, not sales email

A lot of teams end up in Account Engagement only to send a newsletter, and the per-contact pricing adds up. If that’s you, Broadcast is self-hosted email marketing software with a one-time license: you run it on your own server and send through your own provider, like Amazon SES or Postmark. It has the same drag-and-drop builder, and its merge tags are the ones the free builder already uses, so an export pastes in unchanged. It isn’t a CRM and won’t replace Salesforce for sales email. For list email alone, it’s worth a look on the pricing page.