HTML Email Setup for ASP Forms

As part of your form confirmation emails, you may wish to apply pre-made HTML to include specific copy, imagery, and branding.

An HTML email is an email built using HTML code rather than plain text. This allows for greater design flexibility, including branded layouts, images, buttons, colours, and styling, helping your emails better reflect your organisation’s visual identity.

Outgoing emails can be sent automatically from the system once a user has successfully completed any ASP-built form on your website. A general overview of form setup can be found in the following guide, which covers the core configuration steps:
https://support.asp.events/hc/en-us/articles/360017711958-Form-Setup-How-to-Guide

🛠️ Applying Pre-Made HTML to an Outgoing Email

To add pre-made HTML to a form email, follow these steps:

1. Navigate to Modules > Forms.

2. Select the form you wish to edit and open the Email tab.

3. Select Create Email and complete the following fields as required:

   • When to Send

   • Email From

   • Email Alias

   • Email To

   • Subject

4. In the Body field, add the main content that will appear in the outgoing email. At the top of this field, select the code icon in the toolbar.

5. Paste your externally created HTML into the code editor.

6. Save your changes and thoroughly test the email by sending it to your own email address before making it live.

✅ Best Practices for HTML Emails

To ensure your HTML emails display correctly and provide the best user experience, follow these best practices:

• 📧 Test across email clients
  Always test your email in multiple inboxes (e.g. Gmail, Outlook, Apple Mail).

• 🖼️ Use hosted images
  Ensure images are hosted online and referenced via secure (HTTPS) URLs.

• 📐 Keep layouts simple
  Table-based layouts are more widely supported than modern CSS techniques.

• 🔤 Use inline styles
  Many email clients remove embedded or external stylesheets.

• 📱 Design for mobile
  Ensure content remains readable and usable on smaller screens.

• 🔍 Avoid unsupported scripts
  JavaScript and advanced CSS are not supported in most email clients.

• 👀 Include fallback content
  Ensure critical information is accessible even if images fail to load.

🧩 Conditional Formatting for Email Clients & Browsers

Some email clients—particularly Microsoft Outlook desktop versions—use alternative rendering engines that can affect how HTML emails are displayed. Outlook uses Microsoft Word to render HTML, which supports a limited subset of HTML and CSS.

In many cases, conditional formatting is not required. If your email displays correctly across major email clients using standard HTML email practices, additional client-specific code may be unnecessary.

Conditional comments should only be used where display issues are isolated to specific clients and cannot be resolved through standard HTML techniques.

🧪 Sample Conditional Comment Usage

The following example demonstrates how conditional comments can be used to apply Outlook-specific formatting. This may not be required for all email templates.

<!--[if mso | IE]>
<table width="600" cellpadding="0" cellspacing="0">
  <tr>
    <td>
<![endif]-->

<table width="100%" style="max-width:600px;" cellpadding="0" cellspacing="0">
  <tr>
    <td style="padding:20px; font-family: Arial, sans-serif;">
      <p style="margin:0;">
        This content will display normally in most email clients.
      </p>
    </td>
  </tr>
</table>

<!--[if mso | IE]>
    </td>
  </tr>
</table>
<![endif]-->

🧰 Outlook Display Troubleshooting (Quick Guide)

If your HTML email does not display as expected in Microsoft Outlook, consider the following checks:

• 📄 Check Outlook version
  Rendering behaviour can vary between Outlook desktop, Outlook web, and older versions.

• 📐 Review layout structure
  Ensure table widths are fixed where necessary and avoid unsupported CSS such as flexbox, position, or float.

• 🎨 Verify background and padding
  Outlook may ignore certain padding, margin, or background-image styles.

• 🔠 Confirm font support
  Custom web fonts are not supported in most Outlook desktop versions. Use fallback system fonts.

• 🖼️ Test with images disabled
  Some Outlook users block images by default. Ensure content remains readable without images.

⚠️ Support Notice

While ASP provides guidance on best practices for HTML email setup, we are unable to offer full support for individual or local Outlook configurations, including user-specific settings, security policies, or third-party add-ins.

Testing across multiple devices, email clients, and environments is strongly recommended prior to launch.