Käyttöopas Peruuta

Kirjasimien lisääminen sivustoosi

  1. Adobe Fonts User Guide
  2. Introduction
    1. System and subscription requirements
    2. Browser and OS support
    3. Add fonts on your computer
    4. Add fonts to your website
    5. Add fonts on CC Mobile
  3. Font licensing
    1. Font licensing
    2. Manage your account
    3. Licensing for Creative Cloud for enterprise customers
    4. Adding font licenses to your account
    5. Removing fonts from the subscription library
    6. Adobe Fonts not available to Adobe IDs registered in China
    7. Why aren't these fonts included in my Creative Cloud subscription?
    8. Morisawa font removal September 2021
  4. Getting and using fonts
    1. Using Adobe Fonts in Creative Cloud apps
    2. Manage your fonts
    3. Resolve missing fonts in desktop applications
    4. Using fonts in InDesign
    5. Fonts and typography
    6. Using web fonts in HTML5 Canvas documents
    7. Using fonts in InCopy
    8. Using web fonts in Muse
    9. Packaging font files
    10. Troubleshooting guide: Adding fonts
    11. Added fonts aren't showing to font menu
    12. "Unable to add one or more fonts" or "A font with the same name is already installed"
    13. What happens when a font I'm using is updated by the foundry?
  5. Web design and development
    1. Add fonts to your website
    2. Troubleshooting guide: Adding fonts to a website
    3. Troubleshoot font issues
    4. Using web fonts in HTML email or newsletters
    5. Using web fonts with Accelerated Mobile Pages (AMP)
    6. CSS selectors
    7. Customize web font performance with font-display settings
    8. Embed codes
    9. Dynamic subsetting & web font serving
    10. Font events
    11. Why are my web fonts from use.typekit.net?
    12. Site can't connect to use.typekit.net
    13. Using web fonts with CodePen
    14. Browser and OS support
    15. Domains
    16. Using web fonts when developing locally
    17. Content security policy
    18. Printing web fonts
  6. Language support and OpenType features
    1. Language support and subsetting
    2. Using OpenType features
    3. Syntax for OpenType features in CSS
  7. Font technology
    1. OpenType-SVG color fonts
    2. Ten Mincho: important points on updating from Version 1.000

Adobe Fontsin verkkokirjasimia voidaan käyttää sivustoissasi, HTML-sähköpostikampanjoissa, Googlen AMP-muodossa olevissa artikkeleissa ja monissa muissa projekteissa, joissa verkkokirjasimia tuetaan.

Adobe Fonts ‑verkkopalvelu edellyttää, että verkkokirjasimia käytetään niiden upotuskoodin kautta. Käyttöehdot eivät anna sinun isännöidä verkkokirjasintiedostoja itse tai lähettää niitä sivustojen suunnittelualustaan.

Käytettävien kirjasimien valitseminen

Ryhdy selaamaan kirjasimien kirjastoa. Voit valita tarvitsemasi kielituen avattavasta KIELET JA KIRJOITUSJÄRJESTELMÄT ‑valikosta.

Näytössä näkyy Fontsin verkkokäyttöliittymä, jossa kieliasetukset on korostettu.
Valitse Kielten ja kirjoitusjärjestelmien valikko, jos haluat nähdä kirjasimien kielisuodatinvalikon.

Lisää tunnisteita tai suodattimia kirjasimien luettelon tarkentamiseksi. Käytä luonnollisten kielten tunnisteita, jos haluat hakea projektisi tunnelmaan sopivia kirjasimia, mutta voit suodattaa kirjasimia myös luokituksen (kuten serif tai sans serif), ominaisuuksien (x-korkeus, leveys tai paksuus) tai kielen mukaan. 

Adobe Fonts ‑tunnisteiden selaaminen

Verkkoprojektin luominen

Kun löydät kirjasimen, josta pidät, lisää kirjasinperhe verkkoprojektiin napsauttamalla </>-painiketta.

Kuva kirjasimista, jotka Gilbert näyttää, Lisää perhe ‑asetus korostettuna

