Hidden Email Preheader | HTML Code Copy
Often I need to add preheaders to custom coded emails for platforms that do not offer preheader fields natively. If done incorrectly, the preheader text will show at the top of some email clients (Outlook… 🤦♂️), not ideal.
Copy and paste this code just below the opening
<span style="display:none !important;
overflow:hidden;">Add email preheader text here.</span>
- the span text
colorneeds to match the body background color
Take it further
Many email platforms will allow you to take this a step-further by adding a dynamic single-line text field. It is beyond the scope of this article, but if you have a question about a particular platform, leave a comment and I’ll respond.
If you found this helpful, like > follow > share > comment.
CR Rollyson is a Digital UX & Web manager for a S&P 500 FinTech company and is the COO of Side Role, a marketing agency partnering with In-house Teams & Agencies, Non-profits, and Start-Ups. Learn more about Side Role here.