- Web templates
- E-commerce Templates
- CMS & Blog Templates
- Facebook Templates
- Website Builders
WordPress. How to add Google WEB font
May 14, 2014
This tutorial shows how to add a Google WEB font to a WordPress template based on Cherry Framework.
WordPress. How to add Google WEB font
-
In Cherry options, we can see a list of fonts. We are going to add one more font.
-
Go to Appearance -> Editor. Open the options.php file for editing. Search for the following code:
$typography_mixed_fonts = array_merge( options_typography_get_os_fonts() , options_typography_get_google_fonts() );
You can usually find it under the // Fonts comment.
-
Open the Google Web fonts page, select the desired font and add it to Collection. Click the Use button.
-
Open the @import tab and you will see a CSS font import code. In our case it is Domine, serif is the font family.
-
In the options.php file you should add the following code:
$typography_mixed_fonts["Domine, serif"] = "Domine *";
before:
asort($typography_mixed_fonts);
-
Open the themeXXXXX/style.less file with any text/code editor. Copy the @import code and paste it at the beginning of the style.less file. Save the changes and upload the modified file, replacing the original one.
-
Refresh the page. We have added a Google Web font. Now you can see it under Cherry fonts options.
In this code "Domine, serif" is the font family, "Domine *" is the font name that will appear in Cherry options. The modified file should look like on the screenshot below. Save the changes.
Feel free to check the detailed video tutorial below: