Choosing fonts
Google fonts
Choose your font on the Google font repository. Then simply type its name in the PhotoDeck panel to select and use it!
It is best to restrict yourself to a maximum total of one or two fonts in your design, and/or a couple of font weights. This way your site will stay clean-looking, and will keep loading fast.
Clean fonts we like: Lato, Open Sans, Source Sans Pro, Roboto, Raleway, Montserrat, Vollkorn, Klara.
Typekit integration
Typekit is a leading commercial webfont provider.
- Enter your Typekit kit ID under My Website / Desktop/Tablet Website / Customize theme / Main site font. Your Typekit kit ID is provided on the Typekit interface:
- Under the Typekit interface, pick a font. Under the "Selector" option enter
#ws_pageto apply the font to the whole design, then hit "Publish".
Make sure you keep the default typeset in your Typekit Kit settings. "Subsetting" will not work.
- The Typekit font will be visible on your website after a few minutes.
Note: If you wish to apply a font to a single component of your design, you will need to use a webpage inspector (e.g. Firebug or Chrome/Safari built-in developer tool) to identify the proper CSS selector. CSS selectors examples: #ws_page for the whole design, #ws_page .block .title for page titles, #ws_page #component_xxxxx for a given component... Note that selectors must always include #ws_page.
Standard HTML fonts
This font map shows how different font families render on standard Windows and Mac browsers.
(For each pair listed, we use additional similar-looking fallback fonts for systems where either font is not installed).
