Typekit Fonts Not Showing Up
Typekit Fonts License
Typekit Fonts License
Typekit Fonts Not Showing Up In Illustrator

Adobe Typekit is a font subscription service included with your Creative Cloud membership that gives you access to thousands of quality fonts that you can sync to your computer or use on a website. You can use these fonts to add typographic personality to all your web and print projects. Integrate Typekit. Then follow these steps to add Typekit fonts to your website. First enable the Typekit module on the Powerkit settings page. Being an advanced module, it’s disabled by default. Navigate to Appearance → Fonts → Typekit. Input your Typekit token and click Save Changes.

Description

This plugin helps you easily embed adobe fonts easily in your WordPress website.

Currently it works with:

How does it work?

Install the plugin
Enter the Project ID that you create in adobe fonts.
And done. You will be able to see the fonts added in the settings of Astra / Beaver Builder / Elementor. Please refer screenshots.

If you’re not using any of the supported plugins and theme, you can write the custom CSS to apply the fonts.

Installation

Upload the plugin files to the /wp-content/plugins/custom-typekit-fonts directory, or install the plugin through the WordPress plugins screen directly.
Activate the plugin through the ‘Plugins’ screen in WordPress.
Use the Appearance -> Adobe Fonts -> Add Kit ID and get all Font list.
If you are using Astra then start using fonts from the customizer.
You can also select Font Family from Appearance -> Adobe Fonts and start using it into your custom CSS.

Reviews

I messed around for way too long before I decided to search for a plugin.Wish I woulda done this from the get-go! Yay Brainstorm Force!Nice easy way to add Adobe Typekit fonts to Beaver Builder modules.

Powered by Powerkit

You need to install and activate our free plugin Powerkit to make this feature work.

You may install Powerkit from the list of recommended plugins in Appearance → Install Plugins or from the common plugins page in Plugins → Install Plugins.

Easily integrate Typekit fonts on your site by using the Typekit module.

Obtain Typekit Token

First you need to obtain your Typekit Token:

Visit Typekit and log in to your account.
Go to the Tokens page.
Copy the Typekit Token to clipboard.

Typekit Fonts Not Showing Up

Create Font Kit

Then create a Typekit font kit:

Find a font, that you would like to use.
Click on Add to Kit.
Either create a new kit or use an existing one.
Make sure that your domain is in the list of allowed domains in Kit Settings.
Save your kit settings by clicking Save Settings.
Publish your kit by clicking Publish.

Integrate Typekit

Typekit Fonts License

Then follow these steps to add Typekit fonts to your website.

First enable the Typekit module on the Powerkit settings page. Being an advanced module, it’s disabled by default.
Navigate to Appearance → Fonts → Typekit.
Input your Typekit token and click Save Changes.
Select the kit from the select field, that you would like to use on your website.

What’s next?

If you use one of our premium WordPress themes, you will find the fonts from your kit right in the typography fields in Appearance → Customise → Typography:

This feature also supports live-preview and allows configuring your fonts without refreshing the browser page.

If you’re using a third-party theme, navigate to Appearance → Fonts → Typekit and copy the available CSS classes.

Then you may use them in Appearance → Customise → Additional CSS.

Typekit Fonts License

Flash of Unstyled Text

To avoid the so-called Flash of Unstyled Text (or, FOUT), primary elements, like headings and menus will be hidden by default, before the Typekit font is loaded.

Typekit Fonts Not Showing Up In Illustrator

You may control how your font looks before the Typekit fonts have been fully loaded by applying your own styles to the .wf-loading class. This class is added by the Typekit module automatically, if the Typekit Token and Kit fields are not empty. It’s removed from the html element, as soon as the Typekit font is loaded.