Action success email
Example use cases
- Activation successful
- Reset password successful
Code output
Open email template in new windowHTML markup
The body of the email has been divided into sections of code that can be altered or replicated according to the requirements.
Copy<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional //EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="viewport" content="width=device-width">
<style type="text/css">
html,body {
margin:0;
padding:0;
background:#f1f3f6;
font-family: 'Open Sans', Arial, sans-serif;
font-size:15px;
-webkit-text-size-adjust:100%;
}
@media (max-width:767px) {
.mail-wrapper {
width:480px !important;
}
.mail-header tbody,
.mail-header tr,
.mail-header td,
.mail-footer tbody,
.mail-footer tr,
.mail-footer td {
display:block;
}
.mail-header td.header-first {
text-align:center;
}
.mail-header td.header-second {
padding-top:0 !important;
text-align:center;
}
.mail-main-body {
padding: 0 20px 15px 20px !important;
font-size:14px;
}
.mail-button {
margin:0 auto;
}
.mail-alt-pad {
padding:0 15px !important;
}
.mail-footer td.footer-first {
padding:15px 0 0 !important;
width:100%;
}
.mail-footer td.footer-second {
padding:0 !important;
width:100%;
}
}
@media (max-width:544px) {
.mail-wrapper {
width:100% !important;
}
}
</style>
<!--[if !mso]><!-- -->
<link href="https://skyframework.pccwglobal.com/css/fonts.css" rel="stylesheet">
<!--<![endif]-->
</head>
<body style="padding:0;background:#f1f3f6;">
<table align="center" border="0" cellspacing="0" cellpadding="0" width="100%" height="100%">
<tr>
<td align="center" valign="top">
<table class="mail-wrapper" align="center" border="0" cellspacing="0" cellpadding="0" style="width:630px;padding:15px;">
<tr>
<td>
<!--header-->
<table class="mail-header table-block" align="center" border="0" cellspacing="0" cellpadding="0" width="100%" style="background:#ffffff;border-top:1px solid $border-color;border-left:1px solid $border-color;border-right:1px solid $border-color;">
<tr>
<td align="left" class="header-first" style="padding:20px 30px 20px 20px">
<img src="https://skyframework.pccwglobal.com/img/pccwglobal_dark_r.png" width="234" height="40" style="width:234px;height:40px;">
</td>
<td class="header-second" align="right" style="padding:20px 30px">
<h2 style="color:#29548c;margin:0;padding:0;font-weight:300;font-size:24px;line-height:24px;">Service Portal<br><small style="font-size:14px;font-weight:700;">PASSWORD RESET</small></h2>
</td>
</tr>
</table>
<!--body-->
<table class="mail-body table-block" align="center" border="0" cellspacing="0" cellpadding="0" width="100%" style="background:#ffffff;border-left:1px solid $border-color;border-right:1px solid $border-color;">
<!--top spacer-->
<tr>
<td style="padding:0 30px;">
<table align="left" border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td style="height:40px;border-top:1px solid $border-color;">
</td>
</tr>
</table>
</td>
</tr>
<!--image-block-->
<tr>
<td align="center">
<img src="https://skyframework.pccwglobal.com/img/email-success.png" width="75" height-"75" style="width:75px;height:75px;">
</td>
</tr>
<!--spacer-->
<tr>
<td style="height:40px">
</td>
</tr>
<!--text-block-->
<tr>
<td class="mail-main-body" style="color:#212121;padding:0 30px;">
<p style="padding:0;margin:0;text-align:center;"><strong>Username</strong>, your account password has changed.</p>
</td>
</tr>
<!--spacer sm-->
<tr>
<td style="height:20px">
</td>
</tr>
<!--text-block-->
<tr>
<td class="mail-main-body" style="color:#212121;padding:0 30px;">
<p style="padding:0;margin:0;text-align:center;"><small>If you didn't request a password reset, please contact us at <a href="mailto:helpdesk@pccwglobal.com?subject=Password%20reset%20issue&body=I%20did%20not%20request%20a%20password%20reset." target="_blank" style="color:#2d74d0;text-decoration:none;">helpdesk@pccwglobal.com</a>.</small></p>
</td>
</tr>
<!--spacer-->
<tr>
<td style="height:40px">
</td>
</tr>
</table>
<!--footer-->
<table class="mail-alt table-block" align="center" border="0" cellspacing="0" cellpadding="0" width="100%" style="background:#ffffff;border-left:1px solid $border-color;border-right:1px solid $border-color;">
<tr>
<td style="padding: 0 30px;">
<table align="center" border="0" cellspacing="0" cellpadding="0" width="100%">
<tr>
<td class="mail-alt-main" align="center" valign="middle" style="border-top:1px solid $border-color;border-bottom:1px solid $border-color;padding:15px 0">
<span style="font-size:13px;">© 2017 <b>PCCW Global</b>. <span style="display:inline-block;">All rights reserved.</span></span>
</td>
</tr>
</table>
</td>
</tr>
</table>
<table class="mail-footer table-block" align="center" border="0" cellspacing="0" cellpadding="0" width="100%" style="background:#ffffff;border-bottom:1px solid $border-color;border-left:1px solid $border-color;border-right:1px solid $border-color;">
<tr>
<td align="center" width="50%" class="footer-first" style="padding:10px 20px">
<img src="https://skyframework.pccwglobal.com/img/hkt.png" width="170" height="50" style="width:170px;height:50px;">
</td>
<td class="footer-second" width="50%" align="center" style="padding:10px 20px">
<img src="https://skyframework.pccwglobal.com/img/pccw-member.png" width="200" height="50" style="width:200px;height:50px;">
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</body>
</html>