Archived topic
custom font in the Customizer
3 replies · Started by andreas on August 2, 2020
Hello I was wondering if you can help me to bring a custom font in the Customizer.
Step by step i'm new to programming and Wordpress.
But i can use bitvise ssh client so connect to my server
Hi there,
Can you try following the steps here first?
https://docs.generatepress.com/article/adding-local-fonts/
Let me know :)
Thanks i saw that but i'm struggling with the steps.
I would like to use this one
Hi there,
Try the steps:
1. Use the Font Squirrel generator to create you web fonts and @font-face CSS:
https://www.fontsquirrel.com/tools/webfont-generator
The Optimal option should be fine.
2. Open the ZIP it creates you will need the .woff, .woff2 and .css file.
3. Add a Child Theme to your site:
https://docs.generatepress.com/article/using-child-theme/
You will need to access your Child Theme folder via FTP or File Edtior on your server.
4. In your child theme create a Folder named Fonts and within add the .woff and .woff2 files.
Make a note of the URLs for these fonts it will be something like this:
https://my-website.com/wp-content/themes/generatepress_child/fonts/my-font.woff2
5. Copy the CSS file from step 2 into your child theme styles.css file and update the 2 x URLs.
6. Edit your child themes functions.php and add this function:
add_filter( 'generate_typography_default_fonts', function( $fonts ) {
$fonts[] = 'my-font-name';
return $fonts;
} );
Change the my-font-name to the font-family name in your @font-face CSS ( step 5 ).