Overview
Each Enterprise Service Management (ESM) project application has a set of notification templates which can be customized with specific content for the app. This allows for departments to notify others with useful information in a format that aligns with the organization's brand.
Important
If nothing is edited, or if these templates are turned off, then the ESM system will use the default layouts and content for that type of notification. The default layout utilizes HTML table formatting and contains a lot of project information which may not be useful to customers. It is strongly recommend that all notification templates be customized.
Tip
Notification templates are intended to be edited by individuals who are skilled and fluent in HTML and CSS. If a resource is not available within the department, then submit an
Enterprise Service Management request for assistance with crafting the desired solution.
In this article:
What materials do I need?
- Internet connectivity
- Web browser
- ESM TDWorkManagement access
- ESM App Admin role for applicable application
How do I use this technology?
Access Project App Notification Templates
- Open a web browser.
- Navigate to the UA ESM website.
- Login to UA ESM with your UA Email address and password.
- Click View Applications.
- Click the desired Project Application.
- On the right side of the screen, click the Settings (gear icon) button.
- Click Admin.
- Click Notification Templates.
Basic Template Edits
Warning
The ESM system intentionally does not use an HTML generator (aka WYSIWYG editor) since people use a variety of programs to read email that might allow or block certain HTML elements which may unintentionally impair readability of the message. A few suggestions to support as many platforms as possible are:
- Use inline CSS styles, instead of referencing external CSS file(s)
- Avoid using background images, as they are usually ignored
- Avoid using tables for layout, as they not recommended for accessibility reasons
- Use clean W3C validated HTML code
- Click the Event category containing the template to be edited.
- Click the Event Name of the template to edit.
- The <Template Name> Template will open in a new browser tab/window.
- Click into the Subject field and edit as desired. While this may vary between slightly between notification types, recommend values are:
Tip
The subject line cannot contain HTML or newline characters.
- Production:
<project app name> - {{TitleShort}} - <notification type> {{ActionName}} (e.g. UA IT Projects - {{TitleShort}} - Announcement {{ActionName}})
- Sandbox:
[TEST] <project app name> - {{TitleShort}} - <notification type> {{ActionName}} (e.g. [TEST] UA IT Projects - {{TitleShort}} - Announcement {{ActionName}})
- Click into the Body field.
- Edit the HTML as needed.
- Click Save.
- Click Show Preview button.
- Validate that you are satisfied with the preview example.
Note that editing these templates is not turning on or off system generated notifications of that type. Once templates are edited, and enabled, the ESM system will use the app specific notification template instead of the default system template.
Example Templates
Project Comment Added Template
<p style="font-size: 1.25rem;">{{{UpdateText}}}</p>
{{#NotificationRecipients}}
<p><strong>Notified:</strong> {{NotificationRecipients}}</p>
{{/NotificationRecipients}}
<div style="width: 75%; border: 1px solid #00583d; margin-top: 1.5rem; font-family: 'Segoe UI', Helvetica, Verdana, Arial, sans-serif;">
<div style="width: 100%; border: 0px; background-color: #4A5963; font-size: 1.5rem; font-weight: bold; color: #FFFFFF;">
<div style="padding:5px">Project Details</div>
</div>
<div style="width: 100%; border: 0px; background-color: #ffffff;">
<div style="padding: 5px;">
<p><strong>Project:</strong> {{Title}}{{ProjectName}}<br />
<strong>Project Manager:</strong> {{ManagerFullName}} ({{ManagerEmail}}) <br />
<strong>Department:</strong> {{AccountName}}<br />
<strong>{{ProjectOrWorkspaceLabel}} Type:</strong> {{FullTypeName}}<br />
<strong>Created:</strong> {{CreatedDate}} by {{CreatedUserFullName}}<br />
{{#StatusChanged}}
<strong>Old Status:</strong> {{OldStatus}}<br />
<strong>New Status:</strong> {{Status}}<br />
{{/StatusChanged}}
{{^StatusChanged}}
<strong>Current Status:</strong> {{Status}}<br />
{{/StatusChanged}}
{{#HealthChanged}}
<strong>Old Health:</strong> {{OldHealth}}<br />
<strong>New Health:</strong> {{Health}}<br />
{{/HealthChanged}}
{{^HealthChanged}}
<strong>Current Health:</strong> {{Health}}<br />
{{/HealthChanged}}
<strong>Percent Complete:</strong> {{PercentComplete}}<br />
<strong>Time Frame:</strong> {{TimeFrame}}<br />
{{#TimeBudget}}
<strong>Time Budget:</strong> {{TimeBudget}}<br />
{{/TimeBudget}}
{{#ExpensesBudget}}
<strong>Expense Budget:</strong> {{ExpensesBudget}}<br />
{{/ExpensesBudget}}
{{#TotalBudget}}
<strong>Total Budget:</strong> {{TotalBudget}}<br />
{{/TotalBudget}}
{{#Description}}
<strong>Description:</strong><br />
{{{Description}}}
{{/Description}}</p>
</div>
</div>
</div>
{{#IncludeTeamDynamixLinks}}
<p style="margin-top: 20px;"><span style="margin-left: 20px;"><a href="{{TDNextUrl}}" style="background-color: #4A5963; border: none; color: #ffffff; padding: 15px 32px; text-align: center; font-weight: bold; text-decoration: none; display: inline-block;" target="_blank">Open in TDWorkManagement</a></span> <span style="margin-left: 20px;"><a href="{{TDClientUrl}}" style="background-color: #4A5963; border: none; color: #ffffff; padding: 15px 32px; text-align: center; font-weight: bold; text-decoration: none; display: inline-block;" target="_blank">Open in Service Portal</a></span></p>
<p>In the event the buttons above are not functioning, you can click on one of the links below to open up the project in the applicable ESM interface.<br />
Open in TDWorkManagement: {{TDNextUrl}}<br />
Open in Service Portal: {{TDClientUrl}}</p>
{{/IncludeTeamDynamixLinks}}
Advanced Template Edits
Notification templates can have a variety of template fields included in the message if desired. The Insert Template Tag drop-down menu shows which fields are available for use. Once a field is selected from the list, a template tag which references the selected field is automatically inserted into the Subject or Body field, depending on which field you last selected. You can also manually type template tags into the template. The templates use Mustache template markup language, documented at https://mustache.github.io/mustache.5.html.
System default attributes are displayed first in the drop-down list and will simply display as a text label. These can be used in the templates like this:
{{{DescriptionShort}}}
Custom attributes are displayed after the system default attributes in the drop-down menu, and are displayed in the list with a text label followed by "(ID #XXX)". These can be used in the templates like this:
{{#AttributeXXXX}}<!-- Attribute Label -->{{Name}}: {{Value}}{{/AttributeXXXX}}
When the selected custom attribute has now value within a ticket, the section will not be displayed.
Next Steps
The following article will guide App Admins through the process of enabling ESM Notification Template(s) when ready for use.
Need additional help or have issues
For support, requests may be submitted anytime using the appropriate Enterprise Service Management form. Requests generate a Ticket which will be worked in order received and urgency by IT Employees with the knowledge and permissions to assist with the request.
For immediate assistance please review the Contact Us page for the appropriate support group.