Logo
en nl

CSS in Paspartout - 3. Fonts

last updated: 28/04/2012
difficulty: medium
licenses: Pro, Biz, Shop
In Paspartout Pro, Biz and Shop you have the option of uploading your own fonts. In order for this to work on different browsers you need to convert your font first. Luckily fontsquirrel.com created a font generator that will do the hard work for you:

www.fontsquirrel.com/fontface/generator

Click on the "Add Fonts" button and select the font you want to be converted:

Medium-screen-shot-2012-02-15-at-09-24-39

Upload will start automatically. When it is ready download your kit:

Medium-screen-shot-2012-02-15-at-09-31-30
This will be a zipped folder so unzip it to continue. Then head over to the theme editor in Paspartout, click on "fonts" and then on "manage":

Medium-screen-shot-2012-02-15-at-09-56-54

Select the files from the unzipped folder into the respective fields. Upload will start automatically if all files are selected:

Medium-font-types

When done uploading your font will appear in the list with preview:

Medium-screen-shot-2012-02-15-at-10-04-52

Repeat those steps if you want to add more fonts. If not click on the "I'm done..." button:

Medium-screen-shot-2012-02-15-at-10-05-33

The font(s) you uploaded will appear in the font dropdown menu. Select it there if you want to use it as the main font for your site. Alternatively, if you want to use it in CSS you can define it for the font-family of the element you want to style.


1
2
3
body {
  font-family: DekarRegular, sans-serif;
}

related articles

CSS in Paspartout - 1. Quickstart CSS in Paspartout - 2. Images CSS in Paspartout - 4. Google Fonts