You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Create an email template with HTML code, it should look something like this:
For the body, use this (this one was generated by react-email, but I also tried it with very simple hand-made table structures, result is the same):
<!DOCTYPE html>
<html dir="ltr" lang="en">
<head>
<meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
</head>
<body
style="
background-color: rgb(255, 255, 255);
margin-top: auto;
margin-bottom: auto;
margin-left: auto;
margin-right: auto;
font-family: ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont,
'Segoe UI', Roboto, 'Helvetica Neue', Arial, 'Noto Sans', sans-serif,
'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol',
'Noto Color Emoji';
padding-left: 0.5rem;
padding-right: 0.5rem;
"
>
<table
align="center"
width="100%"
border="0"
cellpadding="0"
cellspacing="0"
role="presentation"
style="
max-width: 465px;
border-width: 1px;
border-style: solid;
border-color: rgb(234, 234, 234);
border-radius: 0.25rem;
margin-top: 40px;
margin-bottom: 40px;
margin-left: auto;
margin-right: auto;
padding: 20px;
"
>
<tbody>
<tr style="width: 100%">
<td>
<p
style="
font-size: 14px;
line-height: 24px;
margin: 16px 0;
color: rgb(0, 0, 0);
"
>
Hello Harry Potter,
</p>
<p
style="
font-size: 14px;
line-height: 24px;
margin: 16px 0;
color: rgb(0, 0, 0);
"
>
<strong></strong> (<a
href="mailto:undefined"
style="
color: rgb(37, 99, 235);
text-decoration: none;
text-decoration-line: none;
"
target="_blank"
>Lord Voldemort</a
>) has invited you to the <strong></strong> team on
<strong>Vercel</strong>.
</p>
<table
align="center"
width="100%"
border="0"
cellpadding="0"
cellspacing="0"
role="presentation"
style="text-align: center; margin-top: 32px; margin-bottom: 32px"
>
<tbody>
<tr>
<td>
<a
style="
line-height: 100%;
text-decoration: none;
display: inline-block;
max-width: 100%;
background-color: rgb(0, 0, 0);
border-radius: 0.25rem;
color: rgb(255, 255, 255);
font-size: 12px;
font-weight: 600;
text-decoration-line: none;
text-align: center;
padding-left: 1.25rem;
padding-right: 1.25rem;
padding-top: 0.75rem;
padding-bottom: 0.75rem;
padding: 12px 20px 12px 20px;
"
target="_blank"
><span
><!--[if mso
]><i
style="
letter-spacing: 20px;
mso-font-width: -100%;
mso-text-raise: 18;
"
hidden
> </i
><!
[endif]--></span
><span
style="
max-width: 100%;
display: inline-block;
line-height: 120%;
mso-padding-alt: 0px;
mso-text-raise: 9px;
"
>Join the team</span
><span
><!--[if mso
]><i
style="letter-spacing: 20px; mso-font-width: -100%"
hidden
> </i
><!
[endif]--></span
></a
>
</td>
</tr>
</tbody>
</table>
<p
style="
font-size: 14px;
line-height: 24px;
margin: 16px 0;
color: rgb(0, 0, 0);
"
>
or copy and paste this URL into your browser:
<a
style="
color: rgb(37, 99, 235);
text-decoration: none;
text-decoration-line: none;
"
target="_blank"
></a>
</p>
<hr
style="
width: 100%;
border: none;
border-top: 1px solid #eaeaea;
border-width: 1px;
border-style: solid;
border-color: rgb(234, 234, 234);
margin-top: 26px;
margin-bottom: 26px;
margin-left: 0px;
margin-right: 0px;
"
/>
<p
style="
font-size: 12px;
line-height: 24px;
margin: 16px 0;
color: rgb(102, 102, 102);
"
>
This invitation was intended for
<span style="color: rgb(0, 0, 0)"></span>. This invite was sent
from <span style="color: rgb(0, 0, 0)"></span> located in
<span style="color: rgb(0, 0, 0)"></span>. If you were not
expecting this invitation, you can ignore this email. If you are
concerned about your account's safety, please reply to this
email to get in touch with us.
</p>
</td>
</tr>
</tbody>
</table>
</body>
</html>
Open to any specific (not the list) entity, for example Sales Order and click the Email from the context menu of a Sales Order (or use the Ctrl-E shortcut).
On the modal, choose the HTML email template added above and click the "Add Template" button. The template should be loaded into the Subject and Message fields:
Observed result
As you can see on the image, the email loaded into the Message field does not look like as the template at all.
When I send it, in Gmail/Outlook it's broken as well, just like in the WYSIWYG editor, rows somehow became columns and every other formattings is messed up as well.
Expected result
The template itself should look like this:
Stacktrace / full error message
No errors.
Additional information
OS: Ubuntu 22.04
The text was updated successfully, but these errors were encountered:
Description of the issue
When using email templates with HTML code, the WYSIWYG editor breaks all the formatting and the email won't even be similar to the original one.
Context information (for bug reports)
Output of
bench versionSteps to reproduce the issue
For the body, use this (this one was generated by react-email, but I also tried it with very simple hand-made table structures, result is the same):
Observed result
As you can see on the image, the email loaded into the Message field does not look like as the template at all.
When I send it, in Gmail/Outlook it's broken as well, just like in the WYSIWYG editor, rows somehow became columns and every other formattings is messed up as well.
Expected result
The template itself should look like this:
Stacktrace / full error message
No errors.
Additional information
OS: Ubuntu 22.04
The text was updated successfully, but these errors were encountered: