Infos:
- Used Zammad version: 6.3.1-1718860451.0f341764.bullseye
- Used Zammad installation type: package
- Operating system: Debian 12
- Browser + version: Chrome, 126.0.6478.127
Expected behavior:
When sending emails, the styles defined in application_wrapper.html.erb are used.
Actual behavior:
We recently upgraded Version 5.3 to 6.3, respecting the upgrade path, so we did the step to 6.0 inbetween.
Recently, we noticed that our outgoing messages aren’t using the configured font/size settings anymore.
We’ve investigated and found that there might be a problem with the ###html# variable within applicaiton_wrapper.html.erb.
In short, we used a slightly modified .erb file, so we swapped for the original .erb file which we kept, just in case.
However, even with the original .erb file our configured font/size settings weren’t beieng used.
We tried both, setting font/size via the rails console Setting.set(‘html_email_css_font’,…) and, after that, writing our desired settings into the .erb file, removing the ###html_email_css_font### variable, neither worked.
We kept investigating, removing style-settings bracket by bracket, to find out where the file breaks.
However, it wasn’t until we removed ###html### (and overwrote it with dummy-test, making outgoing e-mails completely useless ofc.) that we saw our style-settings taking effect again.
From Outlook, we pulled the source files of the mails, containing the html formatting.
We found that, when ###html### is used, zammad places a tag right after the first meta tag, thus rendering the later defined style settings ineffective.
When we replaced ###html### with a string, suddenly the emails were beeing sent with correct settings, no extra tags anywhere in sight.
I’ve attached screenshots, our used .erb files and the html-source files from the test emails for comparison.
Hope this is an easy fix! 
Modified .erb
body { font-family:Arial,Sans-Serif; font-size: 14.5px; } img { outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; } a:link { color: black; background-color: transparent; text-decoration: underline; } a:visited { color: black; background-color: transparent; text-decoration: underline; } a:hover { color: black; background-color: transparent; text-decoration: underline; } a:active { color: black; background-color: transparent; text-decoration: underline; } a img { border: none; } table td { border-collapse: collapse; } table { border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border: none; table-layout: auto; display: block; width: 100%; overflow: auto; word-break: keep-all; } table, pre, blockquote { margin: 0 0 16px; } td, th { padding: 7px 12px; } th { font-weight: bold; text-align: center; } col { width: auto; } p { margin: 0; } code { border: none; background: hsl(0,0%,97%); white-space: pre-wrap; } blockquote { padding: 8px 12px; border-left: 5px solid #eee; } pre { padding: 12px 15px; font-size: 13px; line-height: 1.45; background: hsl(0,0%,97%); white-space: pre-wrap; border-radius: 3px; border: none; overflow: auto; } ###html###original .erb
body { ###html_email_css_font###; } img { outline: none; text-decoration: none; -ms-interpolation-mode: bicubic; } a img { border: none; } table td { border-collapse: collapse; } table { border-collapse: collapse; mso-table-lspace: 0pt; mso-table-rspace: 0pt; border: none; table-layout: auto; display: block; width: 100%; overflow: auto; word-break: keep-all; } table, pre, blockquote { margin: 0 0 16px; } td, th { padding: 7px 12px; } th { font-weight: bold; text-align: center; } col { width: auto; } p { margin: 0; } code { border: none; background: hsl(0,0%,97%); white-space: pre-wrap; } blockquote { padding: 8px 12px; border-left: 5px solid #eee; } pre { padding: 12px 15px; font-size: 13px; line-height: 1.45; background: hsl(0,0%,97%); white-space: pre-wrap; border-radius: 3px; border: none; overflow: auto; } ###html###HTML Source received while using ###html###
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<style type="text/css">
body {
font-family:Arial,Sans-Serif;font-size:11pt;
}
img {
outline: none;
text-decoration: none;
-ms-interpolation-mode: bicubic;
}
a img {
border: none;
}
table td {
border-collapse: collapse;
}
table {
border-collapse: collapse;
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
border: none;
table-layout: auto;
display: block;
width: 100%;
overflow: auto;
word-break: keep-all;
}
table,
pre,
blockquote {
margin: 0 0 16px;
}
td, th {
padding: 7px 12px;
}
th {
font-weight: bold;
text-align: center;
}
col {
width: auto;
}
p {
margin: 0;
}
code {
border: none;
background: hsl(0,0%,97%);
white-space: pre-wrap;
}
blockquote {
padding: 8px 12px;
border-left: 5px solid #eee;
}
pre {
padding: 12px 15px;
font-size: 13px;
line-height: 1.45;
background: hsl(0,0%,97%);
white-space: pre-wrap;
border-radius: 3px;
border: none;
overflow: auto;
}
</style>
This E-Mail was sent using the original .erb File.
& 2nd Mail:
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<style type="text/css">
body {
font-family:Arial,Sans-Serif,"Comic Sans";
font-size: 14.5px;
}
img {
outline: none;
text-decoration: none;
-ms-interpolation-mode: bicubic;
}
a:link {
color: black;
background-color: transparent;
text-decoration: underline;
}
a:visited {
color: black;
background-color: transparent;
text-decoration: underline;
}
a:hover {
color: black;
background-color: transparent;
text-decoration: underline;
}
a:active {
color: black;
background-color: transparent;
text-decoration: underline;
}
a img {
border: none;
}
table td {
border-collapse: collapse;
}
table {
border-collapse: collapse;
mso-table-lspace: 0pt;
mso-table-rspace: 0pt;
border: none;
table-layout: auto;
display: block;
width: 100%;
overflow: auto;
word-break: keep-all;
}
table,
pre,
blockquote {
margin: 0 0 16px;
}
td, th {
padding: 7px 12px;
}
th {
font-weight: bold;
text-align: center;
}
col {
width: auto;
}
p {
margin: 0;
}
code {
border: none;
background: hsl(0,0%,97%);
white-space: pre-wrap;
}
blockquote {
padding: 8px 12px;
border-left: 5px solid #eee;
}
pre {
padding: 12px 15px;
font-size: 13px;
line-height: 1.45;
background: hsl(0,0%,97%);
white-space: pre-wrap;
border-radius: 3px;
border: none;
overflow: auto;
}
</style>
This E-Mail was sent using our modified .erb File.
