Preheader
Preheaders are used to show readers a summary of what's in a message.
Usage
Most email clients show a preheader to give the reader a summary of the message before they open it. With over 50% of email opens occuring on mobile devices where mailboxes are scanned, it is increasing important that your message stands out.
When writing a preheader, try using one of the following:
- Call to action
- Question
- Personalized introduction
- Emoji to add some color
Example
Copy the code below and paste it as the first row within the #email-container to create a preheader in your email.
When adding a preheader component to your email, note the special #preheader id tag. This removes it from the email design but still making it visible by the email client and your reader.
Preheader
Use the code below to create a default preheader.
The preheader id tag sets the necessary visibility styles.Best Practices
Follow these best practices when using preheaders.
- Always include a preheader or you could end up with unintended content populating this field.
- Don't repeat what is in the subject line.
- Limit the content in the preheader to between 50-100 characters.
Frequently Asked Questions
Answers to common questions about preheaders in Email Kit.
If you don't include a preheader, email clients will pull the first content it finds causing potentially unintended issues.
Try and limit your preheader to between 50-100 characters long to ensure your content is visible on both desktop and mobile email clients.