New Participant

Solved

Can't change font in Text Editor in Quickstart Email Template

Forum|Forum|3 years ago
January 4, 2023
2 replies
3736 views

The Global Variable in the email is set to Open Sans, which is what we want for the body text. We're editing the headers in the Text Editor to a serif font (Times New Roman). It shows up correctly in the Preview, but when we send the test email, it arrives with all text throughout the email as Open Sans.

How can we make the headers a different font and have them NOT change back to the Global Variable when sent?

I can edit the code in the email to force it to do the headers as the serif font, but it causes the template loses its capability to add any other modules to the email. Why is the text editor not overwriting the Global Variable font?

Marketo

This post is no longer active and is closed to new replies. Need help? Start a new post to ask your question.

Best answer by Darshil_Shah1

Hi @bradyware,

I have troubleshooted your code, there are some hacks in the code, so you have to remove the below code -

Because of the above hacks, Arial font is working in the outlook clients.

Let me know if it will be helpful.

Thanks!

Jasbir

Not a hack, but these are outlook-specific conditional styles. Windows Outlook 2003 and above use Microsoft Word as a rendering engine, which can lead to some weird rendering issues. Outlook conditional comments allow us to add bits of HTML that are only read by the Word-based versions of Outlook. Developers could use MSO (Microsoft Office) tags to add HTML / CSS anywhere in an email template. This code will be ignored by other email clients and only Outlook clients will process it.

The styles mentioned by @jasbirka, modify the font type to Arial for the outlook client.

Disha_Goyal6

New Participant

Hi @bradyware,

If you are adding font in editor then Editor font will render.

Please share your HTML to troubleshoot the same.

Thanks,

Disha

bradywareAuthor

New Participant

Here's the code from the email:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:v="urn:schemas-microsoft-com:vml" xmlns:o="urn:schemas-microsoft-com:office:office" style="width: 100%;">
<head>


<meta class="mktoColor" id="bodyBgColor" mktoname="⚫ Body BG Color" default="#f9f9f9" />
<meta class="mktoColor" id="bodyborderColor" mktoname="⚫ Body Border Color" default="#eeeeee" />
<meta class="mktoString" id="url-parameter" mktoname="URL Parameters" default="" />
<meta class="mktoNumber" id="bodyborderWid" mktoname="Body Border Width (px)" default="1" />
<meta class="mktoList" id="fontfamily" mktoname="Font Family" values="Arial, Verdana, Tahoma, Roboto, Open Sans, Merriweather, PT Sans, Raleway, Source Sans Pro" default="Open Sans" />
<meta class="mktoNumber" id="logowidth" mktoname="Logo Mobile Width (px)" default="250" />
<meta class="mktoNumber" id="logowidthl" mktoname="(L) Logo Mobile Width (px)" default="250" />
<meta class="mktoNumber" id="logowidthr" mktoname="(R) Logo Mobile Width (px)" default="250" />
<meta class="mktoNumber" id="imgmaxwidth" mktoname="Banner Img Mobile Width (px)" default="660" />

<meta mktomodulescope="true" class="mktoColor" id="header-bg-Color" mktoname="⚫ Module BG Color" default="#FFFFFF" />
<meta mktomodulescope="true" class="mktoColor" id="banner2-bg-Color" mktoname="⚫ Module BG Color" default="#ffffff" />

<meta mktomodulescope="true" class="mktoNumber" id="top_Space0" mktoname="▲ Top Spacing (px)" default="0" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space5" mktoname="▲ Top Spacing (px)" default="5" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space10" mktoname="▲ Top Spacing (px)" default="10" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space15" mktoname="▲ Top Spacing (px)" default="15" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space20" mktoname="▲ Top Spacing (px)" default="20" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space25" mktoname="▲ Top Spacing (px)" default="25" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space30" mktoname="▲ Top Spacing (px)" default="30" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space35" mktoname="▲ Top Spacing (px)" default="35" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space40" mktoname="▲ Top Spacing (px)" default="40" />
<meta mktomodulescope="true" class="mktoNumber" id="top_Space70" mktoname="▲ Top Spacing (px)" default="70" />

<meta mktomodulescope="true" class="mktoNumber" id="btm_Space0" mktoname="▼ Bottom Spacing (px)" default="0" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space5" mktoname="▼ Bottom Spacing (px)" default="5" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space10" mktoname="▼ Bottom Spacing (px)" default="10" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space15" mktoname="▼ Bottom Spacing (px)" default="15" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space20" mktoname="▼ Bottom Spacing (px)" default="20" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space25" mktoname="▼ Bottom Spacing (px)" default="25" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space30" mktoname="▼ Bottom Spacing (px)" default="30" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space35" mktoname="▼ Bottom Spacing (px)" default="35" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space40" mktoname="▼ Bottom Spacing (px)" default="40" />
<meta mktomodulescope="true" class="mktoNumber" id="btm_Space110" mktoname="▼ Bottom Spacing (px)" default="110" />

<meta mktomodulescope="true" class="mktoNumber" id="headlineFontSize36" mktoname="Headline Font Size (px)" default="36" />
<meta mktomodulescope="true" class="mktoNumber" id="headlineFontSize30" mktoname="Headline Font Size (px)" default="30" />
<meta mktomodulescope="true" class="mktoNumber" id="headlineFontSize24" mktoname="Headline Font Size (px)" default="24" />
<meta mktomodulescope="true" class="mktoNumber" id="headlineFontSize20" mktoname="Headline Font Size (px)" default="20" />
<meta mktomodulescope="true" class="mktoColor" id="headlineFontColor" mktoname="⚫ Headline Text Color" default="#222b34" />
<meta mktomodulescope="true" class="mktoColor" id="headlineFontColorwhite" mktoname="⚫ Headline Text Color" default="#FFFFFF" />
<meta mktomodulescope="true" class="mktoNumber" id="SubheadlineFontSize" mktoname="Subheadline Font Size (px)" default="30" />
<meta mktomodulescope="true" class="mktoColor" id="SubheadlineFontColor" mktoname="⚫ Subheadlinbe Text Color" default="#222b34" />
<meta mktomodulescope="true" class="mktoNumber" id="btm2_Space" mktoname="▼ Space Below Headline (px)" default="10" />
<meta mktomodulescope="true" class="mktoNumber" id="FreeTextSize18" mktoname="Text Font Size (px)" default="18" />
<meta mktomodulescope="true" class="mktoNumber" id="FreeTextSize" mktoname="Text Font Size (px)" default="16" />
<meta mktomodulescope="true" class="mktoColor" id="FreeTextColor" mktoname="⚫ Text Color" default="#222b34" />
<meta mktomodulescope="true" class="mktoColor" id="FreeTextColorwhite" mktoname="⚫ Text Color" default="#FFFFFF" />
<meta mktomodulescope="true" class="mktoColor" id="footerlinkcolor" mktoname="⚫ Footer Links Color" default="#005695" />

<meta mktomodulescope="true" class="mktoImg" id="banner1_img" mktoname="BG Image" default="http://go.bradyware.com/rs/198-YAT-189/images/hero-bg-image-660x360.png" />
<meta mktomodulescope="true" id="outlook-ht1" class="mktoNumber" mktoname="BG Image Outlook Height (px)" default="360" min="0" max="1000" step="1" />
<meta mktomodulescope="true" class="mktoNumber" id="btm3_Space" mktoname="▲ Space Above CTA (px)" default="20" />

<meta mktomodulescope="true" class="mktoColor" id="CTAColor" mktoname="⚫ CTA Text Color" default="#ffffff" />
<meta mktomodulescope="true" class="mktoColor" id="CTABGColor" mktoname="⚫ CTA BG Color" default="#34495e" />
<meta mktomodulescope="true" class="mktoColor" id="CTABorderColor" mktoname="⚫ CTA Border Color" default="#34495e" />
<meta mktomodulescope="true" class="mktoNumber" id="CTABorderRadius" mktoname="CTA Border Radius (px)" default="1" />
<meta mktomodulescope="true" class="mktoString" id="CTAText" mktoname="CTA Text" default="Read More" />
<meta mktomodulescope="true" class="mktoNumber" id="CTA1FontSize" mktoname="CTA Font Size (px)" default="14" />
<meta mktomodulescope="true" class="mktoString" id="CTAURL" mktoname="CTA URL" default="#" />

