O objetivo deste artigo é apoiar o parceiro a personalizar os emails que são enviados aos seus clientes.
Modelos de templates disponíveis
- Template 1: Email recebido pelo cliente quando a conta é criada
- Template 2: Email de validação do token do email
- Template 3: Email utilizado quando uma conta é reprovada
- Template 4: Email utilizado quando a senha é reiniciada pelo cliente
Template 1: Email recebido pelo cliente quando a conta é criada
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html data-editor-version="2" class="sg-campaigns" 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, initial-scale=1, minimum-scale=1, maximum-scale=1">
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<!--<![endif]-->
<!--[if (gte mso 9)|(IE)]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
<!--[if (gte mso 9)|(IE)]>
<style type="text/css">
body {width: 600px;margin: 0 auto;}
table {border-collapse: collapse;}
table, td {mso-table-lspace: 0pt;mso-table-rspace: 0pt;}
img {-ms-interpolation-mode: bicubic;}
</style>
<![endif]-->
<style type="text/css">
body, p, div {
font-family: arial,helvetica,sans-serif;
font-size: 14px;
}
body {
color: #000000;
}
body a {
color: #1188E6;
text-decoration: none;
}
p { margin: 0; padding: 0; }
table.wrapper {
width:100% !important;
table-layout: fixed;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
img.max-width {
max-width: 100% !important;
}
.column.of-2 {
width: 50%;
}
.column.of-3 {
width: 33.333%;
}
.column.of-4 {
width: 25%;
}
ul ul ul ul {
list-style-type: disc !important;
}
ol ol {
list-style-type: lower-roman !important;
}
ol ol ol {
list-style-type: lower-latin !important;
}
ol ol ol ol {
list-style-type: decimal !important;
}
@media screen and (max-width:480px) {
.preheader .rightColumnContent,
.footer .rightColumnContent {
text-align: left !important;
}
.preheader .rightColumnContent div,
.preheader .rightColumnContent span,
.footer .rightColumnContent div,
.footer .rightColumnContent span {
text-align: left !important;
}
.preheader .rightColumnContent,
.preheader .leftColumnContent {
font-size: 80% !important;
padding: 5px 0;
}
table.wrapper-mobile {
width: 100% !important;
table-layout: fixed;
}
img.max-width {
height: auto !important;
max-width: 100% !important;
}
a.bulletproof-button {
display: block !important;
width: auto !important;
font-size: 80%;
padding-left: 0 !important;
padding-right: 0 !important;
}
.columns {
width: 100% !important;
}
.column {
display: block !important;
width: 100% !important;
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.social-icon-column {
display: inline-block !important;
}
}
</style>
<!--user entered Head Start--><!--End Head user entered-->
</head>
<body>
<center class="wrapper" data-link-color="#1188E6" data-body-style="font-size:14px; font-family:arial,helvetica,sans-serif; color:#000000; background-color:#F7F8FC;">
<div class="webkit">
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="wrapper" bgcolor="#F7F8FC">
<tr>
<td valign="top" bgcolor="#F7F8FC" width="100%">
<table width="100%" role="content-container" class="outer" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="100%">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<!--[if mso]>
<center>
<table><tr><td width="600">
<![endif]-->
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%; max-width:600px;" align="center">
<tr>
<td role="modules-container" style="padding:0px 0px 0px 0px; color:#000000; text-align:left;" bgcolor="#F7F8FC" width="100%" align="left"><table class="module preheader preheader-hide" role="module" data-type="preheader" border="0" cellpadding="0" cellspacing="0" width="100%" style="display: none !important; mso-hide: all; visibility: hidden; opacity: 0; color: transparent; height: 0; width: 0;">
<tr>
<td role="module-content">
<p></p>
</td>
</tr>
</table><table class="module" role="module" data-type="code" border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;" data-muid="db860def-48a9-48b6-b362-a48e20ba7fd1">
<tbody>
<tr>
<td height="100%" valign="top" role="module-content"><!doctype html>
<html style="font-family: 'Lato', 'Roboto', sans-serif;">
<head>
<meta name="viewport" content="width=device-width">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<style>
@media only screen and (max-width: 620px) {
table[class=body] h1 {
font-size: 28px !important;
margin-bottom: 10px !important;
}
table[class=body] p,
table[class=body] ul,
table[class=body] ol,
table[class=body] td,
table[class=body] span,
table[class=body] a {
font-size: 16px !important;
}
table[class=body] .wrapper,
table[class=body] .article {
padding: 10px !important;
}
table[class=body] .content {
padding: 0 !important;
}
table[class=body] .container {
padding: 0 !important;
width: 100% !important;
}
table[class=body] .main {
border-left-width: 0 !important;
border-radius: 0 !important;
border-right-width: 0 !important;
}
table[class=body] .btn table {
width: 100% !important;
}
table[class=body] .btn a {
width: 100% !important;
}
table[class=body] .img-responsive {
height: auto !important;
max-width: 100% !important;
width: auto !important;
}
}
@media all {
.ExternalClass {
width: 100%;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
.apple-link a {
color: inherit !important;
font-family: inherit !important;
font-size: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
text-decoration: none !important;
}
.btn-primary table td:hover {
background-color: #252C35 !important;
}
.btn-primary a:hover {
background-color: #252C35 !important;
border-color: #252C35 !important;
}
}
</style></head>
<body class="" style="background-color: #414155; -webkit-font-smoothing: antialiased; font-size: 14px; line-height: 1.4; margin: 0; padding: 0; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lato', 'Roboto', sans-serif;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" class="body" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif; background-color: #414155;" width="100%" bgcolor="#414155">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top"> </td>
<td class="container" style="font-size: 14px; vertical-align: top; display: block; max-width: 580px; padding: 10px; width: 580px; font-family: 'Lato', 'Roboto', sans-serif; Margin: 0 auto;" width="580" valign="top">
<div class="header" style="padding: 20px 0; background-color: #414155; font-family: 'Lato', 'Roboto', sans-serif;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td class="align-center" width="100%" style="font-size: 14px; vertical-align: top; text-align: center; font-family: 'Lato', 'Roboto', sans-serif;" valign="top" align="center">
<a href="www.NOME_DA_INSTITUICAO.ai" style="color: #ec0867; text-decoration: underline; font-family: 'Lato', 'Roboto', sans-serif;"><img src="https://ib.NOME_DA_INSTITUICAO.ai/static/media/logo-login.7eda7f2a.png" height="200" alt="" style="border: none; -ms-interpolation-mode: bicubic; max-width: 100%; font-family: 'Lato', 'Roboto', sans-serif;"></a>
</td>
</tr>
</table>
</div>
<div class="header-content-separator" style="border: 2px solid #414155; font-family: 'Lato', 'Roboto', sans-serif;"></div>
<div class="content" style="box-sizing: border-box; display: block; Margin: 0 auto; max-width: 580px; font-family: 'Lato', 'Roboto', sans-serif;">
<!-- START CENTERED WHITE CONTAINER -->
<table role="presentation" class="main" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; background: #ffffff; border-radius: 3px; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;" width="100%">
<!-- START MAIN CONTENT AREA -->
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td class="wrapper" style="font-size: 14px; vertical-align: top; box-sizing: border-box; padding: 20px; font-family: 'Lato', 'Roboto', sans-serif;" valign="top">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;" width="100%">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top">
<h1 style="line-height: 1.4; margin: 0; margin-bottom: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: center; color: #02203C;">NOME_DA_INSTITUICAO Conta digital</h1>
<h3 style="line-height: 1.4; margin: 0; margin-bottom: 30px; margin-top: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 16px; font-weight: 700; text-align: left; color: #363E4D;">Saudação!</h3>
<p style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">Concluímos o processo de abertura da sua conta digital com sucesso!</p>
<p style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">Para seu primeiro acesso geramos uma senha provisória, esta senha não permite executar nenhuma transação.</p>
<p style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">Em seu primeiro acesso você deverá criar uma nova senha, incluindo uma senha especial para transações com 4 dígitos.</p>
<p style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">Conta: {{account}}</p>
<p style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">Senha Provisória: {{password}}</p>
<h3 style="line-height: 1.4; margin: 0; margin-bottom: 30px; margin-top: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 16px; font-weight: 700; text-align: left; color: #363E4D;">Abraços da equipe!</h3>
<div class="separator" style="border: 1px solid #ffee00; font-family: 'Lato', 'Roboto', sans-serif;"></div>
<h2 style="line-height: 1.4; margin: 0; margin-bottom: 30px; margin-top: 32px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: left; color: #02203C;"><a style="font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: left; color: #02203C; text-decoration: none;">www.NOME_DA_INSTITUICAO.ai</a></h2>
<p class="footer" style="font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-size: 14px; font-family: 'Lato', 'Roboto', sans-serif;">contato@NOME_DA_INSTITUICAO.ai (Segunda à Sexta | 08:30hs às 17:30hs) <br style="font-family: 'Lato', 'Roboto', sans-serif;">
<br>
<br style="font-family: 'Lato', 'Roboto', sans-serif;">
NOME_DA_INSTITUICAO</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- END MAIN CONTENT AREA -->
</table>
<!-- END CENTERED WHITE CONTAINER -->
</div>
</td>
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top"> </td>
</tr>
</table>
</body>
</html></td>
</tr>
</tbody>
</table></td>
</tr>
</table>
<!--[if mso]>
</td>
</tr>
</table>
</center>
<![endif]-->
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</center>
</body>
</html>Template 2: Email de validação do token do email
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html data-editor-version="2" class="sg-campaigns" 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, initial-scale=1, minimum-scale=1, maximum-scale=1">
<!--[if !mso]><!-->
<meta http-equiv="X-UA-Compatible" content="IE=Edge">
<!--<![endif]-->
<!--[if (gte mso 9)|(IE)]>
<xml>
<o:OfficeDocumentSettings>
<o:AllowPNG/>
<o:PixelsPerInch>96</o:PixelsPerInch>
</o:OfficeDocumentSettings>
</xml>
<![endif]-->
<!--[if (gte mso 9)|(IE)]>
<style type="text/css">
body {width: 600px;margin: 0 auto;}
table {border-collapse: collapse;}
table, td {mso-table-lspace: 0pt;mso-table-rspace: 0pt;}
img {-ms-interpolation-mode: bicubic;}
</style>
<![endif]-->
<style type="text/css">
body, p, div {
font-family: arial,helvetica,sans-serif;
font-size: 14px;
}
body {
color: #000000;
}
body a {
color: #1188E6;
text-decoration: none;
}
p { margin: 0; padding: 0; }
table.wrapper {
width:100% !important;
table-layout: fixed;
-webkit-font-smoothing: antialiased;
-webkit-text-size-adjust: 100%;
-moz-text-size-adjust: 100%;
-ms-text-size-adjust: 100%;
}
img.max-width {
max-width: 100% !important;
}
.column.of-2 {
width: 50%;
}
.column.of-3 {
width: 33.333%;
}
.column.of-4 {
width: 25%;
}
ul ul ul ul {
list-style-type: disc !important;
}
ol ol {
list-style-type: lower-roman !important;
}
ol ol ol {
list-style-type: lower-latin !important;
}
ol ol ol ol {
list-style-type: decimal !important;
}
@media screen and (max-width:480px) {
.preheader .rightColumnContent,
.footer .rightColumnContent {
text-align: left !important;
}
.preheader .rightColumnContent div,
.preheader .rightColumnContent span,
.footer .rightColumnContent div,
.footer .rightColumnContent span {
text-align: left !important;
}
.preheader .rightColumnContent,
.preheader .leftColumnContent {
font-size: 80% !important;
padding: 5px 0;
}
table.wrapper-mobile {
width: 100% !important;
table-layout: fixed;
}
img.max-width {
height: auto !important;
max-width: 100% !important;
}
a.bulletproof-button {
display: block !important;
width: auto !important;
font-size: 80%;
padding-left: 0 !important;
padding-right: 0 !important;
}
.columns {
width: 100% !important;
}
.column {
display: block !important;
width: 100% !important;
padding-left: 0 !important;
padding-right: 0 !important;
margin-left: 0 !important;
margin-right: 0 !important;
}
.social-icon-column {
display: inline-block !important;
}
}
</style>
<!--user entered Head Start--><!--End Head user entered-->
</head>
<body>
<center class="wrapper" data-link-color="#1188E6" data-body-style="font-size:14px; font-family:arial,helvetica,sans-serif; color:#000000; background-color:#F7F8FC;">
<div class="webkit">
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="wrapper" bgcolor="#F7F8FC">
<tr>
<td valign="top" bgcolor="#F7F8FC" width="100%">
<table width="100%" role="content-container" class="outer" align="center" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="100%">
<table width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td>
<!--[if mso]>
<center>
<table><tr><td width="600">
<![endif]-->
<table width="100%" cellpadding="0" cellspacing="0" border="0" style="width:100%; max-width:600px;" align="center">
<tr>
<td role="modules-container" style="padding:0px 0px 0px 0px; color:#000000; text-align:left;" bgcolor="#F7F8FC" width="100%" align="left"><table class="module preheader preheader-hide" role="module" data-type="preheader" border="0" cellpadding="0" cellspacing="0" width="100%" style="display: none !important; mso-hide: all; visibility: hidden; opacity: 0; color: transparent; height: 0; width: 0;">
<tr>
<td role="module-content">
<p></p>
</td>
</tr>
</table><table class="module" role="module" data-type="code" border="0" cellpadding="0" cellspacing="0" width="100%" style="table-layout: fixed;" data-muid="db860def-48a9-48b6-b362-a48e20ba7fd1">
<tbody>
<tr>
<td height="100%" valign="top" role="module-content"><!doctype html>
<html style="font-family: 'Lato', 'Roboto', sans-serif;">
<head>
<meta name="viewport" content="width=device-width">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title></title>
<style>
@media only screen and (max-width: 620px) {
table[class=body] h1 {
font-size: 28px !important;
margin-bottom: 10px !important;
}
table[class=body] p,
table[class=body] ul,
table[class=body] ol,
table[class=body] td,
table[class=body] span,
table[class=body] a {
font-size: 16px !important;
}
table[class=body] .wrapper,
table[class=body] .article {
padding: 10px !important;
}
table[class=body] .content {
padding: 0 !important;
}
table[class=body] .container {
padding: 0 !important;
width: 100% !important;
}
table[class=body] .main {
border-left-width: 0 !important;
border-radius: 0 !important;
border-right-width: 0 !important;
}
table[class=body] .btn table {
width: 100% !important;
}
table[class=body] .btn a {
width: 100% !important;
}
table[class=body] .img-responsive {
height: auto !important;
max-width: 100% !important;
width: auto !important;
}
}
@media all {
.ExternalClass {
width: 100%;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
.apple-link a {
color: inherit !important;
font-family: inherit !important;
font-size: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
text-decoration: none !important;
}
.btn-primary table td:hover {
background-color: #252C35 !important;
}
.btn-primary a:hover {
background-color: #252C35 !important;
border-color: #252C354 !important;
}
}
</style></head>
<body class="" style="background-color: #414155; -webkit-font-smoothing: antialiased; font-size: 14px; line-height: 1.4; margin: 0; padding: 0; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lato', 'Roboto', sans-serif;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" class="body" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif; background-color: #414155;" width="100%" bgcolor="#414155">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top"> </td>
<td class="container" style="font-size: 14px; vertical-align: top; display: block; max-width: 580px; padding: 10px; width: 580px; font-family: 'Lato', 'Roboto', sans-serif; Margin: 0 auto;" width="580" valign="top">
<div class="header" style="padding: 20px 0; background-color: #414155; font-family: 'Lato', 'Roboto', sans-serif;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td class="align-center" width="100%" style="font-size: 14px; vertical-align: top; text-align: center; font-family: 'Lato', 'Roboto', sans-serif;" valign="top" align="center">
<a href="www.NOME_DA_INSTITUICAO.ai" style="color: #ec0867; text-decoration: underline; font-family: 'Lato', 'Roboto', sans-serif;"><img src="https://ib.NOME_DA_INSTITUICAO.ai/static/media/logo-login.7eda7f2a.png" height="200" alt="" style="border: none; -ms-interpolation-mode: bicubic; max-width: 100%; font-family: 'Lato', 'Roboto', sans-serif;"></a>
</td>
</tr>
</table>
</div>
<div class="header-content-separator" style="border: 2px solid #414155; font-family: 'Lato', 'Roboto', sans-serif;"></div>
<div class="content" style="box-sizing: border-box; display: block; Margin: 0 auto; max-width: 580px; font-family: 'Lato', 'Roboto', sans-serif;">
<!-- START CENTERED WHITE CONTAINER -->
<table role="presentation" class="main" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; background: #ffffff; border-radius: 3px; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;" width="100%">
<!-- START MAIN CONTENT AREA -->
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td class="wrapper" style="font-size: 14px; vertical-align: top; box-sizing: border-box; padding: 20px; font-family: 'Lato', 'Roboto', sans-serif;" valign="top">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;" width="100%">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top">
<h1 style="line-height: 1.4; margin: 0; margin-bottom: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: center; color: #02203C;">NOME_DA_INSTITUICAO Conta digital</h1>
<h3 style="line-height: 1.4; margin: 0; margin-bottom: 30px; margin-top: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 16px; font-weight: 700; text-align: left; color: #363E4D;">Saudação!</h3>
<p style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">O código de verificação do seu e-mail é: </p><h1 style="line-height: 1.4; margin: 0; margin-bottom: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: center; color: #02203C;"> {{codigo}} </h1> <p></p>
<p style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">Este código tem 3 minutos de validade, retorne para o app e digite no campo solicitado.</p>
<p style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">Qualquer dúvida basta chamar pelo nosso site.</p>
<h3 style="line-height: 1.4; margin: 0; margin-bottom: 30px; margin-top: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 16px; font-weight: 700; text-align: left; color: #363E4D;">Abraços da equipe!</h3>
<div class="separator" style="border: 1px solid #ffee00; font-family: 'Lato', 'Roboto', sans-serif;"></div>
<h2 style="line-height: 1.4; margin: 0; margin-bottom: 30px; margin-top: 32px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: left; color: #02203C;"><a style="font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: left; color: #02203C; text-decoration: none;">www.NOME_DA_INSTITUICAO.ai</a></h2>
<p class="footer" style="font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-size: 14px; font-family: 'Lato', 'Roboto', sans-serif;">Central de atendimento: <br style="font-family: 'Lato', 'Roboto', sans-serif;">
</p>
<p class="footer" style="font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-size: 14px; font-family: 'Lato', 'Roboto', sans-serif;">contato@NOME_DA_INSTITUICAO.ai (Segunda à Sexta | 08:30hs às 17:30hs) <br style="font-family: 'Lato', 'Roboto', sans-serif;">
<br>
<br style="font-family: 'Lato', 'Roboto', sans-serif;">
NOME_DA_INSTITUICAO</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- END MAIN CONTENT AREA -->
</table>
<!-- END CENTERED WHITE CONTAINER -->
</div>
</td>
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top"> </td>
</tr>
</table>
</body>
</html></td>
</tr>
</tbody>
</table></td>
</tr>
</table>
<!--[if mso]>
</td>
</tr>
</table>
</center>
<![endif]-->
</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
</div>
</center>
</body>
</html>Template 3: Email utilizado quando uma conta é reprovada
<!doctype html>
<html style="font-family: 'Lato', 'Roboto', sans-serif;">
<head>
<meta name="viewport" content="width=device-width">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Cashway E-mail</title>
<style>
@media only screen and (max-width: 620px) {
table[class=body] h1 {
font-size: 28px !important;
margin-bottom: 10px !important;
}
table[class=body] p,
table[class=body] ul,
table[class=body] ol,
table[class=body] td,
table[class=body] span,
table[class=body] a {
font-size: 16px !important;
}
table[class=body] .wrapper,
table[class=body] .article {
padding: 10px !important;
}
table[class=body] .content {
padding: 0 !important;
}
table[class=body] .container {
padding: 0 !important;
width: 100% !important;
}
table[class=body] .main {
border-left-width: 0 !important;
border-radius: 0 !important;
border-right-width: 0 !important;
}
table[class=body] .btn table {
width: 100% !important;
}
table[class=body] .btn a {
width: 100% !important;
}
table[class=body] .img-responsive {
height: auto !important;
max-width: 100% !important;
width: auto !important;
}
}
@media all {
.ExternalClass {
width: 100%;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
.apple-link a {
color: inherit !important;
font-family: inherit !important;
font-size: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
text-decoration: none !important;
}
.btn-primary table td:hover {
background-color: #d5075d !important;
}
.btn-primary a:hover {
background-color: #d5075d !important;
border-color: #d5075d !important;
}
}
</style>
</head>
<body class
style="background-color: #F7F8FC; -webkit-font-smoothing: antialiased; font-size: 14px; font-style: normal !important; line-height: 1.4; margin: 0; padding: 0; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lato', 'Roboto', sans-serif;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" class="body"
style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif; background-color: #F7F8FC;"
width="100%" bgcolor="#F7F8FC">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top">
</td>
<td class="container"
style="font-size: 14px; vertical-align: top; display: block; max-width: 580px; padding: 10px; width: 580px; font-family: 'Lato', 'Roboto', sans-serif; Margin: 0 auto;"
width="580" valign="top">
<div class="header"
style="padding: 20px 0; background-color: #02203C; font-family: 'Lato', 'Roboto', sans-serif;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%"
style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td class="align-center" width="100%"
style="font-size: 14px; vertical-align: top; text-align: center; font-family: 'Lato', 'Roboto', sans-serif;"
valign="top" align="center">
<a href="https://cashway.io"
style="color: #ec0867; text-decoration: underline; font-family: 'Lato', 'Roboto', sans-serif;"><img
src="https://user-images.githubusercontent.com/29025963/145059785-064a9cda-155c-4648-877b-7253b58b77a4.png"
height="70" alt
style="border: none; -ms-interpolation-mode: bicubic; max-width: 100%; font-family: 'Lato', 'Roboto', sans-serif;"></a>
</td>
</tr>
</table>
</div>
<div class="header-content-separator"
style="border: 2px solid #00CBBB; font-family: 'Lato', 'Roboto', sans-serif;"></div>
<div class="content"
style="box-sizing: border-box; display: block; Margin: 0 auto; max-width: 580px; font-family: 'Lato', 'Roboto', sans-serif;">
<!-- START CENTERED WHITE CONTAINER -->
<table role="presentation" class="main"
style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; background: #ffffff; border-radius: 3px; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;"
width="100%">
<!-- START MAIN CONTENT AREA -->
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td class="wrapper"
style="font-size: 14px; vertical-align: top; box-sizing: border-box; padding: 20px; font-family: 'Lato', 'Roboto', sans-serif;"
valign="top">
<table role="presentation" border="0" cellpadding="0" cellspacing="0"
style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;"
width="100%">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;"
valign="top">
<h1
style="line-height: 1.4; margin: 0; margin-bottom: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: center; color: #363E4D;">
Algo deu errado no seu cadastro :(</h1>
<p
style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">
Você pode tentar novamente ou entrar em contato em nossos canais de atendimento.</p>
<center>
<a
href="https://api.whatsapp.com/send?phone=5548999382559" style="text-decoration: none;">
<img src="https://user-images.githubusercontent.com/29025963/145087483-61998a5b-5775-444f-90a6-7187ab82525b.png"></img>
<br>
<span style='color:#00101F; font-size:20px'>Atendimento via WhatsApp</span>
</a>
<br><br>
<a
href="mailto:contato@cashway.io" style="text-decoration: none;">
<img src="https://user-images.githubusercontent.com/29025963/145087481-dcf20034-b8c3-45c3-997a-fa28fb2b3883.png"></img>
<br>
<span style='font-size:10.0pt;
line-height:107%;font-size:20px;color:#00101F'>Atendimento via
E-mail</span>
</a>
<br><br>
<a href="" style="text-decoration: none;">
<img src="https://user-images.githubusercontent.com/29025963/145087478-7bb220b8-4e82-4776-b3c9-3cd33d5e6a22.png"></img>
<br>
<span style='
line-height:107%;font-size:20px;color:#00101F'>(48) 3036-0390</span></span>
</a>
<p
style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">
dias úteis das 09:00h às 18:00h</p>
</center>
<br>
<div class="separator"
style="border: 1px solid #00CBBB; font-family: 'Lato', 'Roboto', sans-serif;"></div>
<h2
style="line-height: 1.4; margin: 0; margin-bottom: 30px; margin-top: 32px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: left; color: #02203C;">
<a
style="font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: left; color: #363E4D; text-decoration: none;">cashway.io</a>
</h2>
<p class="footer"
style="font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-size: 14px; font-family: 'Lato', 'Roboto', sans-serif;">
Central de atendimento: (48) 3036-0390 <br style="font-family: 'Lato', 'Roboto', sans-serif;">
Cashway, Square SC Square Corporate - Rod. José Carlos Daux, 5500, Salas 404 a 407,
Florianópolis - SC, 88032-005</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- END MAIN CONTENT AREA -->
</table>
<!-- END CENTERED WHITE CONTAINER -->
</div>
</td>
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top">
</td>
</tr>
</table>
</body>
</html>Template 4: Email utilizado quando a senha é reiniciada pelo cliente
<!doctype html>
<html style="font-family: 'Lato', 'Roboto', sans-serif;">
<head>
<meta name="viewport" content="width=device-width">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Cashway E-mail</title>
<style>
@media only screen and (max-width: 620px) {
table[class=body] h1 {
font-size: 28px !important;
margin-bottom: 10px !important;
}
table[class=body] p,
table[class=body] ul,
table[class=body] ol,
table[class=body] td,
table[class=body] span,
table[class=body] a {
font-size: 16px !important;
}
table[class=body] .wrapper,
table[class=body] .article {
padding: 10px !important;
}
table[class=body] .content {
padding: 0 !important;
}
table[class=body] .container {
padding: 0 !important;
width: 100% !important;
}
table[class=body] .main {
border-left-width: 0 !important;
border-radius: 0 !important;
border-right-width: 0 !important;
}
table[class=body] .btn table {
width: 100% !important;
}
table[class=body] .btn a {
width: 100% !important;
}
table[class=body] .img-responsive {
height: auto !important;
max-width: 100% !important;
width: auto !important;
}
}
@media all {
.ExternalClass {
width: 100%;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
.apple-link a {
color: inherit !important;
font-family: inherit !important;
font-size: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
text-decoration: none !important;
}
.btn-primary table td:hover {
background-color: #d5075d !important;
}
.btn-primary a:hover {
background-color: #d5075d !important;
border-color: #d5075d !important;
}
}
</style>
</head>
<body class
style="background-color: #F7F8FC; -webkit-font-smoothing: antialiased; font-size: 14px; font-style: normal !important; line-height: 1.4; margin: 0; padding: 0; -ms-text-size-adjust: 100%; -webkit-text-size-adjust: 100%; font-family: 'Lato', 'Roboto', sans-serif;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" class="body"
style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif; background-color: #F7F8FC;"
width="100%" bgcolor="#F7F8FC">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top">
</td>
<td class="container"
style="font-size: 14px; vertical-align: top; display: block; max-width: 580px; padding: 10px; width: 580px; font-family: 'Lato', 'Roboto', sans-serif; Margin: 0 auto;"
width="580" valign="top">
<div class="header"
style="padding: 20px 0; background-color: #02203C; font-family: 'Lato', 'Roboto', sans-serif;">
<table role="presentation" border="0" cellpadding="0" cellspacing="0" width="100%"
style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td class="align-center" width="100%"
style="font-size: 14px; vertical-align: top; text-align: center; font-family: 'Lato', 'Roboto', sans-serif;"
valign="top" align="center">
<a href="https://cashway.io"
style="color: #ec0867; text-decoration: underline; font-family: 'Lato', 'Roboto', sans-serif;"><img
src="https://user-images.githubusercontent.com/29025963/145059785-064a9cda-155c-4648-877b-7253b58b77a4.png"
height="70" alt
style="border: none; -ms-interpolation-mode: bicubic; max-width: 100%; font-family: 'Lato', 'Roboto', sans-serif;"></a>
</td>
</tr>
</table>
</div>
<div class="header-content-separator"
style="border: 2px solid #00CBBB; font-family: 'Lato', 'Roboto', sans-serif;"></div>
<div class="content"
style="box-sizing: border-box; display: block; Margin: 0 auto; max-width: 580px; font-family: 'Lato', 'Roboto', sans-serif;">
<!-- START CENTERED WHITE CONTAINER -->
<table role="presentation" class="main"
style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; background: #ffffff; border-radius: 3px; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;"
width="100%">
<!-- START MAIN CONTENT AREA -->
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td class="wrapper"
style="font-size: 14px; vertical-align: top; box-sizing: border-box; padding: 20px; font-family: 'Lato', 'Roboto', sans-serif;"
valign="top">
<table role="presentation" border="0" cellpadding="0" cellspacing="0"
style="border-collapse: separate; mso-table-lspace: 0pt; mso-table-rspace: 0pt; min-width: 100%; width: 100%; font-family: 'Lato', 'Roboto', sans-serif;"
width="100%">
<tr style="font-family: 'Lato', 'Roboto', sans-serif;">
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;"
valign="top">
<h1
style="line-height: 1.4; margin: 0; margin-bottom: 30px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: center; color: #363E4D;">
Sua senha foi alterada</h1>
<p
style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">
A senha da sua conta Cashway foi alterada.
</p>
<p
style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">
Caso não tenha solicitado essa alteração, entre em contato.
</p><br>
<center>
<a
href="https://api.whatsapp.com/send?phone=5548999382559" style="text-decoration: none;">
<img src="https://user-images.githubusercontent.com/29025963/145087483-61998a5b-5775-444f-90a6-7187ab82525b.png"></img>
<br>
<span style='color:#00101F; font-size:20px'>Atendimento via WhatsApp</span>
</a>
<br><br>
<a
href="mailto:contato@cashway.io" style="text-decoration: none;">
<img src="https://user-images.githubusercontent.com/29025963/145087481-dcf20034-b8c3-45c3-997a-fa28fb2b3883.png"></img>
<br>
<span style='font-size:10.0pt;
line-height:107%;font-size:20px;color:#00101F'>Atendimento via
E-mail</span>
</a>
<br><br>
<a href="" style="text-decoration: none;">
<img src="https://user-images.githubusercontent.com/29025963/145087478-7bb220b8-4e82-4776-b3c9-3cd33d5e6a22.png"></img>
<br>
<span style='
line-height:107%;font-size:20px;color:#00101F'>(48) 3036-0390</span></span>
</a>
<p
style="font-size: 16px; font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-family: 'Lato', 'Roboto', sans-serif;">
dias úteis das 09:00h às 18:00h</p>
</center>
<br>
<div class="separator"
style="border: 1px solid #00CBBB; font-family: 'Lato', 'Roboto', sans-serif;"></div>
<h2
style="line-height: 1.4; margin: 0; margin-bottom: 30px; margin-top: 32px; font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: left; color: #02203C;">
<a
style="font-family: 'Lato', 'Roboto', sans-serif; font-size: 24px; font-weight: 400; text-align: left; color: #363E4D; text-decoration: none;">cashway.io</a>
</h2>
<p class="footer"
style="font-weight: normal; color: #828A99; margin: 0; margin-bottom: 15px; font-size: 14px; font-family: 'Lato', 'Roboto', sans-serif;">
Central de atendimento: (48) 3036-0390 <br style="font-family: 'Lato', 'Roboto', sans-serif;">
Cashway, Square SC Square Corporate - Rod. José Carlos Daux, 5500, Salas 404 a 407,
Florianópolis - SC, 88032-005</p>
</td>
</tr>
</table>
</td>
</tr>
<!-- END MAIN CONTENT AREA -->
</table>
<!-- END CENTERED WHITE CONTAINER -->
</div>
</td>
<td style="font-size: 14px; vertical-align: top; font-family: 'Lato', 'Roboto', sans-serif;" valign="top">
</td>
</tr>
</table>
</body>
</html>Utilize boas práticas para evitar que seu email fique parado em caixas de spam, você pode utilizar gratuitamente o site https://www.mail-tester.com/
Após a conclusão dos templates, os mesmos devem ser encaminhados ao suporte através de um ticket para implantação no ambiente de produção.