HomeWP Themes

How to Use Google Fonts in Genesis Child Theme

Want to update your WordPress blog’s font with Google font? Do you know you how to use Google fonts in Genesis child theme?

Genesis child themes are getting more popularity day by day due to their professional look, SEO friendly studio-press genesis framework and strong customization option.

Get Genesis Framework Now

Google web fonts are able to create a huge buzz in the web world, as they are really awesome. There are couple of them e.g. Open Sans, Roboto etc with which one can really get a very clear content to read with a professional look as well. I have used Google Roboto font in one of my multi-niche website, which is using Genesis News Pro child theme. I will show the simple way to update your Genesis theme with Google web fonts.

Steps to use Google font in Genesis child theme

The very first step would be to go to Google web font page. You will be able to discover total 682 font-family. Simply browse the fonts by choosing word or sentence view. It is better to choose the paragraph view to get an idea how the content will look like in your webpage.

Google font in Genesis child theme1

The very first 2 fonts will be Open sans & Roboto, my favorite Google web fonts. Anyway, if you have decided your font to use, then look for the font-use icon in the right side of each font. Out of 3 small icons, put the cursor in the middle one.

Google font in Genesis child theme2

Click on that icon and you will reach to the next screen. Now you have to scroll down a bit and you can find below image where some code is written.

Google font in Genesis child theme3


There are 3 methods with which one can add Google fonts in any website. They are a) Standard b) @import c) JavaScript. Without making things more complicated, I will use the simplest way to integrate Google font in my WordPress blog.  i.e the standard method.

Simply copy that line and go to your WordPress dashboard. Look for the Genesis option and then click on it.

Google font in Genesis child theme4

Scroll down till you reach the bottom of the page. Find out the “Header and Footer Scripts” section. Simply paste the copied code in this section and save the changes.

Google font in Genesis child theme5

You are done with the integration of Google web fonts in your genesis child theme. After that you have to edit your main CSS file to put the new font name by replacing the old font-family.

Hope you have enjoyed the small tutorial on how to use Google fonts in Genesis child theme. Give your reader a better reading experience with Google web fonts. 🙂

How to Use Google Fonts in Genesis Child Theme
Loved Reading, Rate This

Comments (0)

Leave a Reply

Your email address will not be published. Required fields are marked *