<meta mktomodulescope="true" class="mktoColor" id="CTA2Color" mktoname="⚫ 2nd CTA Text Color" default="#ffffff" />
<meta mktomodulescope="true" class="mktoColor" id="CTA2BGColor" mktoname="⚫ 2nd CTA BG Color" default="#34495e" />
<meta mktomodulescope="true" class="mktoColor" id="CTA2BorderColor" mktoname="⚫ 2nd CTA Border Color" default="#34495e" />
<meta mktomodulescope="true" class="mktoNumber" id="CTA2BorderRadius" mktoname="2nd CTA Border Radius (px)" default="1" />
<meta mktomodulescope="true" class="mktoString" id="CTA2Text" mktoname="2nd CTA Text" default="Read More" />
<meta mktomodulescope="true" class="mktoNumber" id="CTA2FontSize" mktoname="2nd CTA Font Size (px)" default="14" />
<meta mktomodulescope="true" class="mktoString" id="CTA2URL" mktoname="2nd CTA URL" default="#" />
<meta mktomodulescope="true" class="mktoColor" id="CTAColor-art" mktoname="⚫ CTA Text Color" default="#34495e" />

<meta mktomodulescope="true" class="mktoColor" id="CTA3Color" mktoname="⚫ 3rd CTA Text Color" default="#ffffff" />
<meta mktomodulescope="true" class="mktoColor" id="CTA3BGColor" mktoname="⚫ 3rdd CTA BG Color" default="#34495e" />
<meta mktomodulescope="true" class="mktoColor" id="CTA3BorderColor" mktoname="⚫ 3rd CTA Border Color" default="#34495e" />
<meta mktomodulescope="true" class="mktoNumber" id="CTA3BorderRadius" mktoname="3rd CTA Border Radius (px)" default="1" />
<meta mktomodulescope="true" class="mktoString" id="CTA3Text" mktoname="3rd CTA Text" default="Read More" />
<meta mktomodulescope="true" class="mktoNumber" id="CTA3FontSize" mktoname="3rd CTA Font Size (px)" default="14" />
<meta mktomodulescope="true" class="mktoString" id="CTA3URL" mktoname="3rd CTA URL" default="#" />

<meta mktomodulescope="true" class="mktoColor" id="DividerBGColor" mktoname="⚫ Divider Color" default="#d7d7d7" />
<meta mktomodulescope="true" class="mktoNumber" id="DividerHeight" mktoname="Divider Height (px)" default="1" />
<meta mktomodulescope="true" class="mktoString" id="DividerWidth" mktoname="Divider Width (%)" default="90" />
<meta mktomodulescope="true" class="mktoNumber" id="CTAFontSize" mktoname="CTA Font Size (px)" default="14" />
<meta mktomodulescope="true" class="mktoString" id="CTAText2" mktoname="CTA Text" default="REQUEST INFORMATION" />
<meta mktomodulescope="true" class="mktoString" id="CTAText3" mktoname="CTA Text" default="REQUEST INFORMATION" />
<meta mktomodulescope="true" class="mktoString" id="CTA2Text4" mktoname="2nd CTA Text" default="REQUEST INFORMATION" />

<meta mktomodulescope="true" class="mktoList" id="alignCenterlogo" mktoname="↔ Logo Alignment" values="left,center,right" default="center" />
<meta mktomodulescope="true" class="mktoList" id="alignLeftlogo" mktoname="↔ (L) Logo Alignment" values="left,center,right" default="left" />
<meta mktomodulescope="true" class="mktoList" id="alignRightlogo" mktoname="↔ (R) Logo Alignment" values="left,center,right" default="right" />
<meta mktomodulescope="true" class="mktoList" id="alignCenter" mktoname="↔ Alignment" values="left,center,right" default="center" />
<meta mktomodulescope="true" class="mktoList" id="alignRight" mktoname="↔ Alignment CTA1" values="left,center,right" default="right" />
<meta mktomodulescope="true" class="mktoList" id="alignLeft" mktoname="↔ Alignment CTA2" values="left,center,right" default="left" />
<meta mktomodulescope="true" class="mktoList" id="alignLeft-art" mktoname="↔ Alignment CTA" values="left,center,right" default="left" />
<meta mktomodulescope="true" class="mktoList" id="alignCenter1" mktoname="↔ Text Alignment" values="left,center,right" default="left" />
<meta mktomodulescope="true" class="mktoList" id="aligncontent" mktoname="↔ Content Alignment" values="left,center,right" default="left" />
<title>{{my.ViewAsWebpage Title}}</title>
<link rel="icon" href="{{my.Favicon URL}}" type="image/x-icon" />
<link rel="shortcut icon" href="{{my.Favicon URL}}" type="image/x-icon" />


