2 ways to add custom fonts to your blog

View demo.


Want to have a customized font for your header, post and sidebar titles, even your post content? There are actually two ways to go about this.

Technique #1. Using Google Web Fonts.

The Google Font Directory provides high-quality web fonts that you can include in your pages using the Google Font API.

Applying a font is easy: just add a special stylesheet link to your web page, then use the font in a CSS style.

-Google Code Labs

View demo for a customized sidebar title.

It's pretty easy to install a stylish Google web font.
1. Choose a font from Google font directory.
Google Web Font version 1
Google Web Font version 2
2. Filter the search based on category, thickness, script and style.
3. Once you find a font to suits your preference, ADD IT TO COLLECTION.
4. REVIEW.
5. If you're okay with it, get ready to USE it.
6. Follow the instructions from Google on how to add and integrate it to your website.


How to install Google Web Font to Blogger?
Here is a step-by-step procedure from Simple Blog Tutorials, including:
1. How to get rid of the XML error:

Your template could not be parsed as it is not well-formed. Please make sure all XML elements are closed properly.
XML error message: The reference to entity "subset" must end with the ';' delimiter.

2. How to add the customized font to different sections on Blogger.


Browser Support for Google Web Fonts.
Per Google Font API, the browser compatibility are as follows:
Google Chrome: version 4.249.4+
Mozilla Firefox: version: 3.5+
Apple Safari: version 3.1+
Opera: version 10.5+
Microsoft Internet Explorer: version 6+

Technique #2. Using sIFR Generator.

This technique is more handy IF (1) your desired font isn't included in the Google Web Fonts directory and (2) you want a custom font COMPATIBLE TO ALL BROWSERS. However, this would require you to use an online sIFR generator and an account to host the javascript, flash (swf) and css files (e.g. Hostwebs or Awardspace for Blogger users.) The custom font may be added to post titles, sidebar titles, and even post content.

View demo for custom post titles.
View demo for custom post content.

Here's how:
How To Use A Cute Font For Your Blogger Post Titles
How To Use a Custom Font for Your Entire Blogger/Blogspot Posts

Remember:

1. Using several font styles may slow down the loading of your website.
2. Using one or two font styles on several sections of your blog (including the post content) may have the same effect as above.

Related Blogs and Website.

Google Web Fonts
Add Custom Fonts to Blogger with Google Web Fonts
How To Use A Cute Font For Your Blogger Post Titles