Custom Fonts in Email Notification

[VCN]

Hi All,

I have a requirement from customer to use custom fonts mentioned below in Email Notifications but these fonts are not available in Service Now OOB.

Could you please suggest the way to use the below given custom fonts in Service Now email notifications?

Many Thanks in Advance!!!

Archer-Bold-Pro.otf

Archer-Book-Pro.otf

Archer-BookItal-Pro.otf

Archer-Medium-Pro.otf

Archer-MediumItal-Pro.otf

[Carl Fransen1]

Hi Venkatesh,

Sometimes the font doesn't show correctly inside the 'message HTML' itself but works when the email is actually sent - have you tested the sending of the email?

Could you put up a screen shot of your 'glide.ui.html.editor.v4.font.collection' configuration so I can see what you have added there?  Then I can try the same here to test if this works on my instance.

Also - could you try adding my example, the Montserrat to yours to confirm this works?

One other thign that might work is a /cache.do and a clearing of the browser cache, as I have found some things in cache and others required a browser refresh.

Let me know how you get on with this.

Cheers

Carl.

[Hulk]

For those who are new like me this is how you got to system properties. In filter Navigator type in sys_properties.list then search for 'glide.ui.html.editor.v4.font.collection'

[Peter Halsema]

For those who are struggling with the notifications and custom fonts.

We noticed that since Yokohoma, the custom font cannot be selected in the notifications anymore.

however changing the sys-property glide.ui.html.editor.v4.font.collection does not work for the notifications.

there is also a glide.ui.html.editor.v5.font.collection this also does not do the trick.

but when adding the font in the glide.ui.html.editor.font.collection property, it is selectable.

for which source the glide.ui.html.editor.v4.font.collection and glide.ui.html.editor.v5.font.collection is being used I don't know yet

[Brian Lancaster]

Did any of these replies work for you?

[vidhya_mouli]

We did this a bit differently. We uploaded the custom font to the sys_attachment table and included the following code in the email layout:

<style>
/* Load the custom font using @font-face */
@font-face {
    font-family: 'customFont';
    src: url('/sys_attachment.do?sys_id=ddd05190eb4e92108b0ef142345cd91') format('opentype'); /* Adjust the URL if needed */
    font-weight: normal;
    font-style: normal;
}

/* Apply the custom font */
body {
    font-family: 'customFont', Arial, sans-serif; /* Fallback to Arial if custom font is unavailable */
}

.container {
    font-family: 'customFont', Arial, sans-serif;
}

.main {
    font-family: 'customFont', Arial, sans-serif;
}

.footer {
    font-family: 'customFont', Arial, sans-serif;
}

.content p {
    font-family: 'customFont', Arial, sans-serif;
}
</style>