Onko sinulla ongelmia, kun yrität vaihtaa fonttia WordPress-teemassa?
Verkkosivustosi typografia on ratkaisevan tärkeää sekä sen brändäyksen että käytettävyyden kannalta, joten oikean kirjasintyypin valinta on tärkeää.
Onneksi suurin osa WordPress-teemoista sisältää mahdollisuuden vaihtaa fontteja, vaikka jotkut ovatkin tässä suhteessa joustavampia kuin toiset. Lisäksi saatavilla on laajennuksia, joita voidaan käyttää minkä tahansa teeman kanssa.
Aloitamme tämän viestin osoittamalla, kuinka voit käyttää teeman sisäänrakennettuja vaihtoehtoja fontin vaihtamiseen WordPress-teemassa.
Lisäksi, jos teemasi ei vielä sisällä haluamiasi fontteja, jaamme ilmaisia lisäosia, joiden avulla voit lisätä kirjasinvaihtoehtoja mihin tahansa WordPress-teemaan, vaikka siitä puuttuisikin joustavia sisäänrakennettuja vaihtoehtoja.
Esittelemme myös, kuinka WordPress-editorilla muokataan tietyissä sisällöissä käytettyjä fontteja.
1. Fontin vaihtaminen WordPress-teemassa WordPress-muokkaustyökalun avulla
Löydät yleensä teeman kirjasinvaihtoehdot alkuperäisestä WordPress Customizerista, jossa suurin osa WordPress-teemoista vuonna 2022 perustuu tyylin ja suunnittelun mukauttamiseen.
Näytämme, kuinka näitä sisäänrakennettuja kirjasinvaihtoehtoja käytetään käyttämällä mukautuvaa Neve-teemaa esimerkkinä tässä ensimmäisessä osassa.
On tärkeää muistaa, että jokainen teema käsittelee asioita hieman eri tavalla. Neve on myös melko mukautuva teema, joten on hyvä mahdollisuus, että teemallasi ei ole niin monta fonttivaihtoehtoa.
Tästä huolimatta sinun pitäisi pystyä seuraamaan tätä menetelmää minkä tahansa teeman kanssa ja ainakin pääsemään joihinkin kirjasinvaihtoehtoihin.
Avaa WordPress Customizer
Aloita siirtymällä kohtaan Ulkoasu → Mukauta ja avaa WordPress-muokkaus:
Etsi fontin/typografian asetukset
Etsi seuraavaksi teemasi fontti-/typografia-asetukset. Valitettavasti ne sijaitsevat eri tavalla jokaisessa teemassa, joten saatat joutua selaamaan eri asetusosioita.
Löydät Neve-teeman huipputason vaihtoehdon nimeltä Typography; napsauta sitä valitaksesi sen.
Valitse fontit ja tallenna muutokset
Nyt voit päättää, miten edetä. Teemasta riippuen saatat nähdä typografia-asetusten lisäjaon sisällön tyypin mukaan. Neve-teema tekee näin:
Voit esimerkiksi avata teemasi otsikoiden (kuten viestin tai sivun otsikon) kirjasinasetukset ja vaihtaa WordPress-kirjasimen. Näet, että Neve-teemaa käytettäessä on saatavilla useita fontteja:
Teeman live-esikatselun fonttien pitäisi päivittyä automaattisesti, kun teet valinnat.
Saat uudet kirjasinvalinnat käyttöön napsauttamalla sinistä Julkaise-painiketta, kun olet tyytyväinen siihen, miltä kaikki näyttää.
2. Google-fonttien lisääminen mihin tahansa WordPress-teemaan
Jos noudatit yllä olevaa opetusohjelmaa kirjasinten vaihtamisesta WordPress-teemassa ja olet hämmentynyt teemasi sisäänrakennetuista kirjasinvaihtoehdoista, käytä laajennusta, joka antaa sinulle pääsyn useampaan kirjasinvaihtoehtoon, erityisesti tuhansiin kirjasinvaihtoehtoihin. kirjasimia Google-luettelossa, on hyvä varavaihtoehto.
Ilmainen Easy Google Fonts -laajennus on yksi suosituimmista täällä saatavilla olevista vaihtoehdoista.
Voit valita yli 600 ilmaisesta kirjasimesta, joita Google Fonts tarjoaa käyttämällä Helppo Google-fontti, joka integroituu mihin tahansa WordPress-teemaan.
Tuntemattomille Google Fonts on luultavasti tunnetuin ilmaisten kirjasinten lähde ja tarjoaa enemmän kuin tarpeeksi valikoiman suurimmalle osalle verkkosivustoista.
Siirrymme Twenty Twenty One -oletusteemaan (jossa on hyvin perustason typografian säätimet) näyttääksemme, miten tämä toimii, ennen kuin määrität laajennuksen lisäämään fonttivaihtoehtoja.
Asenna ja aktivoi laajennus
Aloita asentamalla ja aktivoimalla Easy Google Fonts -laajennus WordPress.orgista. Jos et ole varma, kuinka tämä tehdään, voit käyttää WordPress-laajennuksen asentamiseen tarkoitettua sny-opasta.
Valitse käytettävät Google-kirjasimet
Tämän jälkeen on valittava fontit, joita haluat käyttää. Google Fonts -sivusto helpottaa kaikkien vaihtoehtojen selaamista, koska näet siellä kunkin kirjasimen esikatselun, vaikka voit käyttää koko luetteloa laajennuksen asetuksista.
Jos tarvitset ideoita, tutustu suosituimpiin Google-kirjasimiin. Lisäksi sinun tulee yleensä valita vähintään kaksi toisiaan täydentävää fonttia.
Kun löydät haluamasi fontin, muista kirjoittaa sen nimi muistiin, jotta voit muistaa sen myöhemmin. Valitse myös haluamasi tyylit. Esimerkkinä "Keskitaso 500".
Avaa WordPress Customizer ja muokkaa fontteja.
Pääset WordPress-muokkaustyökaluun siirtymällä WordPress-hallintapaneelin kohtaan Ulkoasu > Mukauta.
Sivupalkin valikon yläosassa pitäisi nyt olla "typografia"-osio. Näitä asetuksia hallitsee Easy Google Fonts -laajennus, ei teemasi:
Valitse alivalikosta Oletustypografia.
Sivustosi erityyppiselle sisällölle voit nyt valita fontin Google Fontsista:
- Kappaleet – teksti sivujen/viestien sisällä.
- Otsikko 1 – blogitekstisi/sivusi otsikko.
- Otsikko 2 – viestisi/sivusi ylätason otsikko.
- Otsikko 3 – alaotsikko otsikon 2 alla.
Napsauta Muokkaa fonttia sen sisällön kohdalla, jota haluat muuttaa. Voit valita fontin nimen ja painon. Sinun pitäisi nähdä sivustosi päivityksen live-esikatselu, kun teet päätöksiäsi.
Kun olet tyytyväinen valintoihin, julkaise uudet kirjasimet napsauttamalla Julkaise.
3. Kuinka muuttaa WordPress-fontteja editorissa
Osoitimme, kuinka voit muuttaa koko verkkosivustosi WordPress-teeman fonttia kahdella yllä mainitulla menetelmällä. Toisin sanoen koko sivustosi kappaleteksti muuttuu, jos muutat kappaletekstin fonttia.
Joskus voi kuitenkin olla, että joudut muuttamaan vain yhden sisältöosan fontteja.
Käytä ilmaista "Fonts Plugin" -laajennusta määrittääksesi tämän (jolla voit myös lisätä mukautettuja kirjasimia WordPress-teemaan, aivan kuten Easy Google Fonts -laajennus edellisessä osiossa).
Saat uuden Google Fonts -lohkon, jonka avulla voit lisätä tekstiä millä tahansa Google-kirjasimella, kun olet asentanut ja aktivoinut ilmaisen laajennuksen. Lisäksi voit valita otsikoita tai kappaletekstejä käyttämällä lohkoasetuksia:
Kuinka vaihtaa fonttia WordPress-teemassa
Sinun pitäisi pystyä muokkaamaan fonttia WordPress-teemassa tässä vaiheessa.
WordPress Customizerin sisäänrakennettuja typografiavaihtoehtoja voidaan käyttää, jos sinulla on jo asennettu joustava teema, kuten Neve.
Jos teemassasi ei ole monia sisäänrakennettuja vaihtoehtoja, voit myös lisätä tuen yli 600 Google Fonts -kirjasimelle käyttämällä Easy Google Fonts -laajennusta (tai Fonts Plugin -laajennusta, jonka näytin sinulle bonusosiossa).
Katso missä tahansa oppaassa, miten se tehdään muuntaa minkä tahansa WordPress-teeman räätälöityyn sivustoon, josta saat lisäehdotuksia teemasi personoimiseen ja brändäämiseen.
Jos haluat nähdä tämän oppaan videona, voit napsauttaa alla olevaa videota.
Haluatko nopean verkkosivuston?
Ketä minä vitsailen? Emmekö me kaikki?
Joten miksi niin monet meistä kamppailevat?
Suurin haaste on yleensä nopean ja luotettavan hosting-yrityksen löytäminen.
Olemme kaikki käyneet läpi painajaisia - tuki kestää ikuisuuden tai ei ratkaise ongelmaamme aina syyttämällä jotain sinun puolellasi...
Mutta suurin ongelma on, että verkkosivusto tuntuu aina hitaalta.
At CollectiveRay isännöimme InMotion-isännöinnillä ja verkkosivustomme on typerä ja nopea. Käytämme mukautettua LightSpeed-palvelinasennuspinoa MariaDB:ssä PHP7.4-moottorilla ja Cloudflaren kautta.
Yhdessä käyttöliittymäoptimointiemme kanssa palvelemme luotettavasti 6000 käyttäjää joka päivä, yli 50 samanaikaisen käyttäjän huipulla.
Haluatko saada nopean asennuksen kuten meidän? Siirrä sivustosi ilmaiseksi InMotion-isännöintiin ja saat 50 %:n alennuksen nykyisestä hinnasta.
Vaihda fonttia WordPress-teeman usein kysytyissä kysymyksissä
Kuinka voin muuttaa kirjasinkokoa WordPressissä ilman CSS:ää?
Voit muuttaa useimpien teemojen fontteja WordPress-teeman mukauttajalla. Teeman mukauttaja, joka löytyy kohdasta Ulkoasu » Mukauta, ja on paras työkalu tähän. Voit ehkä muuttaa fonttikokoa joissakin WordPress-teemoissa. Voit käyttää sitä kirjoittamatta CSS-koodia, jos löydät tämän vaihtoehdon.
Kuinka voin muuttaa fonttityyliä HTML:n avulla?
Voit käyttää tyylinen omaisuus HTML:ssä muuttaaksesi tekstin kirjasintyyliä HTML:n avulla. Elementin rivityyli määritetään tyyliominaisuuden kautta. Attribuuttia käytetään CSS-ominaisuuksien font-family, font-size, font-style ja HTML-koodin kanssa. tag. HTML5 ei tue tagia, joten sen sijaan käytetään CSS-tyyliä fontin muokkaamiseen.
Ole hyvä Jätä hyödyllinen kommentoi ajatuksiasi ja jaa tämä sitten Facebook-ryhmissäsi (ryhmissä), jotka pitävät tätä hyödyllisenä, ja hyödynnetään yhdessä. Kiitos jakamisesta ja mukavuudesta!
Disclosure: Tämä sivu voi sisältää linkkejä ulkoisille sivustoille tuotteille, joita rakastamme ja kannatamme sydämestämme. Jos ostat suosittelemiamme tuotteita, saatamme ansaita viittausmaksun. Tällaiset maksut eivät vaikuta suosituksiimme, emmekä hyväksy maksuja positiivisista arvosteluista.
ja paljon muuta ...