User Icon > Settings
The Brand Tab of the Settings Page contains global settings to help ensure brand consistency across your marketing campaigns. There are two sections on the Brand Tab: Preferred Fonts and Custom Colors.
For changes made on this page, be sure to click "Save" in the top right corner before leaving the page!
Preferred Fonts
The Preferred Fonts section of the Brand tab allows you to:
- Limit fonts available in the Email Builder & Landing Page Builder to the fonts you regularly use.
- Declare additional custom web fonts to be used in your marketing material.
By default, the setting for Preferred Fonts on this page is set to Use all Default Fonts. This means that the full list of fonts, listed below, will be available to you in the Email & Landing Page Editors.
Here's all the fonts that are available out-of-the-box:
- Arial
- Courier
- Georgia
- Helvetica Neue
- Lucida Sans
- Tahoma
- Times New Roman
- Trebuchet MS
- Verdana
- ヒラギノ角ゴ Pro W3 (Hiragino Kaku Gothic Pro W3)
- メイリオ (Meiryo)
- Bitter
- Droid Serif
- Lato
- Open Sans
- Roboto
- Source Sans Pro
- Montserrat
- Ubuntu
If you'd like to limit this list of fonts or import other fonts from the web, change the selection in the drop-down to Use Preferred & Custom Fonts. Upon changing this selection, you'll be able to click the tiles for the fonts you plan to use in the Editors. Additionally, clicking the Add Custom tile at the end of the list will allow you to pull a public web font into Ascent360.
The selected fonts here will be the only fonts that appear in the Email & Landing Page Editors. Emails or Landing Pages that are already saved with other fonts will be unaffected.
Add a Custom Font
You may add custom web fonts by clicking the Add Custom tile at the end of the list.
- Name the font - this is the name that will be shown in the font drop-down in the Editor. We recommend inputting the true font name here, but you are free to name it something else. For example, you may choose to name it semantically to indicate usage (Rubik - Body Text).
- Provide a Font URL - Provide the URL of the font for Ascent360 to reference. The URL needs to point to a CSS file with @font-face properties (see examples below).
- Declare a Fallback Font - Choose a font from the list of default fonts to serve as the fallback font in the event that the custom font is unavailable.
- Declare a Fallback Font Family - Choose a font family from the list to serve as the secondary fallback in the event that neither the custom font nor the primary fallback font can be rendered.
Provide the Web Font URL
It's important to provide the right web font URL when adding the custom font; if the URL is wrong, Ascent360 won't be able to load your custom font. In order to be valid, the font URL must fulfill these criteria:
- The URL needs to point to a CSS file with @font-face properties.
- The CSS needs to be hosted in HTTPS.
To test this, enter your font URL into your browser - it should load with a page with plain text (the CSS file for this font). Look for these elements:
Example: https://fontlibrary.org/en/face/nemoy
Where do I get web fonts?
We recommend browsing for web fonts from the following libraries:
Here's an example for finding the URL for the Rubik font from Google Fonts: https://fonts.google.com/specimen/Rubik
- Click Get Font
- On the resulting page, click Get Embed Code
- On the resulting page, click the @Import option
- Copy the link contained in the URL parameter. Only the family URL parameter is needed, as shown highlighted below.
At this time, only font weights 400 (normal) and 700 (bold) are supported for Custom Fonts. Licensed fonts where the @font-face properties are not publicly available are not supported.
Brand Colors
The Brand Colors section of the Brand tab allows you to define up to 10 hex colors for quick access within the Email Editor and Landing Page builder.
You may type the color or click the swatch to select from a color picker.
Colors designated here will be shown in any of the color pickers within the editors for quick access.