Integrating Typekit

Last Updated on

Typekit is a subscription font service that brings thousands of fonts from foundry partners into one library for quick browsing, and easy use on the web or on your desktop, as well as endless typographic inspiration. Click here for more information about this service.

The process of integrating typekit into Jupiter is easy and requires two main steps; configuring the TypeKit and adding the TypeKit into the theme.

In this article


Configuring the TypeKit

x
Note: If you haven’t already, create a TypeKit account.
1
Once you’ve created your account, choose some fonts.

You can toggle between the default & Japanese font collections from the selector at the top of the page. Filter by Classification (e.g., serif or sans serif), Properties (e.g., x-height, width, or weight), or Language. You can also choose between two recommended categories: headings and paragraphs.

2
When you find a font you like, click the font card to go to the family page.

3
On the font family page, click the “add to kit” button, then choose “create a new kit.”

x
Note: It is possible to add multiple fonts in a single kit.
4
Give the kit a name, and enter the domain for your website.

5
Next, you’ll be given the Type Kit ID used in Jupiter for your specific kit. Take a note of it.

6
Choose the appropriate character set, weights, styles and selectors you would like to use. Finally, publish your kit.

Publish the kit to the font network from the kit editor


Integrating the TypeKit

The next step is to add the TypeKit into Jupiter.

1
From the WordPress left menu, go to Jupiter > Theme Options > Global Settings > API Integrations.

2
Scroll down to Typekit Kit ID input field and paste your ID obtained in the first section of this article. After that, click on the Save Settings button.

3
From the WordPress left menu, go to Jupiter > Theme Options > Typography.

4
Click on Add a new font.

5
Select TypeKit and add the font family name you have added to your list inside the Typekit website.

x
Note: The name of the font should be lowercase, with no spaces, and must have hyphens (-) as a separator of the words in the font name.
6
Click on the save font icon and click on the Save Settings button.
Was this helpful?
Previous Article:
Next Article:

Can't find what you're looking for?

Open New Ticket