Hi everyone,
I'm an email developer looking to update my org's email stationery and I'm having trouble getting our custom font, Alternate Gothic No 2 D to show in Outlook email tests and in Internet Explorer. The fonts work fine in Gmail. Here's a snippet of the test code I'm using. Any suggestions help! Thanks.
<html>
<head>
<!-- <link href="https://use.typekit.net/pnw5vpv.css" rel='stylesheet' type='text/css'>-->
<!-- <!–[if gte mso 9]>-->
<style type="text/css">
@Import url("https://use.typekit.net/pnw5vpv.css");@charset "UTF-8";
h1,h2,h3,h4,h5,h6,p,a,span,td,strong{font-family: 'Alternate Gothic No2 D', sans-serif !important;}
@Font-face {
font-family: 'Alternate Gothic No2 D';
src: url(/wp-content/themes/coa-2020/dist/fonts/AlternateGotNo2D.eot?ver=d9d465b5);
src: local("0"), url(/wp-content/themes/coa-2020/dist/fonts/AlternateGotNo2D.otf?ver=f241b798) format("opentype"), url(/wp-content/themes/coa-2020/dist/fonts/AlternateGotNo2D.woff?ver=8699ed57) format("woff"), url(/wp-content/themes/coa-2020/dist/fonts/AlternateGotNo2D.ttf?ver=9d92c9d2) format("truetype"), url(/wp-content/themes/coa-2020/dist/fonts/AlternateGotNo2D.svg?ver=43043bf5#AlternateGotNo2D) format("svg");
font-weight: normal; }
.tk-alternate-gothic-no-2-d { font-family: 'Alternate Gothic No2 D',sans-serif; }
@Font-face {
font-family: 'Museo Sans 500';
src: url(/wp-content/themes/coa-2020/dist/fonts/MuseoSans500.eot?ver=0f800c60);
src: local("0"), url(/wp-content/themes/coa-2020/dist/fonts/MuseoSans500.otf?ver=62c01351) format("opentype"), url(/wp-content/themes/coa-2020/dist/fonts/MuseoSans500.woff?ver=3bf1b226) format("woff"), url(/wp-content/themes/coa-2020/dist/fonts/MuseoSans500.ttf?ver=d290eb55) format("truetype"), url(/wp-content/themes/coa-2020/dist/fonts/MuseoSans500.svg?ver=6ffed804#MuseoSans500) format("svg");
font-weight: 500; }
</style>
</head>
<body>
<table>
<tr>
<td style="font-family: 'Alternate Gothic No2 D', Helvetica, Arial, sans-serif; font-size: 20px;">
This should be Alternate Gothic No 2 D.
</td>
</tr>
</table>
<table>
<tr>
<td style="font-family: 'Alternate Gothic No2 D', Helvetica, Arial, sans-serif; font-size: 20px;">
Outlook will display Alternate Gothic No2 if it's working correctly. Others will display Helvetica or Indie Flower.
</td>
</tr>
</table>
<table>
<tr>
<td style="font-family: Helvetica, Arial, sans-serif; font-size: 20px;">
<span style="font-family: 'Indie Flower', Helvetica, Arial, sans-serif !important;">
Outlook will display Helvetica, others will display Indie Flower.
</span>
</td>
</tr>
</table>
</body>
</html>
AdChoices