Re: Email Preview Pane

Anonymous · ‎02-24-2015

Hello,

How can I control what is shown in the email preview pane when a person goes through their email? I am looking to control what is shown for mobile devices.

Thanks,
David

Justin_Cooperm2 · ‎02-24-2015

Make the first thing that appears in the Email Template under the <body> a “mktEditable” section. Add whatever other content or “mktEditable” sections you want beneath that first section (it’s irrelevant what else is in the template). Then, when you create an individual Email Asset from this template, double-click the first region in the email. Click the “HTML” button in the TinyMCE rich-text editor. Add a pre-header at the very beginning of the code like this:

<div style="display: none !important;">This is the pre-header. It should be ~100 characters long for best results as different clients will show different amounts of the pre-header…</div>

<div>This is the actual start of the email content here!</div>

When you click “Update” you’ll only see “This is the actual start of the email content here!” in TinyMCE, but the pre-header will be applied.

View solution in original post

Justin_Cooperm2 · ‎02-24-2015

Make the first thing that appears in the Email Template under the <body> a “mktEditable” section. Add whatever other content or “mktEditable” sections you want beneath that first section (it’s irrelevant what else is in the template). Then, when you create an individual Email Asset from this template, double-click the first region in the email. Click the “HTML” button in the TinyMCE rich-text editor. Add a pre-header at the very beginning of the code like this:

<div style="display: none !important;">This is the pre-header. It should be ~100 characters long for best results as different clients will show different amounts of the pre-header…</div>

<div>This is the actual start of the email content here!</div>

When you click “Update” you’ll only see “This is the actual start of the email content here!” in TinyMCE, but the pre-header will be applied.

Chris_Saporito · ‎07-29-2015

Hi Justin, would you care to share some screen grabs of this?

Thanks!

Chris

Justin_Cooperm2 · ‎07-29-2015

Screen grabs of the code? Or what it looks like in an email client? It's just the preview you would see on an iPhone or in Gmail inbox...

Chris_Saporito · ‎07-30-2015

A screen grab of the code would be perfect!

Justin_Cooperm2 · ‎07-30-2015

The code is pasted above. It should be the first thing that comes after the HTML <BODY> element. You can put it in the Email Template itself or insert it using the text editor if the very first thing in the <BODY> is a mktEditable <div>

Anonymous · ‎09-10-2015

How do you get around the View as webpage text when that is added to the EMAIL.

Another way of displaying this text if you are coding without the wyswig is to place a snippet at the beginning of the HTML.

come look at this cool email

</div>

Justin_Cooperm2 · ‎09-11-2015

If you click "Edit Settings" in the Email Editor you will see an option to toggle "Include View As Webpage"

Anonymous · ‎09-16-2015

I found a resolve that works across the board.

The resolve is to place the view as webpage token into place after the snippet. Here is my fully functional code snippet.

Make sure to come visit our cool event

</div>

</td>

</tr>

Anonymous · ‎09-16-2015

Ops, I forgot to mention this table row needs to be the first snippet in the email.