[Support request] Adding new font to theme

[Katharina]

Hi I uploaded a new font in my File Manager https:///dieheilefrau.de/wp-content/themes/generatepress/fonts/Astel-Typeface.ttf

And I added following CSS

@font-face { 
font-family: Astel-Typeface; 
src: url(https:///dieheilefrau.de/wp-content/themes/generatepress/fonts/Astel-Typeface.ttf);       
    }
    
add_filter( 'generate_typography_default_fonts', function( $fonts ) {
    $fonts[] = 'Astel-Typeface';

    return $fonts;
} );

But I still don’t have this Font in my Topography. What do I miss?

Thanks for your help
Kati

[Elvin]

Hi,

Check our brief documentation on how to add local fonts to your site(and including it to customizer):
https://docs.generatepress.com/article/adding-local-fonts/

A wise man once said:
"Have you cleared your cache?"

[Katharina]

Hi Elvin, I tried it according to the guide but still no font in my customizer. I want to use this font for H4 but I can not find it in Topography. That’s the code I am using. What do I miss?

/* nanum-brush-script-regular - latin */
@font-face {
  font-family: 'Nanum Brush Script';
  font-style: normal;
  font-weight: 400;
  src: url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.svg#NanumBrushScript') format('svg'); /* Legacy iOS */
}

add_filter( 'generate_typography_default_fonts', function( $fonts ) {
    $fonts[] = 'Nanum Brush Scripts';

    return $fonts;
} );

Thanks
Kati

[David]

Hi there,

where did you add the two parts of the code to your site ?

This part is CSS:

/* nanum-brush-script-regular - latin */
@font-face {
  font-family: 'Nanum Brush Script';
  font-style: normal;
  font-weight: 400;
  src: url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('https://dieheilefrau.de/wp-content/themes/generatepress/fontsnanum-brush-script-v17-latin-regular.svg#NanumBrushScript') format('svg'); /* Legacy iOS */
}

and this is a PHP Snippet:

add_filter( 'generate_typography_default_fonts', function( $fonts ) {
    $fonts[] = 'Nanum Brush Scripts';

    return $fonts;
} );

https://docs.generatepress.com/article/adding-php/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Katharina]

I added the PHP in Snippet and Css in Simple CSS. Is there something else that could be wrong? Would it make difference where I upload the file to? I just created a font folder in generatepress because there was none.

Thanks
Kati

[David]

Are you using a Child Theme ?

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Katharina]

No, I don’t have a child theme. Would it make a difference? What is the better way to go? With or without?

[Elvin]

Hi,

I’m not exactly sure the URL within your CSS is the right path.

I see you’ve mentioned creating a font folder within /generatepress but I don’t see any indication of it in any of your URL’s path.

Can you recheck? Perhaps that’s the case.

Let us know.

A wise man once said:
"Have you cleared your cache?"

[Katharina]

Hi Elvin,
I noticed a mistake in my url, it’s fixed now.
that’s what I get if I open my link https://paste.pics/B7GD4 and I think the css should be right.

But still not working

Thanks
Andy

[David]

Firstly you shouldn’t make any changes to the Themes files or folders. These changes will be lost when the Theme updates.

First you need to install a child theme so the changes can be made safely. Read here:

https://docs.generatepress.com/article/using-child-theme/

Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/

[Author]

Posts