将外部 CSS 转换为内联 CSS 用于 Rails 中的邮件

Question

我正在尝试创建一个应用程序，该应用程序将发送样式繁重的电子邮件，并且需要除 Google 的 Gmail 之外的其他客户端。我研究了这个问题，看起来 Gmail 从外部文件中删除了 CSS 或嵌套在“样式”标签中的 CSS。是否存在将样式从外部文件移动到内联的简单方法？

需要的东西：

<style>
.wide { width: 100px; }
.cell { display: block; }
</style>
<span class="wide cell">Sample</span>

并将其转换为：

<div class="wide cell" style="width: 100px; display: block;">Sample</div>

谢谢！

Answer 1

你的推理只有一个问题.....许多样式，甚至是内联，都不支持。

这是what is supported in email的参考

在您的示例中，您使用了 display: 标签，Outlook 07+ 不支持该标签

我的公司每天发送数千封电子邮件，而我经常参与构建它们。在实践中，内联样式是有效的，但它并不像内联所有内容那么简单，它会起作用。您必须非常小心使用什么以及如何使用它。我已经开始了，几乎所有的事情都在纯 HTML 中使用表格进行布局。这基本上是我发现的让事情几乎 100% 正常工作的唯一方法。

如果您将此功能构建到一个会得到大量使用的应用程序中，我还强烈建议您通过他们的 API 构建 Email on Acid。虽然您可以编写出质量非常好的输出代码，但微软无疑会找到一些方法让您的有效代码无法工作。 Acid 上的电子邮件将使用微软当时使用的任何疯狂来显示您的电子邮件是否有效。对于那些认真发送大量电子邮件的人来说，这是纯粹的天才和必需的用途。不，我不为公司工作....

Answer 2

添加premailer:

def premailer(message)
  message.text_part.body = Premailer.new(message.text_part.body.to_s, with_html_string: true).to_plain_text
  message.html_part.body = Premailer.new(message.html_part.body.to_s, with_html_string: true).to_inline_css

  return message
end

def welcome(user)
  @user = user

  message = mail ...
end

Answer 3

您可以查看以下几个宝石：

• premailer 或 premailer-rails 用于导轨
• mail_style
• premailer plus（以上版本的fork）
• awesome_email
• roadie

我在写这个答案时没有赢家，但 premailer 似乎是最新的。