-
-
Save kbav/4126337 to your computer and use it in GitHub Desktop.
| <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, & more: 75 text char limit</span> | |
| ... |
This doesn't work very well - tested in Litmus.
I use this. Late in the game but hope that helps:
<td style="display:none !important; visibility:hidden; opacity:0; color:transparent; height:0; width:0; mso-hide:all; line=height:0px; font-size:0px">Your preheader here</td>
Tested in Litmus. Works for me.
Note: I wrap the preheader into a <td> instead of using <span> as <span> seems to increase the Spam Assassin score (https://www.campaignmonitor.com/forums/topic/8131/hidden-preheader-span-scores-20-points-with-spamassassin/)
☝️ @ericlepetit has got it. Use that everybody!
I'll edit my code and test when I get a chance...busy season...
Can´t make it work in Gmail
Here's the one I use, works perfectly:
<span class="preheader" style="color: #f3f3f3; display: none !important; font-size: 1px; line-height: 1px; max-height: 0px; max-width: 0px; mso-hide: all !important; opacity: 0; overflow: hidden; visibility: hidden;">Preheader text</span>
This works for me, prepend this to body before sending out email:
<!-- Visually Hidden Preheader Text : BEGIN -->
<div style="display:none;font-size:1px;line-height:1px;max-height:0px;max-width:0px;opacity:0;overflow:hidden;mso-hide:all;font-family: sans-serif;">
Some preview Text
</div>
Did you test this?