Forum Discussion

kandulmadhu's avatar
kandulmadhu
Advisor
10 years ago

Using custom fonts in email templates

Hi, Is it possible to use custom fonts in email templates? If yes, how to use them? Also, is there any list of standard fonts that we can directly use in email templates?   Your help will be real...
VarunGrazitti's avatar
VarunGrazitti
Boss
We have added custom CSS to the email templates, you could try adding fonts.
kandulmadhu's avatar
kandulmadhu
Advisor
10 years ago

Hi Grazitti,

Thanks for your help.

I have tried including custom fonts in email templates but it was unsuccessful. Have you tried using them successfully?

 

The following is the code snippet i have added in my email template:

 

<style>

@font-face {
font-family: 'FrutigerNext-Regular';
src: url("${webUi.toStaticAssetUrl('/html/assets/FrutigerNext-Regular.eot')}"); /* IE9 Compat Modes */
src: url("${webUi.toStaticAssetUrl('/html/assets/FrutigerNext-Regular.woff')}") format('woff'), /* Modern Browsers */
url("${webUi.toStaticAssetUrl('/html/assets/FrutigerNext-Regular.ttf')}") format('truetype'), /* Safari, Android, iOS */
url("${webUi.toStaticAssetUrl('/html/assets/FrutigerNext-Regular.svg')}") format('svg'); /* Legacy iOS */
}

</style>

 

This font is not getting applied in my Outlook client though.

Can you send me the correct syntax for this?

Thanx in advance,

Madhu

    • kandulmadhu's avatar
      kandulmadhu
      Advisor
      10 years ago

      Hey Grazitti,

      I didn't find anything specific to Custom fonts there but thanx for the link.

       

      Regards,

      Madhu

      • bhupen's avatar
        bhupen
        Advisor
        10 years ago

        Hi kandulmadhu  Iam not sure whether its correct way or not but yes we can apply custom font on specific email template using style tag. following is the example: you can achive this by using style tag.

        <head>
                <title>${notification.message.author.login} mentioned you in ${community.title}</title>
                <style type="text/css">
                    body, td { font: 10pt Arial, Helvetica; }
                    .post-body p { margin:0; }
                </style>
            </head>