如何定义 HTML 电子邮件前置器

Question

如何定义 HTML 电子邮件前置器

Col*_*una 5 html css php email

我正在为 CMS 构建 HTML 电子邮件模板，我想知道是否可以定义电子邮件的前标题。

电子邮件前标题是电子邮件中紧跟在您的电子邮件提供商的电子邮件主题之后的部分。在移动设备上非常有用，用户可以一瞥电子邮件的内容。它通常是定义它的电子邮件的第一个文本内容。

目前，在我的 HTML 电子邮件设计中，我有一个页眉模板、正文模板和一个页脚模板。并且我的 preheader 由 header 模板定义；出现的第一个文本内容位于标题中，是网站名称/徽标，在电子邮件设计中造成冗余。

关于如何解决这个问题的任何想法？

Answer 1

Col*_*una 14

Sonu Yadav 分享了这个问题的完美而巧妙的解决方案（谢谢）。为了便于记录，Sonu Yadav 共享的链接上提供的解决方案如下。

基本上，您可以在标签中的所有内容之前添加您希望预标头出现的文本<body>，并使用 CSS 来隐藏它。

<style>
/* ... */
/*--- Preheader declaration in style block in addition to inline for Outlook */
.preheader { display:none !important; visibility:hidden; opacity:0; color:transparent; height:0; width:0; }
</style>
</head>

<body>
<!-- PRE-HEADER TEXT -->
<span class="preheader" style="display: none !important; visibility: hidden; opacity: 0; color: transparent; height: 0; width: 0;">Preheader text shows up in GMail, iOS, Mail.app, &amp; more: 75 text char limit</span>
...

Run Code Online (Sandbox Code Playgroud)

归档时间：	10 年，2 月前
查看次数：	11429 次
最近记录：	10 年，1 月前