Re: Modules do not show up in Outlook

Anonymous · ‎01-10-2018

I've just created a new email template with Modules and it seems to be working correctly except for on Outlook desktop. The email content shows up everywhere else when I test it, except for when I view on my own Outlook, the email is completely blank.

Can any one help? Thanks!

JD_Nelson · ‎01-10-2018

seems to pass all litmus testing:

Maybe a local setting from your IT dept?

View solution in original post

Gerard_Donnell4 · ‎01-10-2018

Hi @stephen_schmuhl,

Can you provide some screenshots?

Do other people see it on Outlook?

Thanks,

Gerard

Anonymous · ‎01-10-2018

Here are some screenshots.... as you can see it is empty on outlook desktop, but when I view from my phone or webmail, it works fine.

Anonymous · ‎01-10-2018

Everyone else on my team has the same issue with the email on Outlook desktop.

JD_Nelson · ‎01-10-2018

we'll need to see the code to better understand what's happening

Anonymous · ‎01-10-2018

Sure - here is the code:

<head>

<!--[if gte mso 9]>

<xml>

<o:OfficeDocumentSettings>

<o:AllowPNG/>

<o:PixelsPerInch>96</o:PixelsPerInch>

</o:OfficeDocumentSettings>

</xml>

<![endif]-->

<title>Event Reminder</title>

<!--[if mso]>

.h1,.h2,.h3,a,p,li,.mlContentContainer,.mlContentContainer .h1,.mlContentContainer .h2,.mlContentContainer .h3,.mlContentContainer a,.mlContentContainer p,.mlContentContainer li,.mlContentContainer p,.mlContentContainer .mlContentRSS{

font-family: Arial, Helvetica, sans-serif;

}

</style>

<![endif]-->

.ReadMsgBody{ width: 100%; }

.ExternalClass{ width: 100%; }

.ExternalClass *{ line-height: 100%; }

.ExternalClass,.ExternalClass p,.ExternalClass td,.ExternalClass div,.ExternalClass span,.ExternalClass font{

line-height:100%;

}

body{

margin: 0;

padding: 0;

}

body,table,td,p,a,li{

-webkit-text-size-adjust: 100%;

-ms-text-size-adjust: 100%;

}

table td{ border-collapse: collapse; }

table{

border-spacing: 0;

border-collapse: collapse;

}

p,a,li,td,blockquote{

mso-line-height-rule: exactly;

}

p,a,li,td,body,table,blockquote{

-ms-text-size-adjust: 100%;

-webkit-text-size-adjust: 100%;

}

img,a img{

border: 0;

outline: none;

text-decoration: none;

}

img{

-ms-interpolation-mode: bicubic;

}

a[href^=tel],a[href^=sms]{

color: inherit;

cursor: default;

text-decoration: none;

}

a[x-apple-data-detectors]{

color: inherit!important;

text-decoration: none!important;

font-size: inherit!important;

font-family: inherit!important;

font-weight: inherit!important;

line-height: inherit!important;

}

.mlContentTable.mlFooterTable a {

color: #000000;

}

.mlEmailContainer{

max-width: 640px!important;

}

.mlContentContainer p a, ol li a, ul li a {

word-break: break-word;

}

@-moz-document url-prefix() {

.mlContentContainer p a, ol li a, ul li a {

word-break: break-all;

}

@media only screen and (min-width:768px){

.mlEmailContainer{

width: 640px!important;

}

@media only screen and (max-width: 640px) {

.mlTemplateContainer{

padding: 10px 10px 0 10px;

}

.mlContentTable{

width: 100%!important;

min-width: 200px!important;

}

/* -- */

.mlContentBlock{

float: none!important;

width: 100%!important;

}

/* -- */

.mlContentOuter{

padding-bottom: 0px!important;

padding-left: 25px!important;

padding-right: 25px!important;

padding-top: 25px!important;

}

/* -- */

.mlBottomContentOuter{

padding-bottom: 25px !important;

}

.mlLeftRightContentOuter {

padding-left: 5px!important;

padding-right: 5px!important;

}

.mlContentContainerOuter{

padding-left: 0px!important;

padding-right: 0px!important;

}

/* -- */

.mlContentContainer{

padding-left: 25px!important;

padding-right: 25px!important;

}

/* -- */

.mlContentButton a,

.mlContentButton span{

width: auto!important;

}

/* -- */

.mlContentImage img{

height: auto!important;

width: 100%!important;

}

/* -- */

.mlContentRSS.rss_img3 img{

height: auto!important;

width: 100%!important;

}

/* -- */

.mlContentImage{

height: 100%!important;

width: auto!important;

}

.mlContentLogo img{

height: auto!important;

width: 100%!important;

}

/* -- */

.mlContentContainer h1{

font-size: 24px!important;

line-height:125%!important;

margin-bottom: 0px!important;

}

/* -- */

.mlContentContainer h2{

font-size: 18px!important;

line-height:125%!important;

margin-bottom: 0px!important;

}

/* -- */

.mlContentContainer h3{

font-size: 16px!important;

line-height:125%!important;

margin-bottom: 0px!important;

}

/* -- */

.mlContentContainer p,

.mlContentContainer .mlContentRSS{

font-size: 16px!important;

line-height:150%!important;

}

/* -- */

.mobileHide{

display: none!important;

}

/* -- */

.alignCenter{

height: auto!important;

text-align: center!important

}

/* -- */

.marginBottom{

margin-bottom: 25px!important;

}

/* -- */

.mlContentHeight{

height: auto!important;

}

.mlContentGap{

height: 25px!important;

}

.mlDisplayInline {

display: inline-block!important;

float: none!important;

}

body{

margin: 0px!important;

padding: 0px!important;

}

body,table,td,p,a,li,blockquote{

-webkit-text-size-adjust: none!important;

}

@media only screen and (max-width: 540px) {

.mlContentRSS.rss_img2 img {

height: auto!important;

width: 100%!important;

}

@media only screen and (max-width: 440px) {

.mlContentRSS.rss_img1 img {

height: auto!important;

width: 100%!important;

}

@media only screen and (max-width: 320px) {

.mlContentRSS.rss_img0 img {

height: auto!important;

width: 100%!important;

}

</style>

</head>

<tr>

<tr>

<tr>

</tr>

</table>

<tr>

</td>

</tr>

</table>

<tr>

<td>

<tr>

Your Event is Today!

</h1>

</td>

</tr>

</table>

</td>

</tr>

</table>

<table align="center" border="0" bgcolor="#FFFFFF" class="mlContentTable mktoModule" id="EventInfoMod" mktoName="Event Info Module" cellspacing="0" cellpadding="0" style="background: #FFFFFF; min-width: 640px; width: 640px;" width="640" id="ml-block-69497492"> <tr> <td> <table width="640" class="mlContentTable" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" border="0" align="center" style="background: #FFFFFF; width: 640px;"> <tr> <td align="left" class="mlContentContainer" style="padding: 15px 50px 10px 50px; font-family: Helvetica; font-size: 14px; color: #7F8C8D; line-height: 23px;"> <table class="mlContentBlock marginBottom" align="right" style="border-collapse: collapse;mso-table-lspace: 6pt;mso-table-rspace: 0pt;"> <tr> <td class="mobileHide" height="155" width="30"></td> <td class="mlContentImage" height="155" width="233"> <img class="mktoImg" id="EventImage" mktoName="Event Image" mktoLockImgSize="false" style="display: block;margin: 0px;" border="0" src="https://bucket.mlcdn.com/a/960/960810/images/cacd09156b7999a321e3b3b850cb31071aa113c4.jpeg/31fa44d9a..." width="233" height="155" alt="" align="right"> </td> </tr> <tr> <td height="10" class="mobileHide" colspan="2"></td> </tr> </table> <p class="mktEditable" id="EventInfo" mktoName="Event Info" style="margin: 0px 0px 10px 0px; line-height: 23px;">Nulla consequat egestas erat, ut lacinia tellus hendrerit lacinia. Quisque tincidunt eros porta tempus facilisis. Nullam tincidunt ultrices turpis, vel dapibus est dictum sed. Sed auctor sapien ac lorem semper porta. </p> </td> </tr> </table> </td> </tr> </table>

<tr>

<td>

<tr>

<tr>

</tr>

</table>

</td>

</tr>

</table>

</td>

</tr>

</table>

<table align="center" border="0" bgcolor="#FFFFFF" class="mlContentTable mktoModule" mktoName="Event Details Module" id="EventDetailsMod" cellspacing="0" cellpadding="0" style="background: #FFFFFF; min-width: 640px; width: 640px;" width="640" id="ml-block-69497968"> <tr> <td> <table width="640" class="mlContentTable" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" border="0" align="center" style="background: #FFFFFF; width: 640px;"> <tr> <td align="left" class="mlContentContainer mktEditable" id="EventDetails" mktoName="Event Details" style="padding: 15px 50px 5px 50px; font-family: Helvetica; font-size: 14px; color: #7F8C8D; line-height: 23px;"> <h2 style="line-height: 26px; text-decoration: none; font-weight: bold; margin: 0px 0px 10px 0px;font-family: 'Comfortaa', Sans-Serif; font-weight: bold; font-size: 20px; color: #00aee6; text-align: left;"> Event Details: </h2> <p style="margin: 0px 0px 10px 0px; line-height: 23px;"><strong>Date:</strong> Friday, November 10, 2017</p> <p style="margin: 0px 0px 10px 0px; line-height: 23px;"><strong>Time:</strong> 12:00 PM CST</p> <p style="margin: 0px 0px 10px 0px; line-height: 23px;"><strong>Venue:</strong> Venue Name, Venue Address</p> </td> </tr> </table> </td> </tr> </table>

<table align="center" border="0" bgcolor="#FFFFFF" class="mlContentTable mktoModule" mktoName="Button Module" id="ButtonMod" cellspacing="0" cellpadding="0" style="background: #FFFFFF; min-width: 640px; width: 640px;" width="640" id="ml-block-69497826"> <tr> <td> <table width="640" class="mlContentTable" bgcolor="#FFFFFF" cellspacing="0" cellpadding="0" border="0" align="center" style="background: #FFFFFF; width: 640px;"> <tr> <td width="540" class="mlContentContainer" cellspacing="0" cellpadding="0" border="0" style="padding: 0px 0px 0px 50px;"> <table width="540" class="mlContentBlock" cellspacing="0" cellpadding="0" border="0" align="left" style="width: 540px;"> <tr> <td class="mlContentButton mktEditable" id="button" mktoName="Button" align="center" style="padding: 15px 0px 15px 0px;">  <span class="button-1" style="background-color: #ecb731; color: #FFFFFF; font-family: Helvetica; font-size: 15px; line-height: 21px; display: inline-block; border-radius: 6px; text-align: center; text-decoration: none; font-weight: bold; display: block; margin: 0px 0px; padding: 10px 0px;width: 540px;"> Add to Calendar </span>  </td> </tr> </table> </td> </tr> </table> </td> </tr> </table>

<tr>

<td>

<tr>

Sponsored by:

</h1>

</td>

</tr>

</table>

</td>

</tr>

</table>

</a></div>

</td> </tr> </table> </td> </tr> </table> </td> </tr> </table> </td> </tr> </table>

</a></div>

</td> </tr> </table> </td> </tr> </table> <table class="mlContentBlock" cellspacing="0" cellpadding="0" border="0" align="right" style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;"> <tr align="center"> <td class="mlContentImage" style="mso-line-height-rule: exactly;-ms-text-size-adjust: 100%;-webkit-text-size-adjust: 100%;">

</a></div>

</td> </tr> </table> </td> </tr> </table> </td> </tr> </table> </td> </tr> </table>

<tr>

<table width="640" class="mlContentTable" cellspacing="0" cellpadding="0" border="0" align="center" bgcolor="#D3D7D7" style="background: #D3D7D7; width: 640px;"> <tr> <td class="mlContentOuter mlBottomContentOuter" style="padding: 30px 50px 30px 50px; width: 540px;"> <table width="240" class="mlContentBlock marginBottom" cellpadding="0" cellspacing="0" border="0" align="left" style="width: 240px;"> <tr> <td align="left" class="alignCenter" style="padding: 0px 0px 0px 0px; vertical-align: middle; font-family: Helvetica; font-size: 11px; color: #000000;"> <p style="margin: 0px 0px 5px 0px; padding: 0px; line-height: 150%;font-family: Helvetica; font-weight: bold; font-size: 15px; color: #00aee6;">Nexum, Inc.</p> <p style="margin: 0px 0px 5px 0px; padding: 0px; line-height: 150%;">190 S. LaSalle Street<br />Suite 1450<br />Chicago, IL 60603<br />(312) 726-6900</p> <p style="margin: 0px 0px 5px 0px; padding: 0px; line-height: 150%;"> </p> </td> </tr> </table> <table width="280" class="mlContentBlock" cellpadding="0" cellspacing="0" border="0" align="right" style="width: 280px;"> <tr> <td class="alignCenter" style="text-align: right; padding: 0px 0px 15px 0px; font-family: Helvetica; font-size: 11px; color: #000000;"> <table align="right" class="mlDisplayInline" cellpadding="0" cellspacing="0" border="0"> <tr> <td class="mobileHide" width="10"></td> <td class="mlLeftRightContentOuter"> <a style="color: #000000;border: none;" href="https://www.linkedin.com/company/244940/"><img border="0" src="https://static.mailerlite.com/images/social-icons/new/set2/linkedin.png" alt="Linkedin" width="32"></a> </td> <td class="mobileHide" width="10"></td> <td class="mlLeftRightContentOuter"> <a style="color: #000000;border: none;" href="https://twitter.com/nexuminc"><img border="0" src="https://static.mailerlite.com/images/social-icons/new/set2/twitter.png" alt="Twitter" width="32"></a> </td> <td class="mobileHide" width="10"></td> <td class="mlLeftRightContentOuter"> <a style="color: #000000;border: none;" href="mailto:marketing@nexuminc.com"><img border="0" src="https://static.mailerlite.com/images/social-icons/new/set2/email.png" alt="Email" width="32"></a> </td> </tr> </table> </td> </tr> <tr> <td align="right" class="alignCenter" style="padding: 0px 0px 0px 0px; font-family: Helvetica; font-size: 11px; color: #000000;"> <p style="margin: 0px 0px 5px 0px; padding: 0px; line-height: 150%;">© 2017 Nexum, Inc. All rights reserved. All registered trademarks are property of their respective owners. Questions? Contact us at <a href="mailto:marketing@nexuminc.com" style="color: #000000;">marketing@nexuminc.com</a></p> <p style="margin: 0px 0px 5px 0px; padding: 0px; line-height: 150%;padding: 0px; margin: 0px;"><a style="color: #000000;text-decoration: underline; color: #000000;" href=""><strong></strong></a></p> </td> </tr> </table> </td> </tr> </table>

</td>

</tr>

</table>

</td>

</tr>

</table>

</td>

</tr>

</table>

</body>

</html>

JD_Nelson · ‎01-10-2018

seems to pass all litmus testing:

Maybe a local setting from your IT dept?

Anonymous · ‎01-11-2018

Thanks! I'll have them check it out.

Anonymous · ‎01-11-2018

I was missing the <!DOCTYPE html> and that was what was causing them to not show up in my Outlook.