Preview Text

In order to utilize this feature, changes need to be made to the HTML of the email. See below.

Preview text is abbreviated copy from an email that is displayed in supporter inboxes usually next to or underneath the subject line. 

Preview Text Example

Preview text is available as a field to populate when building an email message. This works by populating a data tag that needs to be placed in the email template along with styling to hide the text from the email itself.

Preview Text

Adding Preview Text to Email Templates

The value inputed in the Preview Text field will populate the data tag {preview_text}. This needs to be placed in the the HTML of the email along with code to hide the preview text in the email body. The following needs to be added inside the <body> tag of the email:

<span class="preheader">{preview_text}</span>

This needs to be accompanied with the following CSS in the <head> of the email and inside <style> tags:

.preheader {
    color: transparent;
    display: none;
    height: 0;
    max-height: 0;
    max-width: 0;
    opacity: 0;
    overflow: hidden;
    mso-hide: all;
    visibility: hidden;
    width: 0;
}

 

 

 

Updated on November 23, 2020

Was this article helpful?

Need Support?
Can’t find the answer you’re looking for? Don’t worry we’re here to help!
Contact Support