Getting started

Fonts

Add the fonts your brand uses, from Google Fonts or from your own address, and XFORG loads them on every page of your site.

How fonts work

A font in XFORG is a stylesheet address. Each active font on the Custom Fonts screen is loaded on every page of your site, which makes its font family available to your CSS.

Loading a font does not apply it anywhere by itself. You choose where it is used with CSS, as shown below.

Add a font

1

Open Custom Fonts

In your admin panel, go to Pages and Menus and choose Custom Fonts.

2

Click Add Font

The Create new font window opens.

3

Fill in the fields

Name is your own label for the font. For Source Type choose Google Fonts or Custom URL. In Font URL paste the address of the font's stylesheet.

4

Click Create new font

The font is added to the list and loads on your pages while its status is active.

For Google Fonts, the address to paste is the stylesheet link Google gives you when you select a font family, not the address of the font's page.

Use the font on your site

To use a font across the whole site, go to Pages and Menus, open Custom CSS, and set the font family on the parts you want, such as the body text or the headings. Use the family name exactly as the font provider spells it.

To use it on one element only, open that element in the page builder, go to its CSS section and write the font-family declaration in the Custom CSS field.

The Font Family menu in an element's typography settings offers generic families only: Inherit, Serif, Sans Serif, Monospace, Cursive and Fantasy. Custom fonts are applied with CSS.

Manage your fonts

Use Edit in a font's row menu to change its name, source or address. Change its status, or select several rows and use Activate or Deactivate, to stop loading a font without deleting it.

Every active font is a file each visitor downloads. Keep only the fonts you use, and deactivate the rest.