Preview Text

This is a text snippet that appears under the subject line in the inbox but is hidden from the main email content when it’s opened.

The code

<div style="display:none">
  Preview text...
</div>

It really is that simple.

Previously have been a number of issue with support for display:none;. For example when tested in October 2019 Mail.ru would hide content from the preview text as well as the email when set to display:none, visibility:hidden, or using a hidden attribute. And I was recommending using <div style="max-height:0;overflow:hidden;mso-hide:all;" aria-hidden="true"> but that appears to be fixed now (July 2020), so we can just use the simplified version.

preview text spacing hack

If you want to use short preview text then the rest of the space of the preview will pull in content from the rest of your email. To stop this happening we can fill the remaining space with… spaces. For this just add a number of spaces with  ͏ between them, like this  ͏  ͏  ͏  ͏. Just add as many as you need to fill up the space (this could be as much as 100-200)

Previously I recomended using ͏ but it apears that stopped working in Yahoo and AOL at some point late in 2022 and stopped working in Applemail 16.4 Beta (March 2023). If you want to know more, I’ve gone into a more detail on this issue on the Parcel Blog preview text spacing.

I’ve seen emails also use ‌ or ‌ but from my tests those don’t add any space on mail.ru.

Plain text preview text

Some email apps pulls in the preview text content from the plain text version of the email. Including

• GMX on Android
• Web.de on Android
• Mail.com on Android
• 1&1 on Android
• K-9 on Android

Often the plain text version is auto generated by your ESP if this version is generated with ͏ rather than the characters they represent then they will show in the preview text. If this happens you can copy and paste the character into your plain text version, however this will show in the plain text version of your email.