How to Use Google Fonts in WordPress

Google Fonts provides website designers a free way to make a site attractive. They are easy to download and use, as long as you follow these steps or use plugins specifically made for Google fonts.In this article you will learn how to use Google Fonts in WordPress.

Adding Google Fonts Manually

First Step: Choose Your Google Fonts

Many web designers are using a combination of two Google Fonts for their sites. Go to Google Fonts to browse all the available ones. When you find one or two you like, click on “Quick-use.” Scroll down until you see the code to copy for your website. Make sure you have Standard selected because it’s the best code to use.

Second Step: Combine and Paste the Codes

If you have two fonts, combine the codes with a | character. Copy and paste this code in your header.php file. This is the head section of your theme. You should place it first in the file because it will be the first thing looked for and it could slow the loading speed if placed elsewhere in the file.

Third Step: Include the Font in the CSS File

The final step is to include the font in the font-family for your theme’s CSS file.

Adding Google Fonts with Plugins

If you don’t like fooling around with the coding for your theme, you should use plugins. They are easy to use and effective. There are three plugins that do the job.

  1. Easy Google Fonts
    This plugin is compatible with all themes and the newest version of WordPress. The plugin is integrated with WordPress Customizer, which allows you to preview fonts before you choose them. This is a great feature because sometimes you have to see what the fonts looks like before making a decision. When you’ve decided on a font for your site, simply choose it, and that’s it. Your site will then use that font in its theme.
  2. Google Font Manager
    Google Font Manager is great for beginner or advanced website designers. You can add as many Google Fonts to the plugin as you wish. Once you have them in there, you can choose the ones you’d like, which will override your theme’s default. What people like the best about this plugin is how nice it looks in WordPress. You can see the fonts and change them to see more examples. It’s easy to find one that you like the best with this plugin.
  3. Google Web Fonts Customizer
    With this plugin, you can change the weight, style and color of your font easily. It works with any theme you have, and it will allow you to preview the fonts before choosing them for your site. Just like the other plugins, you will not need to deal with any coding when you want to change fonts.

How to Choose Which Plugin to Use

Google Font Manager looks nice, so if that’s important to you, this one is perfect for you. When you want a simple design, choose Easy Google Fonts. It just shows you what the font looks like on a white, clean background. You can change the color to see what it looks like, but it’s nothing fancy. The Google Web Fonts Customizer is a combination of these two. It’s simple, but it’s a bit fancier like Google Font Manager.

Why Choose a Plugin Over Coding

Google Fonts plugins are perfect for people who don’t want to risk their theme’s functioning. It doesn’t affect the rest of the site. It just takes the font you choose and puts the code exactly where it needs to be in your files.

If you’re skeptical that a plugin won’t be able to do everything you want it to with your fonts, try it out first. If you want more customization, you can then turn to coding. By using both a plugin and manually changing fonts, you may just be able to get a unique, but attractive font on your site that will impress web visitors.

One Response to "How to Use Google Fonts in WordPress"

  1. Adam   August 1, 2014 at 6:26 AM

    Interesting, but the question is if these plugins are “problem free”, or they can cause conficts with wordpress themes?

    Reply

Leave a Reply

Your email address will not be published.