Hvis nettstedet ditt kjører på WordPress, kan det være lurt å tilpasse utseendet og forbedre brukervennligheten. Et av alternativene som er tilgjengelige er å endre fontene. Hvis du bruker temaene som er gitt i WordPress-katalogen, velger nettstedet ditt standard skriftstørrelser og farger som er angitt av designeren.
Du trenger imidlertid ikke holde deg til standardinnstillingene. Hvis du endrer skriftene i WordPress-temaet ditt, kan du sikre at kundene mottar informasjonen etter hensikten, og at de også blir betatt av nettstedets design. Denne artikkelen vil utforske de forskjellige tilnærmingene til å endre fontene på WordPress-nettstedet ditt.
Innholdsfortegnelse
Viktigheten av typografi og skrifttilpasning i WordPress
- Differensiering og unikhet: Har du noen gang sett et nettsted og sagt til deg selv: «Dette ser kjent ut»? Selv om de fleste nettsteder bruker temaer fra WordPress-katalogen, kan du gjøre nettstedet ditt unikt ved å endre skriftstørrelse og farger.
- Hierarki og vektlegging: Du kan etablere hva som kommer før den andre gjennom fontdifferensiering. For eksempel kan du ha større fonter i H1s og mindre i H2s.
- Konsistens og profesjonalitet: Du kan gi WordPress-nettstedet ditt et polert utseende når du bruker en konsistent font hele veien. Du kan også endre skriftfargen for å blande seg med merkefargene dine.
- Tilgjengelighet: Endring av nettstedets eller sidenes skrifttype kan gjøre det lettere for brukere med synshemming eller andre funksjonshemminger å lese innholdet på nettstedet.
Rollen til CSS i skrifttilpasning
WordPress er laget med PHP, MySQL, HTML, CSS og JavaScript. Hvert WordPress-tema har en style.css som styrer den visuelle layouten og utformingen av nettsidene. Du kan dermed implementere skriftendringene du ønsker på WordPress-siden din ved å bruke denne filen.
CSS lar deg endre ting som fontfamilie, størrelse, farge og avstand på WordPress-nettstedet ditt. Grunnleggende CSS-kunnskap er nødvendig for å implementere slike endringer. Du kan imidlertid fortsatt bruke plugins hvis du ikke vil skrive noen CSS-kode.
Nå utforsker vi noen tilnærminger til å endre fonter i WordPress.
WordPress Customizer
Dette er blant de enkleste måtene å endre fonter på WordPress-siden din. Nesten alle temaer som er designet etter WordPress-standarder har innebygde funksjoner som lar deg endre fonter, skriftfarge og skriftstørrelse med noen få klikk.
Noen temaer lar deg bruke WordPress-tilpasningsalternativet. På den annen side har noen begrensede alternativer, noe som tvinger deg til å utforske de andre alternativene vi vil utforske i de andre tilnærmingene.
Sørg for at du er logget på WordPress og følg deretter disse trinnene;
- På venstre side av siden av dashbordet, klikk på rullegardinmenyen og velg «Utseende».
- Klikk på «Tilpass».
NB: Utseendet til WordPress-siden din kan være forskjellig avhengig av temaet du bruker. For mitt tilfelle bruker jeg «GeneratePress Child Developer Theme».
- Når jeg klikker på «Tilpass», får jeg opp en rullegardinmeny der jeg velger «Typografi»
- Du kan nå tilpasse nettstedet ditt for å passe dine behov.
For eksempel kan jeg velge «Body» som endrer «Systemfontene». Standard er «System Stack» og jeg kan velge en som passer mine behov fra rullegardinmenyen.
Temaredaktør
Temaredigeringsfunksjonen lar deg redigere de forskjellige filene i et WordPress-tema. Vårt fokus vil være på style.css-filen da den lar deg tilpasse skriftene.
De nøyaktige trinnene du bør følge kan variere avhengig av temaet du bruker. Jeg bruker fortsatt «GP Developer Child Theme» for demonstrasjonsformål.
Du kan følge disse trinnene;
- På «Meny», klikk «Utseende» og deretter «Theme File Editor»
- Trinnet ovenfor vil åpne style.css-filen der du kan legge til dine foretrukne stiler.
For eksempel, hvis du vil endre skrifttypen på hele nettstedet til kursiv, kan du ha denne koden;
/* Change Font to Italics */
body {
font-style: italic;
}
Du kan også velge den innebygde CSS-editoren for å utføre endringene dine. Klikk på fanen «Ekstra CSS» og skriv CSS-koden din.
For eksempel kan du ha noe sånt som dette;
Klikk på «Publiser»-knappen for å lagre endringene.
Juster skrift for individuelle sider
Denne tilnærmingen lar deg tilpasse en individuell side eller et innlegg på WordPress-nettstedet ditt. Det er et godt valg når du vil at en bestemt side skal skille seg ut fra resten.
Du kan bruke denne tilnærmingen for sider som «Personvernreglene». For eksempel kan jeg endre en viss H1 på siden min «Personvernregler» til å være grønn i fargen og kursiv. For å oppnå dette vil jeg følge disse trinnene;
- Naviger til dashbordet mitt og klikk på «Alle sider».
- Jeg velger målsiden min «Personvernregler» og klikker «rediger»
- Klikk på «Tekst» i stedet for «Visuell» -fanen som vist i dette skjermbildet
Dette er koden jeg har lagt til;
<h1 style="font-style: italic; color: green;">Heading For Demonstration Purposes</h1>
Når siden er gjengitt, vil den se ut som følger;
Bruk plugins
Hvis du ikke er teknisk kunnskapsrik eller ikke elsker koding, kan du bruke forskjellige font-plugins for å endre skriftene. Prosessen med å endre fonter vil variere fra en plugin til en annen.
For å begynne å bruke font-plugins, gå til WordPress-dashbordet og velg «Plugins» og deretter «Add New».
Du kan nå bruke «søkeplugin»-funksjonen for å velge målplugin.
Dette er noe av det beste du kan bruke;
#1. Seed-fonter
Seed-fonter er en font-plugin som lar deg bruke nettfonter. Plattformen har fem ferdiggenererte thai-engelske nettfonter som du kan bruke. Du kan også bruke Google-fonter eller laste opp egendefinerte. Seed-fonter er en åpen kildekode-plugin og er gratis å bruke.
#2. Bruk hvilken som helst skrifttype
Bruk hvilken som helst skrifttype lar deg laste opp alle tilpassede fonter til WordPress-siden din selv uten CSS-kunnskap. Du har også muligheten til å velge fra den 23 871+ forhåndsdefinerte skriftsamlingen. Det eneste kravet er at skriftene dine skal være i formatene ttf, otf eller woff.
Last opp skriftene dine i ett format, og plugin-modulen vil automatisk generere alle de andre formatene den trenger. Use Any Font fungerer på alle moderne nettlesere og varierende skjermstørrelser.
#3. Fonts Plugin
Fonts Plugin er en plugin som lar deg bruke over 1455 unike fonter i Google Fonts-biblioteket. Programtillegget har en forhåndsvisningsfunksjon som lar deg forhåndsvise hvordan skriftene vil vises på nettstedet ditt før du tar i bruk endringene.
Fonts Plugin fungerer med alle WordPress-temaer, og du trenger ingen kodekunnskap for å begynne å bruke den. Hvis du er fortrolig med CSS, kan du lage tilpassede velgere og kontrollere hvordan fonter skal vises på WordPress-siden din.
#4. MW Font Changer
Pluginene vi har dekket så langt fokuserer på å endre hele nettstedets fonter. Du kan imidlertid søke en bedre opplevelse som nettstedets eier/designer. MW Font Changer lar deg endre skriftene på dashbordet og temaet.
Det er en brukervennlig plugin med 30+ fonter. For å endre fontene på temaet ditt, skriv inn tema-ID og klasse. MW Font Changer har 10 000+ aktive installasjoner og er kompatibel med WordPress 5.0 og høyere. Denne plugin-en er åpen kildekode-programvare.
Hvordan optimalisere skrifter på WordPress
En god nettside bør lastes raskt. Du har kanskje det raskeste temaet i WordPress-katalogen. Men å legge til mye multimedia og fonter kan redusere lastehastigheten. Den eneste måten å unngå dette på er ved å optimalisere skriftene dine. Dette er noen av de beste tilnærmingene;
- Last opp flere filtyper: Du kan lagre skriftene dine i forskjellige formater. Du kan laste opp forskjellige formater og nettleseren vil velge det beste basert på funksjoner som brukerens skjermstørrelse og operativsystem.
- Last opp kun tegnene du trenger: Hvis du har fonter som du ikke vil bruke mye på nettstedet ditt, kan du bare laste opp tegnene du trenger i stedet for hele biblioteket.
- Vær vert for skriftene dine på CDN-er: Prosessen med å laste opp egendefinerte skrifter kan øke størrelsen på WordPress-nettstedet ditt. Content Delivery Networks (CDN) lar deg være vert for skriftene på en ekstern server og bare koble dem til WordPress-nettstedet ditt.
- Bruk WordPress-caching: WordPress-cache lagrer ofte brukte data av en bruker og leverer dem til en bruker i fremtiden når de besøker nettstedet på nytt. En slik tilnærming øker lastehastigheten.
Vanlige spørsmål
Hvordan kan jeg velge de riktige skriftene for WordPress-siden min?
Det er flere ting å vurdere. Du må for eksempel vurdere merkevarebildet ditt, det generelle designet og målgruppen.
Trenger du å kunne koding for å endre fonter i WordPress?
Nei. WordPress er designet for å være enkelt å bruke for ikke-teknologiske. Du kan endre skriftene fra WordPress-dashbordet uten å skrive en eneste linje med kode. Du kan også bruke ulike plugins for å implementere ulike endringer. Men hvis du kan CSS, kan du legge til tilpasset CSS på WordPress-siden din for å endre skriftene.
Kan du endre fonter i bestemte områder av WordPress-nettstedet ditt?
Ja. Du kan endre skrifttyper i bestemte områder som en side eller til og med et enkelt innlegg. Hvis du ikke er fortrolig med koding, kan du bruke den visuelle tilnærmingen. På den annen side kan du bruke teksttilnærmingen hvis du vet hvordan du skal kode.
Kan jeg gå tilbake til de originale skriftene for WordPress-temaet?
Ja. Hvis du endrer skriftene og føler at du trenger å gå tilbake til originalen, kan du alltid endre. Bare gå tilbake til tilpasseren på dashbordet og gjenopprett skriftene til standardinnstillingene.
Konklusjon
Du har nå flere tilnærminger du kan bruke til å endre fonter på WordPress-nettstedet ditt for å forbedre designet. Valget av tilnærming vil avhenge av dine ferdigheter og preferanser. Noen ganger kan du bruke mer enn én tilnærming, avhengig av arten av nettstedet du oppretter.
Du kan også utforske hvordan CSS-synlighet forbedrer webdesignet ditt med skjulte perler.