Adding new font to theme

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/

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

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/

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

Are you using a Child Theme ?

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

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.

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

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/