The best way to add a custom font depends on your WordPress version and who should manage typography. On WordPress installations with the Font Library, editors can upload .ttf, .otf, .woff or .woff2 files from Appearance > Fonts. Theme developers can bundle font files and register them in theme.json. A plugin is mainly useful when your installation lacks the required native workflow or needs a specialized conversion feature.
Choose the right WordPress font method
| Method | Best for | What you need to know |
|---|---|---|
| Font Library | Site owners and editors | Current WordPress documentation says it is available for block and classic themes starting with WordPress 7.0. Fonts are managed from the dashboard. |
theme.json |
Theme authors and developers | Font files ship with the theme and are registered as typography presets and generated @font-face rules. |
| Custom-font plugin | Sites needing a workflow core or the theme does not provide | Features, conversion services and compatibility vary by plugin and must be checked against the installed WordPress version. |
Check Dashboard > Updates for the installed WordPress version before looking for the Font Library menu. Older releases may not show the same interface.
Method 1: Add a font with the WordPress Font Library
The WordPress.org Font Library documentation describes this feature as a way to upload font files, install fonts from Google Fonts and manage the fonts available on a site.
Upload a font file
- In the WordPress dashboard, open Appearance > Fonts.
- Open the Upload tab.
- Select the font file from your computer. The documented formats are
.ttf,.otf,.woffand.woff2. - Complete the upload and confirm that the font appears in the Font Library.
- Open the typography controls provided by your active theme or block editor and select the new family for the text, heading or block style you want to change.
Upload only a font whose license permits website use and distribution. A desktop-use license does not automatically grant web-font rights.
Recommended Free Tools
#1 Best Overall
Install a font from Google Fonts
- Go to Appearance > Fonts and choose Install Fonts.
- Choose a family and select only the weights and styles your design needs.
- Approve the connection step shown by WordPress, then install the selection.
- Apply the installed family through the available typography controls.
According to WordPress documentation, this workflow downloads the selected Google Font files and hosts them on your site instead of loading them directly from Google. That describes the documented hosting behavior; your site’s privacy, caching and legal obligations still depend on its configuration and the font license.
Apply and verify the font
Registered fonts appear in typography controls for supported blocks and styles, but themes do not expose identical controls everywhere. After selecting a family, preview the editor and open a public page in a logged-out browser. Check headings, body text, menus and any components that use separate theme styles.
Rank #2
Method 2: Bundle a font in a theme with theme.json
Use this route when you maintain a theme and want the font to travel with it. WordPress documents theme.json for block and classic themes; its settings and styles affect the front end and built-in editors.
Prepare the files
- Place the web-font files inside the theme, such as
assets/fonts/. - Prefer WOFF2 where available; register every weight and style that the design actually uses.
- Use the real family name, weight, style and stretch descriptors supplied by the font.
Add a font family
Add a family object under settings.typography.fontFamilies in the active theme’s theme.json. The required family fields are name, slug and fontFamily. A semantic slug such as primary remains useful if the underlying typeface changes later.
Rank #3
- Used Book in Good Condition
{
"version": 3,
"settings": {
"typography": {
"fontFamilies": [
{
"name": "Example Sans",
"slug": "primary",
"fontFamily": "'Example Sans', sans-serif",
"fontFace": [
{
"fontFamily": "Example Sans",
"fontWeight": "400",
"fontStyle": "normal",
"fontStretch": "normal",
"src": ["file:./assets/fonts/example-sans-regular.woff2"]
},
{
"fontFamily": "Example Sans",
"fontWeight": "700",
"fontStyle": "normal",
"fontStretch": "normal",
"src": ["file:./assets/fonts/example-sans-bold.woff2"]
}
]
}
]
}
}
}The file:./... source is relative to theme.json. WordPress maps each fontFace entry to an @font-face declaration and creates a CSS custom property for the typography preset. The documented fields include fontFamily, fontWeight, fontStyle, fontStretch and src; at least one source file is required.
Use the registered family
Enable the relevant typography settings and choose the preset in supported block controls, or assign the generated preset in your theme styles. A family registered in theme.json is not guaranteed to appear in every theme component or third-party block.
Rank #4
Understand loading behavior
WordPress’s WP_Font_Face reference documents a default font-display value of fallback for generated font-face styles. Register only the files and variants the design needs; adding every available weight increases downloads without guaranteeing a visual or performance benefit.
When a plugin makes sense
A plugin can help when the installed WordPress version lacks the Font Library, when a theme does not expose usable typography controls, or when you need a plugin-specific upload or conversion process. For example, the WordPress.org listing for Use Any Font | Custom Font Uploader describes custom-font installation and a conversion API supporting formats such as WOFF and WOFF2.
Free tools Windows power users keep installed
One-click scans. No signup required.
That listing is not evidence that the plugin is required or compatible with every site. Before installing, check its current tested WordPress version, update history, permissions, external-service terms and whether it duplicates functionality already available in core or your theme.
Quick Recap
Troubleshoot a font that does not appear
- No Fonts menu: confirm the WordPress version and active theme. The current documentation places the interface at Appearance > Fonts and states availability starting with WordPress 7.0.
- Upload rejected: verify the file extension is
.ttf,.otf,.woffor.woff2, and confirm that your account and the font license permit use and distribution. - Family missing from controls: confirm it appears in the Font Library or is registered in the active theme’s
theme.json. The theme must expose typography controls for the block or component you are editing. - Wrong weight or italic: check that each
fontFaceentry’s family, weight, style, stretch and source path match the actual file. A mismatch can cause browser fallback. - Editor looks right but the site does not: inspect the public page, clear site and browser caches, and verify that the active theme and deployed theme files are the same ones you edited.
- Plugin workflow fails: review the plugin’s current directory listing for compatibility with your WordPress version and required conversion or upload service.
Practical decision guide
- Use the Font Library when an editor needs to manage fonts from the dashboard and the installation meets the documented WordPress-version requirement.
- Use
theme.jsonwhen the typeface is part of a theme package, must be reproducible across installations, or needs developer-controlled weights and styles. - Use a plugin only when its specific capability solves a limitation that the native routes and active theme do not.
Product prices and availability are accurate as of the date/time indicated and are subject to change. Any price and availability information displayed on Amazon at the time of purchase will apply.
