在带有 NodeJS 电子邮件模板的邮件中使用 Google 字体

Question

我使用 NodeJS、nodemailer、电子邮件模板和 ejs 向我的婚礼宾客发送邀请。

我已经解决了大部分问题，但我似乎无法管理自定义字体，网上有很多关于它的内容...

我认为 this one is the most elaborate article 我看过 :

所以我在 head 标签中添加了这个：

<link href='https://fonts.googleapis.com/css?family=Tillana' rel='stylesheet' type='text/css'>

但这在 gmail 和 outlook 中仍然没有以正确的字体显示（尚未测试 yahoo 和其他）...

<td align="center" valign="top" style="padding: 0; font-family: Tillana, Open Sans, Helvetica, Arial, sans-serif; color: #999999;">
    <p style="font-size: 14px; line-height: 20px;">
        Some text hopefully in Tillana
    </p>
</td>

我在email-templates documentation that you can use an image rendering of the font with custom-fonts-in-emails看过，不过好像有点矫枉过正了...

关于如何处理大多数情况有什么建议吗？

Answer 1

Google 字体不适用于 Gmail 或 Outlook

Webfonts 不适用于所有电子邮件客户端。它们不适用于 Gmail、Yahoo、Android 客户端以及对 Outlook 2007-2016 的不稳定支持。我知道这听起来很荒谬，因为 Google 有 Google 字体，但目前的情况是 Gmail 不支持 Google 字体。

您需要选择一种非 Tillana 或 Open Sans 的后备字体，这也是一种 Google 字体。在您的情况下，Gmail 的备用字体将为 Arial。

Gmail 支持的字体

https://jsfiddle.net/wallyglenn/g35nchmL/

这些链接将使您更好地了解网络字体以及如何在电子邮件中使用它们。

Outlook 自定义字体

Microsoft Outlook 令人沮丧。 Outlook 2007-2016 有时可以使用 Google 字体。它也有网络安全字体的问题。如果字体名称中有 space，它将恢复为默认字体 Times-New Roman，这令人沮丧，因为该字体名称中有 space！

为确保 Outlook 不会默认为“时代”，请将其添加到 <style></style> 块下方：

<!--[if (gte mso 9)|(IE)]><style type="text/css">
body, table, td, a, p {font-family: Arial, sans-serif !important; font-size: 12px; font-weight: 300;}
</style><![endif]-->

根据需要向 body、table、td 等列表中添加更多 html 元素。您可以像使用任何其他样式一样进行自定义 sheet。 Outlook 应该使用您的样式 sheet，但如果不是，这通常会强制它工作。

祝你好运。

在带有 NodeJS 电子邮件模板的邮件中使用 Google 字体

Use a Google Font in mails with email-templates for NodeJS

html

email

webfonts

email-templates

node.js