<link href="https://fonts.googleapis.com/css?family=Merriweather:300,400,700,900|Open+Sans|PT+Sans:400,700|Raleway:300,400,500,600,700,800,900|Roboto:300,400,500,700,900|Source+Sans+Pro:300,400,600,700,900" rel="stylesheet" />
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1" />
<meta name="robots" content="noindex,nofollow" />
<meta content="telephone=no" name="format-detection" />
<meta name="format-detection" content="date=no" />
<meta name="format-detection" content="address=no" />
<meta name="format-detection" content="email=no" />
<meta name="x-apple-disable-message-reformatting" />
<style>
@font-face {
font-family: 'Tahoma-Bold';
src: url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma-Bold.eot');
src: url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma-Bold.eot?#iefix') format('embedded-opentype'),
url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma-Bold.woff') format('woff'),
url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma-Bold.ttf') format('truetype'),
url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma-Bold.svg#Tahoma-Bold') format('svg');
font-weight: bold;
font-style: normal;
}
@font-face {
font-family: 'Tahoma';
src: url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma.eot');
src: url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma.eot?#iefix') format('embedded-opentype'),
url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma.woff') format('woff'),
url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma.ttf') format('truetype'),
url('http://go.bradyware.com/rs/198-YAT-189/images/Tahoma.svg#Tahoma') format('svg');
font-weight: 400;
font-style: normal;
}
</style>
<style media="all">
/* CLIENT-SPECIFIC STYLES */
/* Outlook.com / Hotmail */
.ExternalClass {
width: 100%;
}
.ReadMsgBody,
.ExternalClass,
.ExternalClass p,
.ExternalClass span,
.ExternalClass font,
.ExternalClass td,
.ExternalClass div {
line-height: 100%;
}
/* OL07-10-13"Read in browser link" */
#outlook a {
padding: 0 !important;
}
p,
.undoreset div p,
.undoreset p {
margin-top: 20px;
margin-bottom: 20px;
}
/* Various OL fixes */
body {
-webkit-text-size-adjust: 100% !important;
-ms-text-size-adjust: 100% !important;
}
table {
mso-table-lspace: 0pt !important;
mso-table-rspace: 0pt !important;
}
@-ms-viewport {
width: device-width !important;
}
img {
height: auto !important;
-ms-interpolation-mode: bicubic !important;
}
</style>
<style>
a {color: #005695}
th{font-weight:normal !important}
@media only screen and (max-width: 640px){
.main {width:100% !important; min-width: 100% !important; }
.inner_table{width:90% !important;margin:0 auto !important;}
.logomob {max-width:90% !important;margin:0 auto !important; height: auto !important}
.show{display: block !important; visibility: visible !important;}
.res{width:100% !important;display:block; height: auto !important}
.block{display:block;margin:0 auto;float:none !important; width: 100% !important; }
.left_align{text-align:left !important;}
.center{text-align:center !important;margin:0 auto; float: none !important;}
.hidden{display:none !important;}
.top_pad{padding-top:20px !important;}
.top_pad1{padding-top:30px !important;}
.imgmaxwidth{width:100%;max-width:${imgmaxwidth}px; height: auto !important}
.logowidth{width:100%;max-width:${logowidth}px; height: auto !important}
.logowidthl{width:100%;max-width:${logowidthl}px; height: auto !important}
.logowidthr{width:100%;max-width:${logowidthr}px; height: auto !important}
}
</style>
</head>
<body style="width: 100%; min-width: 100%; margin-top: 0; margin-right: 0; margin-bottom: 0; margin-left: 0; padding-top: 0; padding-right: 0; padding-bottom: 0; padding-left: 0;">
<table class="full-container" align="center" width="100%" border="0" cellpadding="0" cellspacing="0" style="border-spacing: 0; border-collapse: collapse;margin: 0 auto;">
<tbody>
<tr>
<td bgcolor="${bodyBgColor}" style="background-color:${bodyBgColor};">
<table class="main" id="outer_table" width="660" border="0" cellpadding="0" cellspacing="0" align="center" style="border-spacing: 0; border-collapse: collapse; min-width: 660px; width: 660px; margin: 0 auto; border: ${bodyborderWid}px solid ${bodyborderColor};">
<tbody>
<tr>
<td class="mktoContainer" id="template-wrapper">
<table class="mktoModule" mktoname="Image Module-1" id="ImageModule6cd111c1-541d-4128-a077-4134d0255761" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0" style="border-spacing: 0px;border-collapse: collapse;margin: 0 auto;">
<tbody>
<tr>
<td height="${top_Space0}" style="line-height:${top_Space0}px;font-size:${top_Space0}px;"> </td>
</tr>
<tr>
<td class="fullWid center" align="${alignCenter}" style="text-align: ${alignCenter}; font-size: 1px; line-height: 1px;">
<div class="mktoImg" mktoname="Image [660x280]" id="Image176f19b52-9274-41af-94d5-e385cd0fb4ae" mktolockimgsize="false">
<div>
<img class="imgmaxwidth" src="https://go.bradyware.com/rs/198-YAT-189/images/BW%26C Logo_black outlines-email.jpg" width="300" border="0" style="-ms-interpolation-mode:bicubic; border-collapse:collapse; padding:0px; margin:0px auto; border-spacing:0;" height="90" alt="BW&C Logo_black outlines-email.jpg" />
</div>
</div> </td>
</tr>
<tr>
<td height="${btm_Space0}" style="line-height:${btm_Space0}px;font-size:${btm_Space0}px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="Image Module" id="ImageModule" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table width="100%" align="center" cellpadding="0" cellspacing="0" border="0" style="border-spacing: 0px;border-collapse: collapse;margin: 0 auto;">
<tbody>
<tr>
<td height="${top_Space0}" style="line-height:${top_Space0}px;font-size:${top_Space0}px;"> </td>
</tr>
<tr>
<td class="fullWid center" align="${alignCenter}" style="text-align: ${alignCenter}; font-size: 1px; line-height: 1px;">
<div class="mktoImg" mktoname="Image [660x280]" id="Image1" mktolockimgsize="false">
<div>
<img class="imgmaxwidth" src="https://go.bradyware.com/rs/198-YAT-189/images/BWC newsletter header %281%29.png" width="660" border="0" style="-ms-interpolation-mode:bicubic; border-collapse:collapse; padding:0px; margin:0px auto; border-spacing:0;" height="250" />
</div>
</div> </td>
</tr>
<tr>
<td height="${btm_Space0}" style="line-height:${btm_Space0}px;font-size:${btm_Space0}px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="SubHeadline Module" id="SubHeadline" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="inner_table" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; width:590px;border-collapse: collapse;border-spacing: 0;" border="0" width="590">
<tbody>
<tr>
<td height="${top_Space5}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${alignCenter1}" style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${SubheadlineFontSize}px; line-height: 130%; mso-line-height-rule: exactly; color: ${SubheadlineFontColor}; text-align: ${alignCenter1};">
<div class="mktoText" mktoname="SubHeadline" id="SubHeadline-text">
<span style="font-family: 'times new roman', times;">Brady Ware Updates</span>
<br />
</div> </td>
</tr>
<tr>
<td height="${btm_Space5}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="Divider Module-1" id="DividerModule3bbb6cb0-63a5-4122-b3c9-fb01db287c45" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="${DividerWidth}%">
<tbody>
<tr>
<td height="${top_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td class="center" bgcolor="${DividerBGColor}" height="${DividerHeight}" style="line-height:1px;font-size:1px; background-color: ${DividerBGColor};"> </td>
</tr>
<tr>
<td height="${btm_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="Article 1 Module" id="ArticleWHeadline" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="inner_table" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; width:590px;border-collapse: collapse;border-spacing: 0;" border="0" width="590">
<tbody>
<tr>
<td height="${top_Space20}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<th width="236" align="left" class="block center" valign="top" style="vertical-align: top;">
<div class="mktoImg" mktoname="Image [236x157]" id="leftImage" mktolockimgsize="true">
<div>
<img src="https://go.bradyware.com/rs/198-YAT-189/images/AdobeStock_361106603-1024x802.jpeg" width="236" border="0" style="-ms-interpolation-mode:bicubic; border-collapse:collapse; padding:0px; margin:0px auto; border-spacing:0; display:block;" />
</div>
</div> </th>
<th class="hidden" style="font-size:1px; line-height: 1px;" width="20"> </th>
<th align="left" class="block top_pad" valign="top" style="vertical-align: top;">
<table cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${headlineFontSize30}px; line-height: 130%; mso-line-height-rule: exactly; color: ${headlineFontColor}">
<div class="mktoText" mktoname="Headline" id="Headline-text">
<div>
<span style="font-family: 'times new roman', times;">Article Headline</span>
</div>
</div> </td>
</tr>
<tr>
<td height="${btm2_Space}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${FreeTextSize}px; line-height: 130%; mso-line-height-rule: exactly; color: ${FreeTextColor}
">
<div class="mktoText" mktoname="Text" id="SubHeadline-text-c">
<div>
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quas.
</div>
</div> </td>
</tr>
</tbody>
</table> </th>
</tr>
</tbody>
</table> </td>
</tr>
<tr>
<td height="${btm_Space20}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="SubHeadline Module-clone" id="SubHeadline248c1963-1d93-45f9-9579-5bda9f6e13ea" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="inner_table" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; width:590px;border-collapse: collapse;border-spacing: 0;" border="0" width="590">
<tbody>
<tr>
<td height="${top_Space5}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${alignCenter1}" style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${SubheadlineFontSize}px; line-height: 130%; mso-line-height-rule: exactly; color: ${SubheadlineFontColor}; text-align: ${alignCenter1};">
<div class="mktoText" mktoname="SubHeadline" id="SubHeadline-text198f3878-31b0-47a2-b0b0-a74fb64b8be6">
<div>
<span style="font-family: 'times new roman', times;">Subheadline Goes Here</span>
</div>
</div> </td>
</tr>
<tr>
<td height="${btm_Space5}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="Divider Module-1-clone" id="DividerModuledabaea0b-02d1-4d8c-8f3c-5e5ac10ee1c4" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="${DividerWidth}%">
<tbody>
<tr>
<td height="${top_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td class="center" bgcolor="${DividerBGColor}" height="${DividerHeight}" style="line-height:1px;font-size:1px; background-color: ${DividerBGColor};"> </td>
</tr>
<tr>
<td height="${btm_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="2-Col Article Module" id="twoColArticle" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="inner_table" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; width:590px;border-collapse: collapse;border-spacing: 0;" border="0" width="590">
<tbody>
<tr>
<td height="${top_Space20}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td>
<table cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<th width="285" align="left" class="block" valign="top" style="vertical-align: top;">
<table cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td class="center" align="left" valign="top" style="vertical-align: top;">
<div class="mktoImg" mktoname="Image [285x160]" id="leftImage-b" mktolockimgsize="true">
<div>
<img src="https://go.bradyware.com/rs/198-YAT-189/images/AdobeStock_513696474-388x219.jpeg" width="285" border="0" style="-ms-interpolation-mode:bicubic; border-collapse:collapse; padding:0px; margin:0px auto; border-spacing:0; display:block;" />
</div>
</div> </td>
</tr>
<tr>
<td height="15" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${headlineFontSize24}px; line-height: 130%; mso-line-height-rule: exactly; color: ${headlineFontColor}
">
<div class="mktoText" mktoname="Headline" id="Headline-text-b">
<div>
<span style="font-family: 'times new roman', times;">Article Headline</span>
</div>
</div> </td>
</tr>
<tr>
<td height="${btm2_Space}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${FreeTextSize}px; line-height: 130%; mso-line-height-rule: exactly; color: ${FreeTextColor}">
<div class="mktoText" mktoname="Text" id="SubHeadline-text-b">
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
</div> </td>
</tr>
<tr>
<td height="${btm3_Space}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td>
<div class="mktoText" id="CTA2-btn-bs" mktoname="CTA">
<div>
<table cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr>
<td bgcolor="${CTABGColor}" style="text-align: center;border:1px solid ${CTABorderColor}; color:${CTAColor}; background-color:${CTABGColor};text-decoration:none; font-size:${CTA1FontSize}px; line-height:110%; font-family: ${fontfamily},Arial, sans-serif; padding: 13px 20px; border-radius: ${CTABorderRadius}px;"> <a style="text-decoration:none; color:${CTAColor};" href="${CTAURL}?${url-parameter}">${CTAText}</a> </td>
</tr>
</tbody>
</table>
</div>
</div> </td>
</tr>
</tbody>
</table> </th>
<th class="hidden" style="font-size:1px; line-height: 1px;" width="20"> </th>
<th width="285" align="left" class="block top_pad" valign="top" style="vertical-align: top;">
<table cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td class="center" align="left" style="font-size: 1px; line-height: 1px;">
<div class="mktoImg" mktoname="Image [285x160]" id="leftImage-a" mktolockimgsize="true">
<div>
<img src="https://go.bradyware.com/rs/198-YAT-189/images/AdobeStock_510218937-388x219 %281%29.jpeg" width="285" border="0" style="-ms-interpolation-mode:bicubic; border-collapse:collapse; padding:0px; margin:0px auto; border-spacing:0; display:block;" />
</div>
</div> </td>
</tr>
<tr>
<td height="15" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${headlineFontSize24}px; line-height: 130%; mso-line-height-rule: exactly; color: ${headlineFontColor}
">
<div class="mktoText" mktoname="Headline" id="Headline-text-a">
<div>
<span style="font-family: 'times new roman', times;">Article Headline</span>
</div>
</div> </td>
</tr>
<tr>
<td height="${btm2_Space}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${FreeTextSize}px; line-height: 130%; mso-line-height-rule: exactly; color: ${FreeTextColor}">
<div class="mktoText" mktoname="Text" id="SubHeadline-text-a">
<div>
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.
</div>
</div> </td>
</tr>
<tr>
<td height="${btm3_Space}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td>
<div class="mktoText" id="CTA2-btn-as" mktoname="CTA">
<div>
<table cellpadding="0" cellspacing="0" border="0">
<tbody>
<tr>
<td bgcolor="${CTA2BGColor}" style="text-align: center;border:1px solid ${CTA2BorderColor}; color:${CTAColor}; background-color:${CTA2BGColor};text-decoration:none; font-size:${CTA2FontSize}px; line-height:110%; font-family: ${fontfamily},Arial, sans-serif; padding: 13px 20px; border-radius: ${CTA2BorderRadius}px;"> <a style="text-decoration:none; color:${CTA2Color};" href="${CTA2URL}?${url-parameter}">${CTA2Text}</a> </td>
</tr>
</tbody>
</table>
</div>
</div> </td>
</tr>
</tbody>
</table> </th>
</tr>
</tbody>
</table> </td>
</tr>
<tr>
<td height="${btm_Space20}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="Divider Module-2" id="DividerModule1037d552-2175-40b4-afc3-6261c9e3c04b" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="${DividerWidth}%">
<tbody>
<tr>
<td height="${top_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td class="center" bgcolor="${DividerBGColor}" height="${DividerHeight}" style="line-height:1px;font-size:1px; background-color: ${DividerBGColor};"> </td>
</tr>
<tr>
<td height="${btm_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="Free Text Module" id="FreeTextModule" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="inner_table" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; width:590px;border-collapse: collapse;border-spacing: 0;" border="0" width="590">
<tbody>
<tr>
<td height="${top_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td align="${alignCenter1}" style="font-family: ${fontfamily},Arial, sans-serif; font-size: ${FreeTextSize}px; line-height: 130%; mso-line-height-rule: exactly; color: ${FreeTextColor}; text-align: ${alignCenter1};">
<div class="mktoText" mktoname="Text" id="FreeText-textss">
<div style="text-align: center;">
<p style="text-align: center; line-height: 130%;"><span style="font-size: 10.5pt; line-height: 130%; font-family: 'times new roman, times',sans-serif; color: #333333;" mce-data-marked="1">About Brady Ware paragraph</span></p>
</div>
<div style="text-align: center;">
<span style="font-size: 14px; font-family: times new roman, times, serif; color: #222b34;"><span style="color: #333333;"></span></span>
</div>
</div> </td>
</tr>
<tr>
<td height="${btm_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="Divider Module" id="DividerModule" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; border-collapse: collapse;border-spacing: 0;" border="0" width="${DividerWidth}%">
<tbody>
<tr>
<td height="${top_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td class="center" bgcolor="${DividerBGColor}" height="${DividerHeight}" style="line-height:1px;font-size:1px; background-color: ${DividerBGColor};"> </td>
</tr>
<tr>
<td height="${btm_Space10}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
<table class="mktoModule" mktoname="Footer Module" id="FooterModule" cellpadding="0" align="center" cellspacing="0" style="margin:0 auto;width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td bgcolor="${banner2-bg-Color}" valign="top" style="background-Color:${banner2-bg-Color};vertical-align: top;">
<table class="inner_table" cellpadding="0" cellspacing="0" align="center" style="margin:0 auto; width:100%;border-collapse: collapse;border-spacing: 0;" border="0" width="100%">
<tbody>
<tr>
<td height="${top_Space30}" style="line-height:1px;font-size:1px;"> </td>
</tr>
<tr>
<td class="center" align="${alignCenter}" style="text-align: ${alignCenter}; font-family: ${fontfamily};">
<div class="mktoSnippet" id="FooterText" mktoname="Footer Text">
<table class="inner_table" style="margin: 0 auto; width: 590px; border-collapse: collapse; border-spacing: 0;" width="590" cellspacing="0" cellpadding="0" border="0" align="center">
<tbody>
<tr>
<td style="line-height: 1px; text-align: ${alignCenter};" align="${alignCenter}"><a href="https://bradyware.com/" target="_blank" title="Brady Ware & Company"><img src="https://go.bradyware.com/rs/198-YAT-189/images/BW%26C Logo_color_outlines web.png" alt="BW&C Logo_color_outlines web.png" height="127" width="459" style="display: block; margin-left: auto; margin-right: auto;" /></a></td>
</tr>
<tr>
<td style="line-height: 1px; text-align: ${alignCenter};" align="${alignCenter}"><br /></td>
</tr>
<tr>
<td style="line-height: 1px; text-align: Center;" align="Center"><a style="border: none;" target="_blank" border="0" href="https://www.facebook.com/bradywareCPAs?${url-parameter}"><img alt="Facebook" src="http://go.bradyware.com/rs/198-YAT-189/images/facebook-logo.png" imagepreview="false" constrain="true" width="30" height="30" border="0" /></a>   <img src="https://go.bradyware.com/rs/198-YAT-189/images/Twitter-Icon-2021.png" alt="Twitter-Icon-2021.png" height="30" width="30" />   <a style="border: none;" target="_blank" border="0" href="https://www.linkedin.com/company/brady-ware/?${url-parameter}"><img alt="LinkedIn" src="http://go.bradyware.com/rs/198-YAT-189/images/linkedin-logo.png" imagepreview="false" constrain="true" width="30" height="30" border="0" /></a>   <a style="border: none;" target="_blank" border="0" href="https://www.youtube.com/channel/UCZyvTi22Y89NsfCIpK3hMiQ?${url-parameter}"><img src="https://go.bradyware.com/rs/198-YAT-189/images/youtube-logo.png" alt="youtube-logo.png" height="30" width="30" /></a>   <a style="border: none;" target="_blank" border="0" href="https://www.instagram.com/bradywarecompany/?${url-parameter}"><img alt="Instagram" src="http://go.bradyware.com/rs/198-YAT-189/images/instagram-logo.png" imagepreview="false" constrain="true" width="30" height="30" border="0" /></a></td>
</tr>
<tr>
<td style="line-height: 1px; font-size: 1px;" height="15"> </td>
</tr>
<tr>
<td style="font-size: 12px; line-height: 130%; mso-line-height-rule: exactly; color: ${freetextcolor}; text-align: ${alignCenter};" align="${alignCenter}"> <p style="text-align: center;">© 2023 Brady Ware All rights reserved.<br />3601 Rigby Road, Suite 400, Miamisburg, Ohio 45342<br />937.223.5247 | <a style="color: #005695; text-decoration: none;" href="https://bradyware.com?${url-parameter}" target="_blank" border="0">www.bradyware.com</a><br /><br /><a style="color: #005695; text-decoration: none;" href="https://go.bradyware.com/UnsubscribePage.html" target="_blank" border="0">Unsubscribe</a><br /></p> </td>
</tr>
</tbody>
</table>
</div> </td>
</tr>
<tr>
<td height="${btm_Space35}" style="line-height:1px;font-size:1px;"> </td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table></td>
</tr>
</tbody>
</table> </td>
</tr>
</tbody>
</table>
</body>
</html>

Jasbirka

New Participant

Hi @bradyware,

I have troubleshooted your code, there are some hacks in the code, so you have to remove the below code -

Because of the above hacks, Arial font is working in the outlook clients.

Let me know if it will be helpful.

Thanks!

Jasbir

ChristianeRo1

Community Manager

Hi,

I have a few questions about how you're testing your email.

--What email client are you testing in? Are you testing in multiple clients and it's happening everywhere?

--If you're using a desktop app (as opposed to a browser-based client), have you verified that font is available in the client?

Just want to understand the basics before digging deeper.

bradywareAuthor

New Participant

The headers appear correct in web-based email platforms like Yahoo, Gmail, etc. But in MS Outlook, the desktop app, it will not display the headers as a serif font. And the font is Times New Roman, which shouldn't be an issue.

ChristianeRo1

Community Manager

It might be worth digging into your template to see if you have any MS Office/Outlook-specific styles that are preventing you from overriding the template font.

Sign up

Login with SSO

Login to the community

Login with SSO

Scanning file for viruses.

This file cannot be downloaded