The Design Lab adds more easy to configure design options, including the option to apply a font from the Google Web Font library to different design elements.
Select A Font
First, you can select which font you wish to apply. Go to Design > Style for your blog and click the on Fonts heading in the right column. The Style settings will only be available when a design was created using the Design Lab.
Scroll through the fonts by choosing a category - Handwriting, Display, Serif, or Sans Serif - and using the arrows to navigate through the pages. If you don't see a font you like, you can import another font from the Google Fonts gallery.
A Serif font includes an extension on the stroke in a letter or symbol. A Sans Serif font does not include a serif. Sans Serif fonts are typically used for headings, whereas Serif fonts are commonly used for body text.
Click on any font to make it the Active Font. Only one font can be active at a time though you can use multiple fonts in your design.
The Active Font font can be applied to any design element by clicking on the element in the preview to the left or using the menu below. Jump to the Apply Font section below for more details.
To change the Active Font, select a different font from the menu to replace the current selection or click the x next to the Active Font to have no active font.
Click to jump to the Apply Font instructions below.
Import Font
If you aren't seeing a font that meets your needs, you can browse the Google Fonts gallery and import another font.
- At Design > Styles, click the Fonts banner to open the options.
- Click IMPORT.
- Visit the Google Fonts gallery to choose your font and make note of the font name.
- At Typepad, enter the name of the font exactly as it appears at Google Fonts.
- Click the Import button and Typepad will look for the font. This can take a second.
- Once the font is found, you'll see the font listed below.
- Click on the font name to activate it and proceed with applying the font to elements of the design.
Additional details on importing fonts:
- The name of the font in the Google Fonts gallery needs to match exactly in order for Typepad to find the correct font. For example, PT Sans Narrow will not be found if entered as PT Sansnarrow. If the font you entered is not found, double-check the font name in gallery.
- You can import multiple fonts to apply to different elements of the design.
- To remove an imported font, click the x next to in the font in the list.
- If a font is not applied to an element, the font will be removed from the imported list when you leave the page.
- An imported font applied to a design element will remain available as an imported font.
Apply Font
Once you have chosen a font, you can apply it to any design element by clicking on the element in the preview.
In the right column, you'll see the Active Font listed. Move your mouse to the design preview on the left, and the elements will be indicated by a red border. Click on the selected element to apply the font. In the below screenshot, the active font Open Sans has been applied by clicking on the blog name in the banner:
When the font has been applied, you'll see the font listed next to the element in the right column.
To remove the recently applied font, click the UNDO button next to the element.
The Active Font can be applied to other elements or you can switch to another active font by selecting a new font from the above menu.
In addition to applying the Active Font in the design preview, you can open the element options in the right column menu and click the Apply Font.
The current font can be changed by selecting a new Active Font and clicking on the design element to apply the new font.
Updated 14 December 2018
Not quite what you are looking for? Check out these other articles:
- For details on changing the font in a post or page, see the Rich Text editor article
- Looking to edit the Theme Builder design? Check out the article on using the Theme Builder.
- For information on uploading a banner image, see the Banner article.