Typography & Fonts
Fonts are managed in the built-in fonts library, which supports three sources:
- Google Fonts
- Adobe Fonts (Typekit)
- Custom fonts you upload
#Google Fonts
The theme ships with a local copy of the Google Fonts list, so you can pick a font without any API key. A key is only needed to fetch fonts Google released after the last theme update.
Open the fonts library
Go to Elisen DashboardFonts Library.
Add fonts
Press the Google button and pick what you need. Search, sort and filter work on the full list.
Apply the font
In AppearanceCustomizeTheme OptionsTypography, set it as the heading or text font.
The font is live on the site. If it does not change, clear your caching plugin.
#If you want the newest fonts, add an API key
A Google API key by itself is not enough. The key needs the font service enabled on it, and this is the step that empties the font list when it is missed.
Create the key
Follow Google guide to creating an API key.
Enable the Web Fonts Developer API on it
In the Google API Console, open Library, search for Web Fonts Developer API, and enable it for the project the key belongs to.
Add the key and regenerate
Paste the key in Elisen DashboardFonts Library and press Regenerate Google Fonts.
An invalid key replaces the local font list with an empty one on save. If the list goes empty, clear the key field and turn off Cache requests to bring the local list back.
#Adobe Fonts
Adobe Fonts needs a token and an active Adobe subscription for paid families. Generate a token on your Adobe API tokens page, paste it into the fonts library, then press the Typekit button to pick from your kits.
#Custom fonts
Press the Custom button and add one variation per weight and style you need. Each variation takes a name, a weight, a style, a display value, and the font file.
Upload every weight you plan to use. A missing weight makes the browser synthesize it, which is why a custom font sometimes looks heavier or more slanted than expected.
If Elementor overrides your choice, turn off its default fonts as described in the Elementor settings article.
Last updated
Was this article helpful?
Resources
On this page
