Google Fonts are being used recently. Genesis theme also uses Google Fonts in their themes. In this tutorial we like to share how to change the default google font in any genesis child theme.
Lets take eleven40-pro for an example.
1. Check which fonts are used.
Open functions.php of the theme file. You will find this line of code:
wp_enqueue_style( 'google-fonts', '//fonts.googleapis.com/css?family=Lora:400,700|Oswald:400', array(), PARENT_THEME_VERSION );
With the above line the theme imports two google fonts for use. “Lora” for body text and “Oswald” for title text. We will show how to use different fonts rather than “Lora” and “Oswald”.
2. Choose Fonts from Google Font Library
There are hundreds of free fonts available in Google Font Library. You can choose any fonts from this library. Suppose we like to use “Montserrat” and “Neuton” fonts for body text and title respectively.
3. Change Fonts in functions.php
So you need to change the code in functions.php as follows:
wp_enqueue_style( 'google-fonts', '//fonts.googleapis.com/css?family=Montserrat:400,700|Neuton:400,700', array(), PARENT_THEME_VERSION );
4. Change in style.css also
You also need to change in style.css. Replace all occurrences of “Lora” to “Montserrat” and “Oswald” to “Neuton”.
That’s it. You may further change font-size as per your liking.
If you have any question or suggestion you are most welcome to comment.
P.S. For editing theme files we strongly recommend to use Notepad++ software.
Thank You for writing the post for mee… 🙂
you are most welcome.
Wow i also use this.
Well! Nice post.
Can you show how exactly can I change font style of font in eleven 40 child theme
It’s similar for eleven40 also.
Hi,
Thanks For Sharing with us.It is Good Font.
I can do all thing but nothing happen I replace Lora to Montserrat and Oswald to Lato https://sharmatricks.com/ this the site plz check and help me.
This method Doesn’t work anymore in 2019! I tried everything correctly but font remains the same in my genesis eleven40pro theme.
You must have to delete your browser cache after editing the style and function file to view the changes.
Awesome… thanks bro. Its worked… I wasn’t aware of clearing browser cache. 🤗
Hey, please help…
I want to change the mobile responsive menu of eleven40pro and want to make looks like your site in mobile view. Can you refer any link or script if you have?
It will be really helpful, thanks.