• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WBXPress.NET

Website Developement Guide

  • apache2
  • nginx
  • mysql
  • php7
  • SSL
  • wordpress
  • genesis
  • caching
  • seo

How to Use Google Font in Genesis theme

Updated on 12th July 2016 11 Comments

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.

Filed Under: google, wordpress Tagged With: genesis, theme-development

Reader Interactions

Comments

  1. Xaif says

    13th July 2016 at 5:03 pm

    Thank You for writing the post for mee… 🙂

    Reply
    • wbxpress says

      13th July 2016 at 10:17 pm

      you are most welcome.

      Reply
  2. Vikash Kumar says

    12th September 2016 at 9:50 am

    Wow i also use this.

    Reply
  3. shirish says

    12th November 2016 at 3:36 pm

    Well! Nice post.
    Can you show how exactly can I change font style of font in eleven 40 child theme

    Reply
    • wbxpress says

      13th November 2016 at 10:14 pm

      It’s similar for eleven40 also.

      Reply
  4. Learn Blogging says

    16th February 2017 at 12:10 am

    Hi,
    Thanks For Sharing with us.It is Good Font.

    Reply
  5. Akash Sharma says

    21st February 2018 at 6:40 pm

    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.

    Reply
  6. Rohit says

    21st May 2019 at 8:00 am

    This method Doesn’t work anymore in 2019! I tried everything correctly but font remains the same in my genesis eleven40pro theme.

    Reply
    • wbxpress says

      31st May 2019 at 8:50 pm

      You must have to delete your browser cache after editing the style and function file to view the changes.

      Reply
      • Rohit says

        13th June 2019 at 1:32 pm

        Awesome… thanks bro. Its worked… I wasn’t aware of clearing browser cache. ?

  7. Rohit says

    13th June 2019 at 9:01 pm

    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.

    Reply

Leave a Reply Cancel reply

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

Primary Sidebar

Most Popular Posts

  • Remove/ Defer Render-blocking JavaScripts
  • Customizing Genesis eleven40-pro Theme
  • Free Genesis Child Theme by WBXPress
  • Host Multiple Sites with SSL in Ubuntu 18.04
  • 25 Ways to Boost Website Traffic that Really Work

Recent Comments

  • Ruhul on Customizing Genesis eleven40-pro Theme
  • Priya Agarwal on Customizing Genesis eleven40-pro Theme
  • mimi roy on Remove/ Defer Render-blocking JavaScripts
  • danish choudhary on Customizing Genesis eleven40-pro Theme
  • Radhe on Customizing Genesis eleven40-pro Theme

Copyright © 2021 · Powered by WordPress · Log in