Elementor
Your fonts appear in a Custom group at the top of Elementor’s font picker. It works with free Elementor; Elementor Pro isn’t needed.
Use a font#
- Edit a page with Elementor and select a widget, such as a Heading.
- Go to Style → Typography and open the edit icon.
- In Family, scroll to the top or type the font’s name. Your fonts are in the Custom group.
For site-wide fonts, open Site Settings → Global Fonts (or Typography) and choose your fonts there.
Your fonts preview in the editor, as the stylesheet loads in both the editor panel and the preview.
Google Fonts switch#
With Stop page builders loading Google Fonts on (the default), Elementor’s own Google Fonts setting is treated as off. Google fonts leave the picker, and neither the editor nor your site loads them.
Your saved Elementor setting isn’t changed. Turn our switch off, and Elementor goes back to whatever you had set.
Widgets that already use a Google font keep its name. Add that family in Nahnu Fonts to serve it from your site.
Good to know#
- Both Elementor font pickers are supported: the classic Typography control and the newer one used by atomic elements.
- Elementor Pro’s own Custom Fonts keep working alongside Nahnu Fonts. Use one or the other for each family, not both.
- On older Elementor versions without the Google Fonts setting, Google Fonts simply aren’t printed.
- If a font doesn’t show after you add it, reload the editor. Clearing Elementor → Tools → Regenerate CSS & Data can help with old cached styles.
Turn it off#
Settings → Where fonts appear → Use with Elementor.
Checked against Elementor’s developer documentation and source.