Archived topic
Custom Fonts
5 replies · Started by Stephen on May 1, 2018
Hi,
I've been following this guide:
https://docs.generatepress.com/article/adding-custom-font/
Font files are uploaded to my child theme folder and I intend to use the code below. I think its good to go, but not sure about the line in bold?
@font-face {
font-family: 'DinRegular';
src: url('https://www.domain.com/wp-content/themes/generatepress_child/fonts/din_regular-webfont.woff2') format('woff2'), /* Super Modern Browsers */
url('https://www.domain.com/wp-content/themes/generatepress_child/fonts/din_regular-webfont.woff') format('woff'); /* Pretty Modern Browsers */
}
@font-face {
font-family: 'DinBold';
src: url('https://www.domain.com/wp-content/themes/generatepress_child/fonts/din_bold-webfont.woff2') format('woff2'), /* Super Modern Browsers */
url('https://www.domain.com/wp-content/themes/generatepress_child/fonts/din_bold-webfont.woff') format('woff'); /* Pretty Modern Browsers */
url('https://www.domain.com/wp-content/themes/generatepress_child/fonts/din_bold-webfont.ttf') format('truetype'), /* Safari, Android, iOS */
}
Also, what is the best way to add the CSS to my child theme stylesheet please? I'm not a coder. Should I use Customiser - Additional CSS or can I do it in WP?
Thanks
Steve
Hi there,
Sorry for not getting back to you sooner!
What about that line aren't you sure about?
Since you're using a child theme anyways, you can add it in the style.css file within your child theme.
Hi Tom,
I'm just not sure if the bold text is needed anymore? Most web font sites that I found only convert to woff and woff2. Is .ttf needed?
Thanks
Steve
That totally depends on what kind of browser support you need. You're likely right that it isn't needed, unless you need to support older versions of IE.
Thanks Tom.
No problem :)