Skip to main content
C
CCT2 SCDA
New Participant
May 11, 2021
Answered

Typekit script in .js?

  • May 11, 2021
  • 1 reply
  • 1828 views

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.
This topic has been closed for replies.
Correct answer Nancy OShea

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.

 

1 reply

Nancy OShea
Nancy OSheaCorrect answer
Community Expert
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 &amp; Moderator
    C
    CCT2 SCDAAuthor
    New Participant
    May 12, 2021

    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? 

    C
    CCT2 SCDAAuthor
    New Participant
    May 12, 2021

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

     

    Thank you so much, Nancy!!

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices