As I worked today with Google fonts, I thought it would be useful to share a few additional details.
To start using a Google font, go to Google.com/fonts and pick the font you like. Click on it, then click the Use tab.
- In App.HTML header, add the code they want you to add to the website. For instance :
<link href='http://fonts.googleapis.com/css?family=Mate+SC' rel='stylesheet' type='text/css'>
- Follow that by the font you want to use, wrapped in a style name, preceded VERY IMPORTANT by a period, and you add the code between brackets :
.haha { font-family: 'Mate SC', serif; }
- In your project, add a WebStyle of exactly the same name, without the period. ‘haha’
The beauty of that way is that you can set the webstyle any way you want : justification, color, and so on, as usual, while using the Google font. Setting other fonts in the webstyle seem to do nothing, but I suppose these fonts will be used as fallback in the very unlikely event Google servers went down.
The beauty of that method is that you benefit from all the webstyle features while having the webfont.