- This topic has 4 replies, 2 voices, and was last updated 3 years, 3 months ago by
Ying.
-
AuthorPosts
-
January 30, 2023 at 1:41 pm #2514695
Thierry
Hi,
I’m using a custom font called Gilroy. This is not a Google Font!
I’ve followed your tutorial on how to upload custom fonts.Now, when i want to Add Font in Customizer, i can add the font. No problem.
Now i want to associate that font with Body Text. Gilroy font appears in “Font Family” drop down. Good.
I select it, but on my site (front-end) it shows a serif system font, not Gilroy.
All my other defined typography styles in Customizer are set to “inherit” and in the front end they DO show Gilroy correctly!
It’s just that my body text is not adapting to the font that i uploaded.I hope you can help. Thank you.
I can show you below what CSS code i added to the styles.css file of my gpchild theme:
/* gilroy-regular - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Gilroy'; font-style: normal; font-weight: 400; src: url('https://dez.leadway.be/wp-content/themes/generatepress_child/fonts/gilroy-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */ url('https://dez.leadway.be/wp-content/themes/generatepress_child/fonts/gilroy-latin-regular.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } /* gilroy-500 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Gilroy'; font-style: normal; font-weight: 500; src: url('https://dez.leadway.be/wp-content/themes/generatepress_child/fonts/gilroy-latin-500.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */ url('https://dez.leadway.be/wp-content/themes/generatepress_child/fonts/gilroy-latin-500.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } /* gilroy-600 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Gilroy'; font-style: normal; font-weight: 600; src: url('https://dez.leadway.be/wp-content/themes/generatepress_child/fonts/gilroy-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */ url('https://dez.leadway.be/wp-content/themes/generatepress_child/fonts/gilroy-latin-600.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */ } /* gilroy-800 - latin */ @font-face { font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */ font-family: 'Gilroy'; font-style: normal; font-weight: 800; src: url('https://dez.leadway.be/wp-content/themes/generatepress_child/fonts/gilroy-latin-800.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+ */ url('https://dez.leadway.be/wp-content/themes/generatepress_child/fonts/gilroy-latin-800.woff') format('woff'); /* Chrome 5+, Firefox 3.6+, IE 9+, Safari 5.1+ */ }January 30, 2023 at 2:05 pm #2514708Ying
StaffCustomer SupportHi Thierry,
I checked the URLs of the fonts, and the font-weight 400 font URLs return 404 errors.
So the elements that are set to font-weight 400 will not show the font correctly.
Can you check the URLs for font-weight 400 font?
January 30, 2023 at 2:09 pm #2514714Thierry
Typo indeed! My bad.
Thank you very much Ying.
Have a nice day.
ThierryJanuary 30, 2023 at 2:09 pm #2514715Thierry
Solved!
January 30, 2023 at 3:30 pm #2514761Ying
StaffCustomer SupportGlad to hear that 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.