Email User Interface (UI)

The ACE Email User Interface (UI) incorporates standard application controls that allow users to format text and tables effortlessly. Additionally, it empowers users to easily insert images, fields, and loops from list controls.

Email Template Editor

The template editor in ACE Email offers flexibility with two options:

• HTML Mode: Enables fine-tuning and editing of email contents, including the ability to import/export HTML code for collaboration.

• WYSIWYG Mode: Provides a user-friendly editing experience, allowing users to directly view and manipulate content in its final form without coding.

Email UI Features

The ACE Email UI incorporates a robust editor with the following features:

• ACE Fields: Insert fields dynamically into templates.

• Browser Tooltips: Display helpful hints.

• Copy/Paste: Keyboard shortcuts supported.

• Edit: Modify text and layout.

• Emojis: Add character to your messages.

• Find and Replace: Quickly update text.

• Formatting: Apply styles to text and tables.

• Insert: Add images, links, and more.

• Links for URLs: Embed clickable URLs.

• Source Code: Access HTML formatting.

• Special Characters: Add unique symbols.

• Tables: Create and format tables.

• Undo/Redo: Easily revert changes.

Cloning Templates

Users can clone existing templates to create new ones, saving time by using a pre-existing template as a starting point.

Creating Email Profile

To ensure that your template works correctly, make sure to open an account that contains the fields you plan to include in the template for testing purposes.

Setup → Email → Profiles → New

1. Select the Category

2. Add the Identifier

3. Enter the Subject 

4. Click Save

5. Open the new profile

6. Proceed to the Template Editor
   

 By default, ACE will automatically add the following ACE Fields:

 

You can customize the layout of these fields by deleting or rearranging them per your requirements.

Table Formatting

The Table dropdown in an email profile enables users to define the number of rows and columns for a table, which can also be used with ACE Email Loops to present data associated with multiple records.

Best Practice:

• Use only one table per email profile. Attempting to use more than one table looping property in the same email will present incorrect data in one or both tables.

• Always test emails to ensure proper rendering across email hosts, as display formats can vary. Use tools like Litmus or Email on Acid  to preview emails before sending.

Table Structure and Properties

Row Properties

1. Header Rows:

   1. Set the top row to “Header” to highlight table headings.

   2. Customize the header row background color in the Advanced tab for visual distinction.

2. Body Rows:

   1. Body row repeats for each account in the bundle loop. Use this row for account-specific variables.

3. Footer Rows:

   1. Set the bottom row to “Footer” to summarize or include static information (e.g., bundle totals).

   2. Background colors and other styles can be customized in the Advanced tab.

Cell Properties

• Customize individual cells in the Cell Properties submenu:

  • Set background colors for unique cell styles.

  • Adjust alignment, borders, and padding for precise formatting.

Example Workflow

1. Insert a Loop:

• Click on ACE Fields.

• Navigate to Loops and select the desired loop (e.g., [bundle_loop]).

• Once inserted, center your table between the [bundle_loop] fields (e.g., [bundle_loop] and [/bundle_loop]).

2. Create a Table:

• Insert rows for the Header, Body, and Footer.

• Use Header Rows for table headings (e.g., Account Number, Current Balance).

• Use Body Rows for account-specific details like ${debt.customerAccountNumber} and ${debt.currentBalance}.

3. Format Your Table:

• Apply distinct background colors to header, body, and footer rows using the Advanced tab for visual clarity.

• Customize individual cell properties, such as alignment, padding, and borders, for precise formatting.

4. Insert Variables:

• Add account-specific variables (e.g., ${debt.customerAccountNumber}) to the body rows.

• Add bundle-level variables (e.g., ${bundle.currentBalance}) to the footer row for totals or summaries.

5. Preview and Test:

• Check that the loop correctly replicates the body rows for each account.

• Ensure headers and footers remain static.

• Test your email across various hosts to confirm consistent formatting and rendering.

ACE Fields

This feature serves as a resource for locating fields that can be inserted into an email template.

To insert an ACE Field:

1. Click on ACE Fields

2. Click on Account Fields

3. Select/Search for the desired Field

4. Click on the Field
   

 

 

  

Loops

ACE offers several types of loops that you can use to iterate through data related to bundled accounts, payment or promise plans, or specific transactions and incorporate them into templates.

 

To insert a Loop:

1. Click on ACE Fields

2. Click on Loops

3. Select the Desired Loop

See Status Code Groups for more information. 

 

Insert Images

The File Manager's Public folder stores public-facing images for easy inclusion in email templates.

Using the Insert/Edit Image Function (For Single-Client Templates)

This method is ideal for templates designed for a single client and allows you to preview the logo directly within the editor.

1. Click on Insert 

2. Choose an image from the Image list drop-down menu (images in the image list are stored in the public folder)

3. Click Save 

 

Using Template Variables for Logos (For Multi-Client Templates)

If you need a template that dynamically updates the logo based on the client, use the following template variables:

• ${client.logo}: Displays the specific client’s logo.

• ${masterClient.logo}: Displays the primary or master client’s logo.

• ${client.consumerLogo}: Displays a consumer-specific logo for the client.

• ${masterClient.consumerLogo}: Displays a consumer-specific logo for the master client.

To use a template variable:

1. Place the variable where the logo should appear in the email body.

2. Save and test the template to confirm that the correct logo dynamically populates.

Exporting and Importing HTML Code

Exporting HTML Template:

1. Open the email template that you want to export the HTML code from

2. Locate the "Template File" section, click on the Cloud to download

3. Choose a destination to save the HTML file
   

 

Importing the HTML Template:

1. Click on New Profile

2. Select the Category

3. Add the Identifier

4. Enter the Subject 

5. Click Choose File to upload

6. Click Save
   

 

Editing HTML Code:

1. Click View

2. Click Source Code

3. The Source Code will display

4. Make appropriate HTML edits

5. Click Save 

6. Review your edits in the make any necessary edits or changes
   

 

Test Email

1. Click Apply 

2. Enter your email address and click Test 

3. Review the tested email template and make any necessary edits or changes

4. Click Save when you're satisfied with the template