View Online
Code
<table id="view-online" class="mktoModule" mktoName="View Online" width="100%" cellpadding="0" cellspacing="0" border="0">
<tr>
<td width="100%" valign="top" align="center" bgcolor="${emailBodyColor}" style="padding: 10px 10px 10px 10px;">
<div id="view-online__text" class="mktoText" mktoname="View Online" style="font-family: arial, sans-serif, Lato; font-size: 11px; font-weight: normal; line-height: 13px; mso-line-height-rule: exactly; text-align: center; color: #212121;"> Having trouble viewing this email? <a href="{{system.viewAsWebpageLink}}" style="text-decoration: underline; font-size: 11px; color: #212121;">View online</a>. </div>
<div id="forward__text" class="mktoText" mktoname="Forward Text" style="font-family: arial, sans-serif, Lato; font-size: 11px; font-weight: normal; line-height: 13px; mso-line-height-rule: exactly; text-align: center; color: #212121;"> Want to share this email? <a href="{{system.forwardToFriendLink}}" style="text-decoration: underline; font-size: 11px; color: #212121;">Forward to a friend</a>. </div>
</td>
</tr>
</table>
Design files
FIGMA
PHOTOSTOP
Use Case
View online should be the very first component in the email and it allows the user to view the email in their browser.
This component also allows the user to forward the email to a friend.
