Using the Google font API box

The Google font API box is where you specify the font name, style and weight of the font(s) you want to use. You can find this information for your desired font on the Google Fonts site.

If the font’s name consists of more than one word, replace any spaces in the font family name with plus signs +. For example, Droid Sans will be entered as Droid+Sans.

To request multiple font families, separate the names with a pipe character |.

Requesting multiple fonts allows you to use all of those fonts in your page. (But don’t go overboard. Most pages don’t need very many fonts, and requesting a lot of fonts may make your pages slow to load.)

To request other styles or weights, append a colon : to the name of the font, followed by a list of styles or weights separated by commas ,

For example:


will load Tangerine Bold, Tangerine Bold Italic, Inconsolata Italic and Droid Sans Bold.

Once you have imported the required fonts, you can use the Custom CSS panel to specify which font affects which element(s) of the layout. When you specify an element’s font family, use the font name as it appears in the Google fonts page wrapped in quotes, for example:

#menu a { font-family: "Tangerine"; }


#footer { font-family: "Droid Sans"; }