Archived topic

Local Font

7 replies · Started by Heidi on February 7, 2019

Viewing posts 1–8 of 8

February 7, 2019 at 9:36 am #804236

Hi All,

I'm can't get the local font to load and am not sure what I'm doing wrong. I've cleared my cache.

I've got the font files loaded via FTP to a FONTS folder in my child theme.

I've added this CSS--with my real domain https://domain.org in place of the ../

@font-face {
  font-family: 'PitchSans';
  src: url('../wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.eot');
  src: url('../wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.eot?#iefix') format('embedded-opentype'), 
       url('../wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.woff2') format('woff2'), 
       url('../wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.woff') format('woff');
  font-style: normal;
	font-weight:400;
}

.FontFamily {
  font-family: 'PitchSans';
}

And I have this in the functions.php for the child theme:

add_filter( 'generate_typography_default_fonts', 'tu_add_local_fonts' );
function tu_add_local_fonts( $fonts ) {
    $fonts[] = 'PitchSans';
    return $fonts;
}

I can see the font in the Customizer > Typography and when I choose it, it loads some other font. What am I missing? Thanks for any help.

February 7, 2019 at 5:12 pm #804529

Hi there,

I'm seeing ../ in your code instead of the full domain in "Customize > Additional CSS".

Can you confirm that you're using the full domain in place of ../?

February 8, 2019 at 8:44 am #805174

Yes, here is the actual code I am using:

@font-face {
  font-family: 'PitchSans';
  src: url('https://couchfilmcollective.org/wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.eot');
  src: url('https://couchfilmcollective.org/wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.eot?#iefix') format('embedded-opentype'), 
       url('https://couchfilmcollective.org/wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.woff2') format('woff2'), 
       url('https://couchfilmcollective.org/wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.woff') format('woff');
  font-style: normal;
	font-weight:400;
}

.FontFamily {
  font-family: 'PitchSans';
}

February 8, 2019 at 9:54 am #805265

Looks good now.

So which element have you applied the PitchSans font to? Have you selected it for any element in the Customizer?

February 8, 2019 at 5:13 pm #805468

I have it on H1 now. It just looks like it's pulling some other font as this is Pitch Sans.

February 8, 2019 at 5:25 pm #805480

When I try to access one of the font files, I'm getting a 403 error: https://YOUR-WEBSITE-URL/wp-content/themes/generatepress_child/fonts/PitchSansWeb-Bold.woff2

This is usually server related. If you report this to your hosting, they should be able to fix it.

February 8, 2019 at 7:42 pm #805525

Ah ha! Okay, I'll see if I can't get them to fix that. Thanks so much for your help!

February 9, 2019 at 8:59 am #805999

No problem :)

This archived topic is closed to new replies.

Start building better websites today.