[Support request] Proper way to add Adobe Font

[Marco]

Hello
I’m using the latest version of GeneratePress and GeneratePress Premium with the new Typography System – what is the proper way to add an Adobe Font to the theme.

thank you in advance for your input.

[Elvin]

Hi Marco,

I assume you’re pertaining to Adobe typekit?

If so, Adobe typekit provides a <link> tag for the font’s importation stylesheet when you create a web project.

It’ll provide something like this <link rel="stylesheet" href="https://use.typekit.net/xxxxxxx.css">.

You can place this code on a Hook element and hook it to your wp_head with a display rule location of “Entire site”.

Once you’ve hooked it in, you can add it on the customizer option using this filter –

add_filter( 'generate_typography_default_fonts', function( $fonts ) {
    $fonts[] = 'Open Sans';

    return $fonts;
} );

Change Open Sans to the font-family: property value of your imported font based on its web project value. https://share.getcloudapp.com/6quvPY5X

[Pieter]

Hi!

Using this option and also from this topic: https://generatepress.com/forums/topic/adobe-fonts/
But nothing helps to get the font in the customizer.

Tried with child-theme, without child-theme and whit snippets plugin.
Could you have a look? Really need the font omnes-pro.

Site is https://tails.poiterdesign.eu/

Thank you in advance!

Gr. Pieter

[David]

Hi there,

if you’re using the new Typography then in the Font Manager,

1. add a new Font.
2. In the Font Family Name field simply type in the name of your Font.
3. Make sure the Google Font Toggle ( if displayed ) is not selected.

[Pieter]

Hi David,

Thanks for your fast reply!

Really didn’t know that! Thought the font will show up in the dropdown. But now I see it!

Looking and testing the whole day for this!

Thanks again!

Gr. Pieter

[David]

We need to update our docs to make this clearer.

Glad to be of help

[Vee]

Hello,
What prior steps are needed to make this ‘simply type it in’ method work? (ie Hook & Filter method described earlier in this thread, repeating for each font needed? or Mike Oliver’s tut? )

It would be great to be able to add access to my whole Adobefont web project, rather than individual fonts, as for example in this plugin: https://wordpress.org/plugins/custom-typekit-fonts/#description , which doesn’t work with GP.
Is there such a method anyone can share?
Thanks

[Elvin]

Hi Vee,

What prior steps are needed to make this ‘simply type it in’ method work? (ie Hook & Filter method described earlier in this thread, repeating for each font needed? or Mike Oliver’s tut? )

You can either manually download a copy of the font and locally host it on your site,

Or copy the <link> stylesheet Adobe Typekit provides and add hook it on wp_head.
https://helpx.adobe.com/fonts/using/add-fonts-website.html

[Author]

Posts