A font family is essentially an instruction (to websites and email clients) about which font is to be used when rendering content. The "family" is a group of similar fonts and, the order in which the fonts are listed is the order in which they are to be used.
In the case of the font family being "Bookman, Georgia, Times, Times New Roman, serif" websites and email clients are being instructed to display the content in the Bookman font. If Bookman isn't available on the device, then use Georgia, and so on through the provided list.
By designating a font family, you are maintaining some control over how your content displays. This can be important, for example, if you want to present your organization's "brand" in a preferred way to your audience.
NOTE: Font families typically include at least two fonts and a generic font (such as serif, sans-serif, monospace).
Font families in Template Designer 2
Template Designer 2 (TD2) gives you the ability to:
- create custom font families and
- designate a font family to be used in a message.
A custom font family is the perfect (and easiest) way to apply your organization's preferred "style" and "branding" to your messaging. If you plan to use a custom font family, review the information below.
Fonts and font families considerations
Below is some useful information about this feature that you should review before starting.
NOTE: If you do plan to create a custom font family, you should consider using web-safe fonts.
- The default font family for TD2 is Arial, Helvetica, sans-serif.
- If you create and apply a custom font family and then delete it, the template automatically uses the default.
- If you apply a custom font family to a text style in a template, the Use custom font-family box must remain checked. If it gets unchecked, the custom font family is automatically deleted from the template (and will have to be re-created and re-applied to the style).
- You can create only one custom font family per template.
- Custom font families are unique to the template in which they are created. A custom font family that is created for Template-A won't be available in the Theme > Font Family dropdown of Template-B or Template-C; the custom font family has to be re-created in those templates in order to be available.
- A custom font family will be copied with its template. If you copy Template-A and name the copy Template-B, the custom font family will be available in Template-B.
- A custom font family will be copied when you copy a mailing and when you copy mailings between parent and child accounts.
- You cannot create a custom font family in Layout Editor when creating a Custom Layout.
Font names and visibility
- You can add any font as the Primary and Secondary fonts of a custom font family. However, in order to be able to view a font, it must be installed on the device you're using. Font names:
- can be any "case" (lowercase, uppercase, mixed case); "arial," "ARIAL," and "Arial" are equally valid.
- cannot start with a numeral, two hyphens, or a hyphen followed by a numeral.
- Some fonts will be viewable in the Design tab, but not in the Review & Activate tab.
- Custom font families might not display properly when you use the Virtual Inbox Test.
- If your primary and/or secondary fonts are not web-safe fonts, the test might not render the fonts correctly and will instead use the default font set.
As with the Virtual Inbox Test, if a recipient's device or email client does not have your primary or secondary fonts installed, those fonts will not render when the recipient views the message, and the default will be used.
This is why Higher Logic recommends that, as a best practice (and to mitigate rendering issues and complaints), you either:
- use one of the families that are preloaded in the Font Family dropdown or
- ensure that your custom fonts are known "web-safe" fonts.
Create a custom font family
You can create a custom font family during two activities:
- while creating a template (as in the following exercise) and
- while editing an existing template.
To create a custom font family:
- Navigate to Messages > Templates.
- Click the plus sign icon to the right of the page title to create a new template.
- In the Design tab, open the Theme menu.
- Click the Element dropdown and select text.
The Font Family dropdown displays the default: Arial, Helvetica, sans-serif, which is used unless a different "family" is selected.
- Check the Use custom font-family box.
- In the Custom Font-Family dialog:
-
- specify the name of a known font as the Primary Font (required),
- specify the name of a known font as the Secondary Font (optional; recommended),
- click the dropdown and select a Generic Font (required), and
- click Save.
NOTE: An error message displays for invalid Primary and Secondary Font names and if a Generic Font isn't selected.
Your new custom font family is available in the Font Family list.
Use your custom font family
You can use your custom font family for all of the text styles (Headings, Sub-Headings, and Standard Texts) as long as the Use custom font-family box remains checked.
IMPORTANT: If that box gets unchecked, all of the text styles to which it has been applied revert to using the default font, and the custom font family is deleted and will have to be re-created.
To use your custom font family for a text style:
- Select a style (e.g., Heading 3).
- Click the Font Family dropdown.
- Click to select your custom font family.
The sample of the style (Heading 3) automatically updates to reflect your custom font.
- You have to do this, individually, for each style that you want to use your custom font family.