cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Show  only  | Search instead for 
Did you mean: 
Exit
search
  • Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
  • 한국 커뮤니티
0
Upvote

Typekit script in .js?

CCT2 SCDA
New Here ,
May 11, 2021 May 11, 2021

Hi there!

 

Require a bit of help on this situation I'm facing.

 

We acquired full control of a website from the previous web designers a while back and recently discovered that majority of the fonts went from serif (Freight family, taken from Typekit) to sans-serif.

 

We believe that the Typekit account used by the previous web designers have depreciated, hence the font issue. This is what we see in the source code (bolded the Project ID):

 

<script src="https://use.typekit.net/ryh0phl.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>
 
We assumed that we could just generate a new code, replace the previous Project ID and all would go well. But this isnt the case as the generated code from our own Adobe account is in .css and written differently (bolded the Project ID):
 
<link rel="stylesheet" href="https://use.typekit.net/drp7qdn.css">
 
Has Typekit done away with the .js script? Is there a way to continue using .js?
If not, how do I go about using the above new .css script instead?
 
Much thanks.
TOPICS
Code , Error , How to , Other
2.0K
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines

correct answers 1 Correct answer

Nancy OShea Community Expert
Community Expert , May 11, 2021 May 11, 2021

Adobe Fonts (formerly known as Typekit) uses a combination of JavaScript and CSS code to pull custom web fonts into your projects.

 

1. Log-in and select your desired fonts and variants.

https://fonts.adobe.com/fonts

2. Activate fonts within your "My Fonts" console and associate them with your new web project.

3. Copy & paste generated Adobe Fonts code into the <head> tag of your document.

4. Add the required CSS font-family, alternatives & variants to your stylesheet. 

h3 {font-family: "custom-

...
Translate
replies 4 Replies 4
latest latest Jump to latest reply
Nancy OShea Community Expert
Community Expert ,
May 11, 2021 May 11, 2021

Adobe Fonts (formerly known as Typekit) uses a combination of JavaScript and CSS code to pull custom web fonts into your projects.

 

1. Log-in and select your desired fonts and variants.

https://fonts.adobe.com/fonts

2. Activate fonts within your "My Fonts" console and associate them with your new web project.

3. Copy & paste generated Adobe Fonts code into the <head> tag of your document.

4. Add the required CSS font-family, alternatives & variants to your stylesheet. 

h3 {font-family: "custom-font-name", arial, helvetica, sans-serif; font-size: 32px; font-weight: 900}

5. Save & upload your HTML and CSS documents to remote server to test. 

6. To see results, refresh your browser by clearing cached data or use a different web browser.

 

Nancy O'Shea— Product User, Community Expert & Moderator
arrow in illustrator | Illustrator tutorials| Arrowheads, straight arrow, curved arrow, dotted arrow
arrow in illustrator | Illustrator tutorials| Arrowheads, straight arrow, curved arrow, dotted arrow
fonts.adobe.com/fonts
Today I will show you the expert way to design arrows in Illustrator. By changing the Arrowheads option, you can easily create different arrow shapes. And here's how to make a very unique and stylish arrow. Design unique arrows. Make Arrows in Illustrator. Turning on 💬English subtitles(cc) and ...
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
CCT2 SCDA
New Here ,
May 11, 2021 May 11, 2021
In Response To Nancy OShea

Thanks for replying, Nancy!

 

Would it be accurate for me to say that I've to do away with this script altogether?

 

<script src="https://use.typekit.net/ryh0phl.js"></script>
<script>try{Typekit.load({ async: true });}catch(e){}</script>

 

And only use the method you've written above? 

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
CCT2 SCDA
New Here ,
May 11, 2021 May 11, 2021
In Response To CCT2 SCDA

Ok followed your instructions and everything is working just fine now!

 

Thank you so much, Nancy!!

Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Nancy OShea Community Expert
Community Expert ,
May 12, 2021 May 12, 2021
LATEST
In Response To CCT2 SCDA

You're welcome.  Glad I could help. 🙂

 

For future reference, Adobe Fonts has a dedicated product forum below in case you have more questions about using fonts.

Adobe Fonts Community

 

Nancy O'Shea— Product User, Community Expert & Moderator
Translate
Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Copyright © 2025 Adobe. All rights reserved.
Using the Community Experience League Terms of Use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices