Easily Add Google Web Fonts on WordPress Blog

By Sidharth | Google

Google Font Directory shelters a diverse array of fonts that site owners can deploy on their WordPress blogs. The fonts are fresh, easy to install, and optimized for a better readability experience.

Served with visual richness, the Google web fonts are high-quality open source fonts compatible with any modern browsers. This is the best part: because these fonts are stored on Google’s server, there’s no need for you — or your readers — to install fonts on the computer.

Google fonts are designed for the web, and Google has made it significantly easier by hosting the fonts on the cloud. Mac or Windows, Google fonts doesn’t rely on the Operating System. Even installing of fonts on WordPress sites is a breeze.

Before we jump into various ways to install Google fonts on your blog, let’s list out the browsers compatible with Google web fonts:

  • Mozilla Firefox
  • Google Chrome
  • Safari
  • Internet Explorer

There are two ways to go about adding Google Web fonts on your WordPress blog. The first method, a manual process, includes adding a couple lines of HTML on your blog.

Installing Google Fonts Manually

To take advantage of the Google Fonts API, this is all you have to do: browse through the fonts catalog, pick a font, and add the code on your site.

For example, for font Tangerine, this code goes straight into the header.php file.

<link href='http://fonts.googleapis.com/css?family=Tangerine' rel='stylesheet' type='text/css'>

And this code goes into the style sheet file — usually named style.css.

body { font-family: 'Tangerine', serif; }

My only beef with this procedure is the difficulty in changing the fonts, although it’s not really a tedious process. You can, however, use a WordPress plugin to enable Google fonts on your blog.

Google Fonts Plugin

WP Google Fonts is a WordPress plugin available for free. As soon as you have this plugin installed on your WordPress blog, you can change fonts on the fly.

All you have to do is to choose the font from the neat drop down menu, select the elements you want the changes to be reflected to, and add custom CSS (optional).

All the latest Google web fonts are accessible through this plugin. It does simplify the process of adding fonts on your site. So, go ahead and download the plugin from here.

About the Author

Hi, I am Sidharth. Full-time blogger. Editor of Blogote. And a self-proclaimed geek!

Leave a Comment:

Leave a Comment: