Posted on : 2018-10-17 11:56:02 View Type: public
Elena Momtcheva

Hello! I need to load the fonts locally. How do I do that?
Thanks in advance!
Hello! I need to load the fonts locally. How do I do that?
Thanks in advance!
This can be a little technical and require you to have basic knowledge of PHP and CSS. If you have then please follow the following steps.
Disable the auto fonts loading in theme so you can load fonts manually.
Edit file in your theme wp-content >> themes >> eyecare >> lib >> core-functions.php on line 160 find the following line and disable it. Or just simply remove it.
//setting up Google Font
wp_enqueue_style('google-fonts', esc_url($wc_font_url), array(), WC_VER, 'all');
Now theme will not load its fonts directly from google and you cannot change fonts through wp-admin >> appearance >> customize >> typography. Now things are manual.
Save your google font files in theme's directory
Save all font files in folder wp-content >> themes >> eyecare >> assets >> fonts once you have saved all files of fonts in this folder. You might have a CSS file like font awesome CSS file.
Just include that in core-functions.php file on same place where you removed previous font from. See how font-awesome file is included the same way you can include the new font files. A single CSS from google might be good option.
//Font Awesome
wp_enqueue_style( 'font-awesome', get_template_directory_uri().'/assets/css/font-awesome.min.css', array(), WC_VER, 'all');
Make sure your file location for CSS is assets/css/filename. change font-awesome.min.css with your css file name of font. and change name font-awesome in start of this line to your font name.
Time to change font family names in theme-styles.css
Edit file wp-content >> themes >> eyecare >> assets >> css >> theme-styles.css and find font-family: everywhere and change that with your font families names.
Make sure you did not earlier changed fonts in appearance >> customize >> typography if you did that font style is overriding your change. If you did that you would require to reset the option i will guide you later about if if you did that.
Thak you for your replay!
I don't wont to make the changes on the core file. I'm working with a child theme, and created the assets folder with fonts.css inside.
Can I reference the changes from the functions.php file in my child theme?
Create a new directory same name lib/ in child theme folder in which you can copy and paste core-functions.php file from main theme. Leave that file in main theme as that is and copy that in child theme. In child theme file you can make changes.
If a file exists in Child theme and in main theme as well. The child theme's file is given priority if child theme is active. So if you create a folder lib/ in which you place same file core-functions.php that will run instead of main theme's file.
Google fonts keep loading from https://fonts.gstatic.com.
I did everything that needs to be done in order to load files locally!
I copied all the files that I'm changing into my child theme folder, commented out the Font Awesome snippet, downloaded the fonts I need, referenced them into my style.css.......nothing.
I still see and can change the fonts from Customizer. What else needs to be done???????
Click one of our contacts below to chat on WhatsApp
Do you have any questions?