Choosing a Dirigible font

  • fonts
  • typography
  • dirigible-fonts
  • customizer
  • site-editing

Dirigible Fonts self-hosts typefaces from your server. Activate a family in the Fonts admin screen, then tell the theme where to use it under Styles → Fonts. For Google Fonts or Adobe Fonts outside the library, see Using Google or Adobe fonts.

Choose and activate a family

  1. In the WordPress admin, open Fonts (top-level menu with the paragraph icon).
  2. Use Search fonts... or the category filters (All, Sans Serif, Serif, Mono, Display, Handwriting) to find a face.
  3. Optionally adjust Preview Size and Preview Text in the sidebar so directory cards show readable sample text.
  4. Click Add to Site on the family you want.
  5. The family moves to Active Fonts at the top. Copy the Stack value on the card (for example, Inter, sans-serif).

Changes save automatically — you will see a brief confirmation after each edit. Families marked Requires License need a license with the font provider before you use them on a live site.

Tune weights and width (optional)

On an Active Fonts card:

  • Toggle weights and styles (normal, italic, bold, and combinations) so only the faces you need load.
  • Variable fonts may show a weight range instead of separate toggles.
  • When a variable family supports width, choose Full axis or One value, then adjust the slider or named instances. Use Reset to restore the family default.

Adding a font loads its files. Headings and body copy change only after you assign stacks in the Customizer.

Assign stacks in the Customizer

  1. Go to Appearance → Customize → Styles → Fonts.
  2. Paste each Stack into the matching field:
Field Typical use
Display Font Stack Large headings (H1–H3), hero titles
Body Font Stack Paragraphs, buttons, navigation, forms
Alternate Font Stack Smaller headings (H4–H6), tags, accent links
  1. Click Publish.

Keep a fallback (serif or sans-serif) at the end of each stack.

Optional performance toggles

Under Appearance → Customize → Settings → General:

  • Leave Font Preload on for faster first paint of active families.
  • Turn on Load Italic Early only if italic text flashes or arrives late.

These do not replace stack choices.

Tips

  • Removing a font with Remove Font stops loading it but does not clear Styles → Fonts — update those fields if the site still names that family.
  • After publishing, check a heading and a paragraph in the block editor — the editor should match the front end.
  • Set your palette first in Choosing colors and fonts, then assign stacks here.