Edit Enterprise Service Management Notification Template

Overview

Each Enterprise Service Management (ESM) ticketing application has a set of notification templates which can be customized with specific content for a department. 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 ticket 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 access
  • Web browser
  • ESM App Admin permissions

How do I use this technology?

Access Ticket App Notification Templates

  1. Login to ESM TDNext.
  2. Open ticketing app.
  3. Click Settings.
  4. Click Admin.
  5. 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
  1. Click the Event Name of the template to edit.
  2. The <Template Name> Template will open in a new browser tab/window.
  3. Click into the Subject field and edit as desired. While this may vary between departments, recommend values are:
    Tip
    The subject line cannot contain HTML or newline characters.
    • Production: {{ActionName}}: <ESM App Name> #{{ID}} ({{Title}}) (e.g. {{ActionName}}: UAA IT Support Ticket #{{ID}} ({{Title}}))
    • Sandbox: [TEST] {{ActionName}}: <ESM App Name> #{{ID}} ({{Title}}) (e.g. [TEST]  {{ActionName}}: UAA IT Support Ticket #{{ID}} ({{Title}}))
  4. Click into the Body field.
  5. Edit the HTML as needed.
    Tip
    As mentioned in the Get Started with Notification Templates article several of the templates have two variants, one for customers, and the other Ticketing Users. It is generally recommended to have a common template for both, then simply customize each for the desired content.
  6. Click Save.
  7. Click Show Preview button.
  8. 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 department specific notification templates instead of the default system templates.

Example Templates

Ticket Comment Added (Requestor) Template

<p style="font-size: 1.25rem;">{{{UpdateText}}}</p>

{{#NotificationRecipients}}
<p><strong>Individuals included in this communication:</strong> {{NotificationRecipients}}</p>
{{/NotificationRecipients}}

<div style="width: 100%; border: 1px solid #00583d; font-family: 'Segoe UI', Helvetica, Verdana, Arial, sans-serif;">
  <div style="width: 100%; border: 0px; background-color: #4EA685; font-size: 1.5rem; font-weight: bold; color: #FFFFFF;">
    <div style="padding:5px">Ticket Details</div>
  </div>

  <div style="width: 95%; border: 0px; background-color: #ffffff;">
    <div style="padding: 5px 5px 5px 5px;">
      <p><strong>Ticket Number:</strong> {{ID}}<br />
      <strong>Title/For:</strong> {{Title}}<br />
      <strong>Requestor:</strong> {{RequestorFullName}}<br />
      <strong>Status:</strong> {{StatusName}}<br />
      <strong>Priority:</strong> {{PriorityName}}<br />
      <strong>Created On:</strong> {{CreatedDate}}<br />
      <strong>Created By:</strong> {{CreatedUserFullName}}</p>

<p><a href={{ClientUrl}} style="background-color: #4EA685; border: none; color: #ffffff; padding: 5px 10px; text-align: center; font-weight: bold; text-decoration: none; display: inline-block;" target="_blank">View Ticket In UAA Service Portal</a></p>
    </div>
  </div>
</div>


<div style="width: 100%; border: 1px solid #E77A1C; margin-top: 20px; margin-bottom: 15px;">
<div style="width: 100%; border: 0px; background-color: #E77A1C; color: #ffffff; padding: 5px 5px 5px 5px;"><strong>Important</strong></div>
<div style="width: 100%; border: 0px; background-color: #ffffff; padding: 5px 5px 5px 5px;">
<p>Do not reply to this email for anything that is not related to this ticket. If you have questions about another ticket or need to have a new ticket created please visit the <a href="https://service.alaska.edu/tdclient/36/Portal/Home/">UAA Service Portal</a>, or contact the <a href="https://service.alaska.edu/TDClient/36/Portal/Home/?ID=aedd81fd-49de-426f-b5fc-c6d66183f65b">UAA IT Technical Support Center</a>. If you need to communicate with an UAA IT Services employee about something unrelated to this ticket please create a new email.</p>
</div>
</div>

Ticket Comment Added (Ticketing User) Template

<p style="font-size: 1.25rem;">Ticket Updated by: {{UpdateCreatedUserFullName}}</p>

<p style="font-size: 1.25rem;">{{{UpdateText}}}</p>

<div style="width: 100%; border: 1px solid #00583d; font-family: 'Segoe UI', Helvetica, Verdana, Arial, sans-serif;">
  <div style="width: 100%; border: 0px; background-color: #4EA685; font-size: 1.5rem; font-weight: bold; color: #FFFFFF;">
    <div style="padding: 5px">Ticket Details</div>
  </div>

  <div style="width: 100%; border: 0px; background-color: #ffffff; padding: 5px 5px 5px 5px;">
    <p><strong>Ticket Number:</strong> {{ID}}<br />
      <strong>Title/For:</strong> {{Title}}<br />
      <strong>Requestor:</strong> {{RequestorFullName}}<br />
      <strong>Status:</strong> {{StatusName}}<br />
      <strong>Priority:</strong> {{PriorityName}}<br />
      {{#Attribute2461}}<!-- Date & Time Due/Effective --><strong>Due Date:</strong>  {{Value}}<br />{{/Attribute2461}}
      <strong>Created On:</strong> {{CreatedDate}}<br />
      <strong>Created By:</strong> {{CreatedUserFullName}}<br />
<a href={{NextTicketsUrl}}>View Ticket In TDNext</a><br />
<a href={{MobileUrl}}>View Ticket In TDMobile</a></p>
</div>
</div>

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.