Не появляеться картинка в емейле
В темплейте ejs для емейла картинка не появляется
В урле в inspect есть null
Помогите пофиксить
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html
style="width:100%;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;padding:0;Margin:0;">
<head>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1" name="viewport">
<meta name="x-apple-disable-message-reformatting">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta content="telephone=no" name="format-detection">
<title></title>
<!--[if (mso 16)]>
<style type="text/css">
a {text-decoration: none;}
</style>
<![endif]-->
<style>
@media only screen and (max-width: 600px) {
p,
ul li,
ol li,
a {
font-size: 16px !important
}
h1 {
font-size: 30px !important;
text-align: center
}
h2 {
font-size: 26px !important;
text-align: center
}
h3 {
font-size: 20px !important;
text-align: center
}
h1 a {
font-size: 30px !important
}
h2 a {
font-size: 26px !important
}
h3 a {
font-size: 20px !important
}
.es-header-body p,
.es-header-body ul li,
.es-header-body ol li,
.es-header-body a {
font-size: 16px
}
.es-footer-body p,
.es-footer-body ul li,
.es-footer-body ol li,
.es-footer-body a {
font-size: 16 px
}
.es-infoblock p,
.es-infoblock ul li,
.es-infoblock ol li,
.es-infoblock a {
font-size: 12px
}
*[class="gmail-fix"] {
display: none !important
}
.es-m-txt-c,
.es-m-txt-c h1,
.es-m-txt-c h2,
.es-m-txt-c h3 {
text-align: center !important
}
.es-m-txt-r,
.es-m-txt-r h1,
.es-m-txt-r h2,
.es-m-txt-r h3 {
text-align: right !important
}
.es-m-txt-l,
.es-m-txt-l h1,
.es-m-txt-l h2,
.es-m-txt-l h3 {
text-align: left !important
}
.es-m-txt-r a img,
.es-m-txt-c a img,
.es-m-txt-l a img {
display: inline !important
}
.es-button-border {
width: 100% !important
}
.es-button {
font-size: 20px !important;
width: 100% !important;
border-width: 10px 0px 10px 0px !important
}
.es-btn-fw {
border-width: 10px 0px !important;
text-align: center !important
}
.es-adaptive table,
.es-btn-fw,
.es-btn-fw-brdr,
.es-left,
.es-right {
width: 100% !important
}
.es-content table,
.es-header table,
.es-footer table,
.es-content,
.es-footer,
.es-header {
width: 100% !important;
max-width: 600px !important
}
.es-adapt-td {
display: block !important;
width: 100% !important
}
.adapt-img {
width: 100% !important;
height: auto !important
}
.es-m-p0 {
padding: 0px !important
}
.es-m-p0r {
padding-right: 0px !important
}
.es-m-p0l {
padding-left: 0px !important
}
.es-m-p0t {}
.es-m-p0b {
padding-bottom: 0 !important
}
.es-m-p20b {
padding-bottom: 20px !important
}
.es-hidden {
display: none !important
}
table.es-table-not-adapt,
.esd-block-html table {
width: auto !important
}
table.es-social {
display: inline-block !important
}
table.es-social td {
display: inline-block !important
}
.es-menu td a {
font-size: 16px !important
}
}
</style>
<style>
#outlook a {
padding: 0;
}
.ExternalClass {
width: 100%;
}
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
.es-button {
mso-style-priority: 100 !important;
text-decoration: none !important;
}
a[x-apple-data-detectors] {
color: inherit !important;
text-decoration: none !important;
font-size: inherit !important;
font-family: inherit !important;
font-weight: inherit !important;
line-height: inherit !important;
}
@-ms-viewport {
width: device-width;
}
</style>
</head>
<body
style="width:100%;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;padding:0;Margin:0;">
<div class="es-wrapper-color" style="background-color:rgb(246, 246, 246);">
<!--[if gte mso 9]>
<v:background xmlns:v="urn:schemas-microsoft-com:vml" fill="t">
<v:fill type="tile"
color="#f6f6f6"
src="">
</v:fill>
</v:background>
<![endif]-->
<table class="es-wrapper" cellspacing="0" cellpadding="0" width="100%"
style="box-sizing: border-box;mso-table-lspace:0pt;mso-table-rspace:0pt;border: 1px solid #e9e9e9; border-radius: 3px;border-collapse: separate;border-spacing:0px;padding:0;Margin:0;width:100%;height:100%;background-repeat:repeat;background-position:center top;">
<tbody>
<tr style="border-collapse:collapse;">
<td valign="top" style="padding:20px;Margin:0;">
<table class="es-content" cellspacing="0" cellpadding="0" align="center"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;">
<tbody>
<tr style="border-collapse:collapse;">
<td align="center" style="padding:0;Margin:0;">
<table class="es-content-body"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:rgb(255, 255, 255);"
cellspacing="0" cellpadding="0" bgcolor="#ffffff" width="570"
align="center">
<tbody>
<tr style="border-collapse:collapse;">
<td class="es-p20t es-p5b es-p15r es-p15l"
style="padding:0;Margin:0;padding-bottom:5px;padding-left:15px;padding-right:15px;padding-top:20px;background-color:rgb(255, 255, 255);"
bgcolor="#ffffff" align="left">
<table cellspacing="0" cellpadding="0" width="100%"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
<tbody>
<tr style="border-collapse:collapse;">
<td class="es-m-p0r" width="540" valign="top"
align="center" style="padding:0;Margin:0;">
<table cellspacing="0" cellpadding="0"
width="100%"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
<tbody style="border-collapse:collapse;">
<td align="center"
style="padding:0;Margin:0;">
<img class="adapt-img" src="/public/logo.svg" alt="ggg">
<td>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<table class="es-content" cellspacing="0" cellpadding="0" align="center"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;">
<tbody>
<tr style="border-collapse:collapse;">
<td align="center" style="padding:0;Margin:0;">
<table class="es-content-body" cellspacing="0" cellpadding="0" bgcolor="#ffffff" width="570"
align="center"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:rgb(255, 255, 255);">
<tbody>
<tr style="border-collapse:collapse;">
<td class="es-p10t es-p10b es-p20r es-p20l" align="left"
style="padding:0;Margin:0;padding-top:10px;padding-bottom:10px;padding-left:20px;padding-right:20px;">
<table cellspacing="0" cellpadding="0" width="100%"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
<tbody>
<tr style="border-collapse:collapse;">
<td width="530" valign="top" align="center"
style="padding:0;Margin:0;">
<table
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:separate;border-spacing:0px;border-radius:0px;"
cellspacing="0" cellpadding="0" width="100%">
<tbody>
<tr style="border-collapse:collapse;">
<td class="es-p5t es-p10b es-p15r es-p15l"
align="center"
style="padding:0;Margin:0;padding-top:5px;padding-bottom:10px;padding-left:15px;padding-right:15px;">
<p
style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-size:20px;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:150%;color:rgb(0, 0, 0);text-align:left;">
<%- data.emailText.replace(/\n/g, '<br/>' )
%>
</p>
</td>
</tr>
<tr style="border-collapse:collapse;">
<td class="es-m-txt-c es-p20t es-p10b"
align="center"
style="padding:0;Margin:0;padding-bottom:10px;padding-top:20px;">
<span class="es-button-border"
style="border-style:solid;border-color:rgb(44, 181, 67);background:rgb(0, 0, 145) none repeat scroll 0% 0%;border-width:0px;display:inline-block;border-radius:5px; width: 300px;height: 40px">
<a href="<%= data.link %>" class="es-button"
target="_blank"
style="mso-style-priority:100 !important;text-decoration:none;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-family:arial, 'helvetica neue', helvetica, sans-serif;font-size:16px;color:rgb(255, 255, 255);border-style:solid;border-color:rgb(0, 0, 145);border-width:10px 80px;display:inline-block;background:rgb(0, 0, 145) none repeat scroll 0% 0%;border-radius:5px;font-weight:bold;font-style:normal;line-height:120%;width:auto;text-align:center;">
<%= data.buttonTitle || 'Click here!' %>
</a> </span>
</td>
</tr>
<tr style="border-collapse:collapse;">
<td class="es-p5t es-p10b es-p15r es-p15l"
style="color:#717171;padding:0;Margin:0;padding-top:5px;padding-bottom:10px;padding-left:15px;padding-right:15px;">
<p
style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-size:20px;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:150%;color:rgb(0, 0, 0);text-align:left;">
<p>
If a browser page does not
open after clicking the
button above, please copy
and paste the following link
into a new browser tab:
</p>
<p>
<%= data.link %>
</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<table class="es-footer" cellspacing="0" cellpadding="0" align="center"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;table-layout:fixed !important;width:100%;background-color:transparent;background-repeat:repeat;background-position:center top;">
<tbody>
<tr style="border-collapse:collapse;">
<td align="center" style="padding:0;Margin:0;">
<table class="es-footer-body"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;background-color:rgb(255, 255, 255);"
cellspacing="0" cellpadding="0" bgcolor="#ffffff" width="570" align="center">
<tbody>
<tr style="border-collapse:collapse;">
<td class="es-p15t es-p5b es-p20r es-p20l" align="left"
style="padding:0;Margin:0;padding-bottom:5px;padding-top:15px;padding-left:20px;padding-right:20px;">
<table cellspacing="0" cellpadding="0" width="100%"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
<tbody>
<tr style="border-collapse:collapse;">
<td width="530" align="left" style="padding:0;Margin:0;">
<table cellspacing="0" cellpadding="0" width="100%"
style="mso-table-lspace:0pt;mso-table-rspace:0pt;border-collapse:collapse;border-spacing:0px;">
<tbody>
<tr style="border-collapse:collapse;">
<td class="es-m-txt-c es-p10t es-p10b es-p5r es-p5l"
align="center"
style="padding:0;Margin:0;padding-left:5px;padding-right:5px;padding-top:10px;padding-bottom:10px;">
<p
style="Margin:0;-webkit-text-size-adjust:none;-ms-text-size-adjust:none;mso-line-height-rule:exactly;font-size:14px;font-family:helvetica, 'helvetica neue', arial, verdana, sans-serif;line-height:150%;color:rgb(128, 128, 128);">
<a style="color: gray; text-decoration: none;"
href="<%= data.terms_of_service_link %>">Terms
of Service</a>
<span style="margin: 5px;">|</span>
<a style="color: gray; text-decoration: none;"
href="<%= data.privacy_policy_link %>">Privacy
Policy</a>
</p>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
</div>
</body>
</html>
Источник: Stack Overflow на русском