New confirmation email template has been implemented and are using simplified datasets (technical term for those datasets is handlebars), below is a list of pre-defined placeholders for data related to purchases such as purchaser details, package details, booking rate details, QR Codes etc.
Implemented change is related to ASD-51350 (Sprint 5-FX).
Datasets to insert into package confirmation email
Dataset Description
Dataset/Placeholder Code
Attendee email
{{Email}}
Attendee name
{{Name}}
Attendee phone
{{Phone}}
Full name (purchaser)
{{PayerFullName}}
Booking date ^
{{ItemDate}}
Booking rate selected (if applicable)
{{ItemBookingRate}}
Event date
{{PackageDate}}
Event location
{{PackageLocation}}
Invoice ID
{{InvoiceId}}
Item price
{{ItemAppliedPrice}}
Item type (eg: add-on, package, session etc)
{{ItemType}}
Package title
{{PackageTitle}}
QR Code (URL/image)
{{QRCodeURL}}
QR Code title (display under QR Code)
{{QRCodeTitle}}
Quantity of tickets purchased for the package
{{TicketQty}}
Total paid (invoice level)
{{InvoiceAmount}}
Total paid (package level)
{{PackageTotal}}
^ Booking date{{ItemDate}} value would be blank for packages that are Single date and Open date. This appears to be the case for the old confirmation emails as well (confirmation emails on production environment and original confirmation emails sent in UAT environments).
Example - Confirmation email template HTML code section
Important
When creating a new confirmation email template, please ensure the dataset are placed in the correct HTML loop. Refer to below HTML sample.
All item details (session, addon, booking rate) inside a {{#each Items}} .... {{/each}} loop.
Attendees: {{#each Attendees}} ... {{/each}} loop should be placed inside the {{#each Items}} {{/each}} loop, as Attendees object is a child object of Items. Misplacing their place will result in unresolved items.
QR Code URL: Always add the {{QRCodeURL}} placeholder inside an image tag as its source: <img src="{{QRCodeURL}}" />
QR Code: Dataset must be placed inside the {{#each Attendees}} loop as it is a property of the Attendee object
<div id="welcome-message">
<link href="http://fonts.googleapis.com/css?family=Roboto" rel="stylesheet" type="text/css" />
<table role="presentation" border="0" cellpadding="0" cellspacing="0" class="body k-table" style="width:1317px;min-width:100%;background-color:#eaebed;max-width:700px;font-size:14px;">
<tbody>
<tr>
<td style="font-family:Roboto, Arial, sans-serif;vertical-align:top;"> </td>
<td class="container" style="font-family:Roboto, Arial, sans-serif;vertical-align:top;display:block;max-width:700px;width:580px;margin:0px auto !important;">
<div class="header" style="padding:0px 0px;">
<table border="0" style="width:585px;min-width:100%;">
<tbody>
<tr>
<td>
<table role="presentation" border="0" bgcolor="#fff" cellpadding="0" cellspacing="0" width="580" style="width:580px;border-width:0px;min-width:100%;background-color:#ffffff;">
<tbody>
<tr>
<td class="align-center" border="0" height="60" style="border-width:0px;vertical-align:top;text-align:center;">
<img src="https://www.uplay.com.sg/images/default-source/uplay/uplay_banner.png" alt="UPlay" style="border:none;max-width:100%;" width="580" />
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
<div class="content" style="box-sizing:border-box;margin:0px auto;max-width:580px;padding:0px;">
<table role="presentation" class="main k-table" style="width:580px;min-width:100%;background:rgb(255, 255, 255);">
<tbody>
<tr>
<td class="wrapper" style="vertical-align:top;box-sizing:border-box;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="width:567px;min-width:100%;">
<tbody>
<tr>
<td style="vertical-align:top;padding:10px;">
<p>Hi <strong>{{PayerFullName}}</strong>, </p>
<p>Thank you for your registration!</p>
<p>We are pleased to inform you that we have received your payment of <strong style="font-family:Roboto, Arial, sans-serif;font-size:14px;background-color:#ffffff;">${{InvoiceAmount}}</strong>. </p>
<p>Please see below for your confirmation details for <strong>{{PackageTitle}}</strong>. </p>
<div align="center" style="margin-bottom:12px;">
<table border="0" cellspacing="0" cellpadding="0" style="width:555.25px;min-width:100%;">
<tbody>
<tr>
<td width="434" valign="top" style="padding:20px 20px 0px;border-style:solid;border: 2px solid;vertical-align:top;">
<p><strong><span style="text-decoration-line:underline;">PURCHASE DETAILS</span></p>
<p><strong>Title: </strong>{{PackageTitle}}<br />
<strong>Date:</strong> {{PackageDate}}<br />
<strong>Location:</strong> {{PackageLocation}}<br />
<strong>Order and Invoice ID:</strong> {{InvoiceId}}<br />
<strong>Number of tickets:</strong> {{TicketQty}}<br /></p>
<p><strong><span style="text-decoration-line:underline;">PAYER DETAILS</span></strong></p>
<p><strong>Full Name: </strong>{{PayerFullName}}<br />
<strong>Email: </strong>{{PayerEmail}}<br />
<strong>Phone: </strong>{{PayerPhone}}</p>
<p><strong><span style="text-decoration-line:underline;">ITEMS DETAILS</span></strong></p>
<div>
{{#each Items}}
<p><strong>Booking Type: </strong>{{ItemType}} <br />
<strong>Booking rate (if applicable): </strong>{{ItemBookingRate}} <br />
<strong>Booking date: </strong>{{ItemDate}}<br />
<strong>Item Price: </strong>${{ItemAppliedPrice}}<br />
{{#each Attendees}}
<strong>Attendee Name: </strong>{{Name}}<br />
<strong>Attendee Email: </strong>{{Email}}<br />
<strong>Attendee Phone: </strong>{{Phone}}<br />
<strong> Redeem using your QR Code(s) below: </strong>
<div class="row" style="clear:both;">
<img src="{{QRCodeURL}}" style="width:75px;height:75px;"></div>
<span><small style="font-weight:600;">{{QRCodeTitle}}</small></span>
{{/each}}
</p>
{{/each}}
</div>
</td>
</tr>
</tbody>
</table>
</div>
<p><strong>Please present this confirmation email on your mobile or printed to the staff before commencing the activity if required.</strong></p>
<p>In the meantime, here are a few upcoming <a href="https://www.uplay.com.sg/allexperiences" style="color:#e81515;">events</a> that we thought might be of interest to you and would be delighted if you could join us for our upcoming events too. </p>
<p>If you have any further questions or need to update your registration, please contact us at <a href="mailto:cs@uplay.com.sg" style="color:#e81515;">cs@uplay.com.sg</a></p>
<p>Thank you and we look forward to seeing you soon!</p>
<p>Best regards, <br /> Team UPlay </p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<div class="footer" style="clear:both;margin-top:10px;text-align:center;width:580px;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="width:580px;min-width:100%;">
<tbody>
<tr>
<td class="content-block" style="font-size:12px;vertical-align:top;color:#9a9ea6;"> </td>
</tr>
<tr>
<td class="content-block powered-by" style="font-size:12px;vertical-align:top;color:#9a9ea6;">Powered by <a href="https://www.avionsoftware.com/" style="color:#9a9ea6;text-decoration-line:none;">Avalon</a>. [AVTEST] </td>
</tr>
</tbody>
</table>
</div>
</div>
</td>
<td style="font-family:Roboto, Arial, sans-serif;vertical-align:top;"> </td>
</tr>
</tbody>
</table>
</div>
