Archived topic
Local Font Issue
7 replies · Started by Math on July 27, 2020
Hi,
I uploaded a local font to the 'fonts' directory within the child theme, but I can't seem to call it. Can you please take a look to see what I'm doing wrong?
@font-face {
font-family: 'Jakarta Display';
src: url('fonts/PlusJakartaDisplay-Bold.woff2') format('woff2'),
url('fonts/PlusJakartaDisplay-Bold.woff') format('woff');
font-weight: normal;
font-style: normal;
}h1 {
font-family: 'Jakarta Display';
}Hi there,
try adding the full URL path in your @font-face URLS.
I put in the full link and still the same issue. Also, I have another issue... I'm using Inter UI font for the body, and it seems to be working fine for Chrome but Firefox won't read it.
@font-face {
font-family: 'Jakarta Display';
src: url('https://tomm.co/wp-content/themes/generatepress_child/fonts/PlusJakartaDisplay-Bold.woff2') format('woff2'),
url('https://tomm.co/wp-content/themes/generatepress_child/fonts/PlusJakartaDisplay-Bold.woff') format('woff');
font-weight: normal;
font-style: normal;
}Can you temporarily place that CSS in the Customizer > Additional CSS
That seems to have fixed it. Is there a reason I can't use the child theme css instead?
When I tried copying everything from the customizer back to the child theme style.css, it stopped working again.
Remove this from your stylesheet:
@import url('../generatepress/style.css');
It isn't necessary and is breaking your child styles
Thank you! That fixed it.
Glad to hear that