Voit avata kirjasinperheen sivun myös napsauttamalla kirjasimen nimeä ja tarkastella kaikkia käytettävissä olevia kirjasimien paksuuksia ja tyylejä. Lisää sitten kirjasinperhe verkkoprojektiin napsauttamalla sivun yläosassa </> Lisää verkkoprojektiin.

Kirjasinperheiden lisääminen sekä tyylien ja kirjasimien paksuuksien valitseminen Fonts-sivustosta

Anna Lisää kirjasimia verkkoprojektiin ‑ikkunassa verkkoprojektillesi nimi ja määritä lisättävät kirjasimet.

  1. Napsauta valikkoa ja valitse Luo uusi projekti.
  2. Anna verkkoprojektille nimi.
  3. Valitse lisättävät kirjasimien paksuudet ja tyylit valintaruutujen avulla.
  4. Luo projekti.

Voit tehdä muutoksia projektin asetuksiin Kirjasimien hallinta ‑sivulla myös myöhemmin.

Kuva ponnahdusikkunasta, jossa kirjasimet valitaan niiden lisäämiseksi uuteen projektiin Fonts-sivustosta

Saat seuraavaksi upotuskoodin, jonka avulla voit ladata kirjasimet sivustoosi. Eri vaihtoehdot on selitetty upotuskoodien ohjesivulla, ja oletusarvoinen upotuskoodi toimii hyvin useimmissa projekteissa.

Kopioi upotuskoodi ja lisää se sivustosi <head>-tunnisteeseen.

Kuvassa näkyy kirjasimien upotuskoodi yhdessä kirjasintyylien kanssa.

Sulje verkkoprojektin ikkuna valitsemalla Valmis ja jatka selaamista.  Jos haluat lisätä projektiisi lisää kirjasimia, napsauta toisen kirjasinperheen </>-painiketta ja valitse sitten projektisi nimi valikosta (Luo uusi projekti ‑vaihtoehdon sijaan).

Verkkoprojektin mukauttaminen

Verkkoprojektisi ja kaikki siihen lisäämäsi kirjasimet näkyvät Kirjasimien hallinta ‑sivulla.

Napsauta Muokkaa projektia ‑painiketta, jos haluat muuttaa lisättäviä kirjasimien paksuuksia ja tyylejä, poistaa verkkokirjasinperheen projektista kokonaan tai määrittää font-display-asetuksen. Voit myös muuttaa merkistöä verkkoprojektieditorissa, jossa on määritetty projektin kielituki.  

Itäaasialaiset kirjasimet on toimitettava dynaamisella aliasetuksella, kun taas muilla kirjasimilla on kielipohjaisia aliasetusvaihtoehtoja: Oletus, Kaikki merkit tai mukautettu kielen aliasetus. Kielituki ja aliasetus ‑ohjesivulla on lisätietoja eri vaihtoehdoista.

Voit sisällyttää projektiin mitkä tahansa OpenType-ominaisuudet valitsemalla OpenType-ominaisuudet-valintaruudun. Kun valitset tämän ruudun, näet myös luettelon kyseisen verkkokirjasinperheen käytettävissä olevista ominaisuuksista, kuten ligatuureista, vaihtoehtoisista merkeistä tai kapiteeleista.

Kirjasinnäytön avulla voit määrittää, miten verkkokirjasimet ladataan verkkoselaimeen ja miten niitä käytetään sivustossasi. Lisätietoa näistä vaihtoehdoista on font-display-asetuksia käsittelevällä ohjesivulla.

Kun olet määrittänyt projektin haluamallasi tavalla, tallenna projekti napsauttamalla Tallenna muutokset ‑painiketta. Päivitykset ovat käytettävissä sivustollasi muutaman minuutin kuluessa.

Kirjasimien käyttäminen CSS:ssä

Verkkoprojekti-sivulla on lueteltu CSS:n font-family-nimi, numeerinen paksuus ja projektin kaikkien kirjasimien kirjasintyyli. Käytä näitä font-family-nimiä CSS-tiedostossasi näiden kirjasimien soveltamiseksi tekstiin.

wp-page

Pyydä apua nopeammin ja helpommin

Oletko uusi käyttäjä?