Retrieving a Google web font
Google publishes a catalog of open source designer web fonts which are relatively easy to download and use on your website.
In this example, we will use the font Dancing Script and apply it to our Heading 2 (H2) tag.
- To download a font, go to the Google catalog at http://www.google.com/webfonts
- Select a font. When you hover your cursor over the name of a font, you can see selections for the type of content, such as paragraph, sentence, numbers, etc., which helps you to decide on the font. You can also select the thickness of the letters, and whether the typeface is Roman or Italics, depending on the font. You can use the slider to size the font.
Google will give you the code to use on your website, the one below is for the font Dancing Script.
<link href='http://fonts.googleapis.com/css?family=Dancing+Script' rel='stylesheet' type='text/css'>
Adding the font code to your
Go to Website > HTML HEAD
Then in the CSS, add the styles for the Google Font:
Example:
/* Applies formatting for Heading 2*/ h2 { margin: 0 0 15px 10px; font-family: 'Dancing Script', serif; font-size: 41px; font-style: normal; font-weight: 400; text-decoration: none; text-transform: none; letter-spacing: 0.061em; word-spacing: 0.115em; line-height: 1.11; }
Overview
Content Tools