Google Web Fonts for your WordPress Site

Ever wondered how some WordPress websites get to display lovely fonts? Take a look at our post to discover how to add Google Web Fonts to your website.

16 May, 2011

google web fonts

Have you discovered Google Web Fonts yet?

This is a library of fonts, suitable for using on your website, that are available under an open source licence and stored on and accessed from google web servers. So they are fonts you don’t need to pay for!

The possibilities for your website are great. There is a wide range of fonts available, and they are easy to install.

Google Web Fonts Previewer for Chrome

I have installed the font previewer for Chrome, which enables me to quickly and easily test out how each of my web pages will look with a number of different web fonts. Once I have decided on a font, the previewer then provides the code needed to slip into your website. Once the code is added to your site, that’s it – your new web font will be live on your site!

The website you are looking at right now is using the Amaranth font. I’m going to be trying some others out on my other websites.

Adding Web Fonts to WordPress

To get the font installed in your WordPress site, just edit your header.php file and insert the code into the <head>…</head> section of the script (or preferably into your child theme if you have one, just so that it isn’t overwritten the next time you upgrade your theme). Many WordPress themes also allow for new fonts to be installed, and many themes allow website owners to swap fonts them directly – look for a list of selectable fonts in your theme settings / options. Don’t forget to back it up first though – just in case 🙂

If you want to use different fonts for different elements of your site (for example if you want headings in one font and the main text in another, or a special font to display your testimonials in a hand-written style), then you’ll probably want to action that through your CSS. Again, try to avoid editing your main style.css file directly. The best way to add new styles would be through the WordPress customizer, or by adding the styles to the custom.css file in your child theme.

Let me know what you think. I can help out if you get stuck.


Submit a Comment

Your email address will not be published.

You may also like…

Why is my website traffic falling in Google Analytics?

Why is my website traffic falling in Google Analytics?

Have you noticed your website traffic falling over the past few years? If you use Google Analytics, you may be seeing a decline in traffic. This might not be a genuine decline. We explore the reasons for this in our article.

Why choose WordPress – what’s the fuss?

Why choose WordPress – what’s the fuss?

We decided to become WordPress experts because we believe it to be a great, cost-effective platform for small- and medium-sized businesses. It’s packed full of functionality and a great content management system – in fact, WordPress started out as a blogging platform, but developed into much more.

Share This