[Resolved] custom font

[Sander Bloem]

hi there!

is it possible to add a custom font like Lucia Calligraphy?

hope you can help me.

[Tom]

Hi there,

At this time only Google Fonts are supported in the Customizer.

However, you can always add your own fonts using @font-face: http://css-tricks.com/snippets/css/using-font-face/

Let me know if you have any questions 🙂

[Ivaylo Popov]

I found elegant solution for custom fonts, different from Google Fonts.

1. Install WordPress plugin, called “Use Any Font”.
2. Activate the plugin.
3. Go to settings page of the plugin and get API key from the developers. They offer free API for one custom font.
4. Add your API key.
5. Upload your custom font.
6. You are ready to use your custom font for headlines, paragraphs, block quotes or add your custom elements: example for only one page, post, etc.

I hope this will help you.

[Tom]

Thanks for the info! 🙂

[Markus]

@Ivaylo Popov

Works fine!
Thank you.
Saved me a lot of time.

[Jon Ander]

Hi there!
We´d like to install custom fonts manually using @fontface.
As we are using GP theme as it is, without using the child theme, where should we put the webfont directory so that it is not formatted when updating the theme?
hope you can help me
congrats for this amazing theme!

[Jon Ander]

On the other hand,
as far as I know, using the custom fonts plugin, you can use custom fonts without limit:
https://es.wordpress.org/plugins/custom-fonts/
I hope this will help

[Leo]

Hi Jon,

The @fontface method requires a child theme: https://docs.generatepress.com/article/adding-custom-font/

Plugin route is another solution as well.

[Jon Ander]

Hi Leo,
Thank you! Very clear.
Surely we´ll do with a child.
Thanks

[Leo]

No problem 🙂

[TheSalvadorDaliOfWebsites]

Dear support and fellow GP users,

Using plugin ‘Custom Fonts’ as linked to by Jon Ander previously in this thread I have installed two custom typefaces. They show up fine in Elementor (free) but they do not appear in GP’s list of fonts under Appearance > Customize > Typography > [any of the font dropdowns here].

Would be grateful if a user or support person could suggest reasons or an alternative way to use a .eot / .woff webfont without having to create a child theme or use custom CSS.

Best regards,
The Salvador Dali of Websites

[Tom]

To integrate that plugin with GP, you need to add this PHP: https://gist.github.com/generatepress/2bb2667c9413e29579288687add966de

[TheSalvadorDaliOfWebsites]

Hi Tom,
Thanks for your reply. I added the PHP-snippet using a plugin called ‘Snippets’.

The code snippet make my custom font show up in the GP font list (success), but the font itself is not applied to the site. It applies instead a font that looks a bit like Times New Roman.

Any further pointers are much appreciated.
The Salvador Dali of Websites

[Tom]

That sounds like the font isn’t being included on the front-end of your website, which is what the Custom Fonts plugin is supposed to do.

Any chance you can link me to the site? If you want the URL to the private, feel free to open a new topic.

[TheSalvadorDaliOfWebsites]

The site is under construction but I’ve made you an account you can use to login. Login details shared under a new topic.

BTW, the font files are purchased from a major outlet of webfonts so I they should be according to file format norms.

Thanks so much.

[Author]

Posts