如何在 Mailchimp 模板中保留图像尺寸

Question

我正在 Mailchimp 中创建一个模板来发送时事通讯。该模板包含一个可重复的部分，其中包含一个具有前缀大小的图像。出于某种原因，它会从 img 元素中去除 width="" 和 height="" 值，并且仅当您在每个图像的图像设置中手动设置这些值时才包括它们。这意味着如果用户上传不同尺寸的图像并且没有手动输入正确的尺寸，那么在 Outlook 中图像将显示为完整尺寸。

为了使其在设计编辑器上更加不友好，它使用 width/height css 样式来显示图像大小，因此它表示（例如）350px 宽 x 234px 高你可以上传一个更大的图像，它以 350 像素的宽度显示它（这会让用户认为它是正确的）。但是它不包括 html img width/height 值，除非您手动指定它们，这意味着 Outlook 中的图像大小是错误的。

有谁知道至少强制 html 宽度变量自动包含在 img 元素中？否则用户必须手动为每个图像手动设置相同的 width/height 如果他们忘记了那么它就不会在 Outlook 中正确显示？

谢谢，

戴夫

Answer 1

对于其他参考，我现在已经与 mailchimp 交谈并使用 https://www.snip2code.com/Snippet/25348/HTML-Email-Template--max-width-hack-for-（下方）的代码和 img 的 max-width/max-height css 值的组合修复了 outlook 中的问题:

<!--[if (gte mso 9)|(IE)]>
<center>
  <table>
    <tr>
      <td width="600">
        <![endif]-->
        <div style="max-width: 600px; margin: 0 auto;">
          <p>This text will be centered and constrained to 600 pixels even on Outlook which does not support max-width CSS</p>
        </div>
        <!--[if mso]>
      </td>
    </tr>
  </table>
</center>
<![endif]-->

Answer 2

要解决此问题，您必须在实际图像本身上指定最大宽度，并确保将其内联到标签中，如下所示：

<img mc:edit="image" src="image.jpg" width="200" style="max-width: 200px;">

包含在头部的CSS中不算。

我发现最大宽度必须是您在样式中指定的最后。因此，如果您还指定了背景，例如，您会把它放在第一位，即 background-color: #fcfcfc; max-width: 200px;.

我上次尝试此操作时，MailChimp 编辑器只会在图像编辑后添加 width="200"，因此如果您单独留下占位符图像，它不会应用宽度，因此会保持原始状态尺寸。不幸的是，我不再确定是否是这种情况，并且我现在没有为 Mailchimp 付款，所以我无法检查。

如何在 Mailchimp 模板中保留图像尺寸

How to retain image dimensions in Mailchimp templates

html

image

email

mailchimp