- Adobe Fonts User Guide
- Introduction
- Font licensing
- Font licensing
- Manage your account
- Licensing for Creative Cloud for enterprise customers
- Adding font licenses to your account
- Removing fonts from the subscription library
- Adobe Fonts not available to Adobe IDs registered in China
- Why aren't these fonts included in my Creative Cloud subscription?
- Morisawa font removal September 2021
- Getting and using fonts
- Using Adobe Fonts in Creative Cloud apps
- Manage your fonts
- Resolve missing fonts in desktop applications
- Using fonts in InDesign
- Fonts and typography
- Using web fonts in HTML5 Canvas documents
- Using fonts in InCopy
- How to use fonts in Adobe Muse
- Using web fonts in Muse
- Packaging font files
- Troubleshooting guide: Adding fonts
- Added fonts aren't showing to font menu
- "Unable to add one or more fonts" or "A font with the same name is already installed"
- What happens when a font I'm using is updated by the foundry?
- Web design and development
- Add fonts to your website
- Troubleshooting guide: Adding fonts to a website
- Using web fonts in HTML email or newsletters
- Using web fonts with Accelerated Mobile Pages (AMP)
- CSS selectors
- Customize web font performance with font-display settings
- Embed codes
- Dynamic subsetting & web font serving
- Font events
- Why are my web fonts from use.typekit.net?
- Site can't connect to use.typekit.net
- Using web fonts with CodePen
- Browser and OS support
- Domains
- Using web fonts when developing locally
- Content security policy
- Printing web fonts
- Language support and OpenType features
- Font technology
Lejringskoden er den måde, webskrifttyperne indlæses på dit websted i browseren eller i en HTML-e-mail i e-mailklienten.
Standard- og @import-indlejringskoderne bruger kun CSS til indlæsning af skrifttyper (ingen JavaScript). De kan bruges til at føje skrifttyper til websider,HTML-e-mail eller -nyhedsbreve, Google AMP og mange andre typer projekter, hvor webskrifttyper understøttes. JavaScript-skrifttypeindlæsning bruges til dynamisk udskiftning, som er påkrævet til visning af østasiatiske webskrifttyper.
Indlejringskoden for hvert af dine projekter kan findes på siden for webprojekter.
Standardintegreringskode
Standardindlejringskoden er et enkelt <link>-tag, som indlæser webprojektets CSS fra skrifttypenetværket (use.typekit.net) i browseren.
<link rel="stylesheet" href="https://use.typekit.net/xxxxxxx.css">
For at finde standardindlejringskoden til dit projekt skal du besøge siden for webprojekter. Føj denne indlejringskoden til tagget <head> på dit websted.
@import-indlejringskode
@import-indlejringskoden kan bruges direkte i dit CSS-typografiark.For at finde @import-indlejringskoden for et projekt skal du gå til siden for webprojekter og derefter klikke på indstillingen " @import-link"
Tilføj det imellem typografitags i <head> på dit websted:
<style> @import url("https://use.typekit.net/xxxxxxx.css"); </style>
Eller placer det øverst i din CSS-fil:
Hvis du bruger @import-indlejringskoden, skal den være i begyndelsen af <style>-tagget, eller også bliver CSS-filen med en hvilken som helst anden @import-sætning eller skrifttype ikke indlæst. Det er kun posten @charset, der må vises før linjer med @import.
Brug af en af CSS-indlejringskodeindstillingerne betyder, at resten af siden muligvis ikke vises, før webskrifttypen CSS er færdig med at indlæse. Virkemåden varierer mellem browsere, afhængigt af hvordan hver enkelt håndterer eksterne CSS-filer.
Når det gælder asynkron skrifttypeindlæsning, der ikke blokerer resten af siden, skal du inkludere et andet JavaScript-bibliotek sammen med CSS-indlejringskoden for at tilpasse din skrifttypeindlæsning.
JavaScript-indlejringskode
JavaScript-indlejringskoden er påkrævet til dynamisk udskiftning, som bruges til visning af østasiatiske webskrifttyper.
<script> (function(d) { var config = { kitId: 'xxxxxxx', scriptTimeout: 3000, async: true }, h=d.documentElement,t=setTimeout(function(){h.className=h.className.replace(/\bwf-loading\b/g,"")+" wf-inactive";},config.scriptTimeout),tk=d.createElement("script"),f=false,s=d.getElementsByTagName("script")[0],a;h.className+=" wf-loading";tk.src='https://use.typekit.net/'+config.kitId+'.js';tk.async=true;tk.onload=tk.onreadystatechange=function(){a=this.readyState;if(f||a&&a!="complete"&&a!="loaded")return;f=true;clearTimeout(t);try{Typekit.load(config)}catch(e){}};s.parentNode.insertBefore(tk,s) })(document); </script>
JavaScript-indlejringskoden til et dynamisk projekt er angivet på siden for webprojekter.
Den avancerede indlejringskode kan tilpasses ved at overføre et konfigurationsobjekt til Typekit.load-metoden. Se afsnittet om JavaScript API for at få flere detaljer.
JavaScript API
JavaScript viser en global variabel, Typekit, med én offentlig metodeindlæsning. Kald af "Typekit.load" uden nogen argumenter vil udløse skrifttypeindlæsning.
Typekit.load()
Du kan også sende et konfigurationsobjekt til Typekit.load.
Typekit.load({ // configuration… });
Følgende tilbagekald kan specificeres:
- Indlæser – Dette tilbagekald udløses, når alle skrifttyper er blevet anmodet om.
- aktiv – Dette tilbagekald udløses, når skrifttyperne er gengivet.
- inaktiv – Dette tilbagekald udløses, når browseren ikke understøtter sammenkædede skrifttyper, eller hvis ingen af skrifttyperne kunne indlæses.
- skrifttypeindlæsning – Dette tilbagekald udløses én gang for hver skrifttype, der er indlæst. Tilbagekaldet kaldes med familienavnet som det første argument og skrifttypevariationsbeskrivelsen som det andet argument.
- skrifttype aktiv – Dette tilbagekald udløses én gang for hver skrifttype, der gengives. Tilbagekaldet kaldes med familienavnet som det første argument og skrifttypevariationsbeskrivelsen som det andet argument.
- skrifttype inaktiv – Dette tilbagekald udløses, hvis skrifttypen ikke kan indlæses. Tilbagekaldet kaldes med familienavnet som det første argument og skrifttypevariationsbeskrivelsen som det andet argument.
Ændring af indlejringskoden på et websted
Hvis du har et websted, der allerede bruger skrifttyper via en ældre JavaScript-indlejringskode, kan du skifte til den nyere CSS-version ved at erstatte <script>-tags i din kode med HTML <link>-indlejringskode eller CSS @import-indlejringskode.
Brug af ældre indlejringskode på et websted
Selvom Adobe lejlighedsvis ændrer mulighederne for indlejringskode, efterhånden som vi foretager forbedringer af skrifttypevisningen, vil alle tidligere versioner af indlejringskoderne fortsætte med at fungere.
Hvis du bruger en ældre indlejringskode på dit websted, bliver du ikke påkrævet at ændre den. Mange websteder vil dog drage fordel af ydeevneforbedringer ved at opdatere til en nyere version.
Tidligere versioner af indlejringskoden inkluderer en JavaScript-version, som indlæser CSS-filen asynkront:
<script src="https://use.typekit.net/xxxxxxx.js"></script> <script>try{Typekit.load({ async: true });}catch(e){}</script>
Og en protokol-relativ JavaScript-version:
<script src="//use.typekit.net/xxxxxxx.js"></script> <script>try{Typekit.load({ async: true });}catch(e){}</script>
(Selv hvis dit websted bruger den protokol-relative indlejringskode, bruger skrifttypevisning HTTPS til alle anmodninger .)
Brug af flere indlejringskoder på et websted
Vi anbefaler ikke at tilføje mere end én indlejringskode til det samme websted af flere årsager:
- Hver kopi af indlejringskoden er for det meste overflødig.
- Hvert projekt laver separate anmodninger om skrifttyper, hvilket øger antallet af HTTP-anmodninger og yderligere forsinker indlæsningen.
- Et enkelt projekt kan cachelagres på tværs af alle sider på dit websted efter den første indlæsning.