How to implement Adobe TypeKit Fonts

To be able to integrate an Adobe Font, you'll need an Adobe Typekit account.

As soon as you have one, you can sign in on your account and look for an appropriate font to use on a website. In the search bar on top of the screen, you can browse through different fonts. When you have found a good font, Click the Use Fonts button.

Select the option to embed the font through the web. You have the choice to make a new kit or add the font to an existing typekite/existing project.

typekit-add

Creating new kit

typekit-add-new

Adobe Typekit 2

First you choose an appropriate name for your typekit (i.e. the name of the account/website). Use following fonts to see the fonts when working in the system:

  • cloud.sitemn.gr
  • sitemn.gr
  • www.sitemn.gr
  • *.yourdomain.be

Click through until you see the screen as displayed below.

typkit-kit-1

Getting typekit ID

To finish, click embed on the top and take the ID that is shown below in the pop up screen. This code is copied and pasted in the SiteManager Design application > Custom Fonts > Adobe Typekit.

typkit-kit

typkit-id

Getting typekit name

For the right name of the Font, you click Using Fonts in CSS beneath Selectors. This font name is also added in the SiteManager Design application.

typkit-kit-2

typekit-name