How To Change The Fonts On Your Blog Using Google Webfonts

Just recently, Google launched the Google Webfonts (beta).

Google Web Fonts lets you browse all the fonts available via the Google Web Fonts API. All fonts in the directory are available for use on your website under an open source license and are served by Google servers.

Get it? That means you can use them to beautify your blog. It's pretty easy. Here's how.

First go to Google Webfonts. There you will find lists of fonts. Click whichever you want to use. You will be brought to the font's page. Before you do anything else, please read the License of each font to avoid the violation of its corresponding TOS.

There are several tabs about the font in that page. You can check them out by yourself.

To start using it to your blog, click the Use This Font tab. Check the variant of the font you intend to use (Regular/Bold etc). And copy the code beneath it. For example (I use the Droid Sans):

Next, go to your HTML editor in Blogspot, (dont forget to backup it first before you proceed), paste that code somewhere between the head and /head tag. Save it. Note: Don't forget to add the "/" (without quotes) in the closing tag "'/" (without the quotes) (after the type='text/css'>) so that it looks like this: type=text/css'/> or else you won't be able to save your change.. Next, copy the other code, in my case it looks like this:

You only need to copy the font-family part. Next, still in HTML editor, decide on which part you want this font to be (the header, headlines, body etc) search (ctrl+f  in Firefox) that part and look for the default font-family of that part. Replace that default font-family with the one generated in the Google Webfonts. Save your change and voila. You just change the font on your blog.