Hur man ändrar teckensnitt i WordPress [Det enkla sättet]

Vill du ändra typsnittet som används på din WordPress-webbplats?

Med rätt verktyg är det enkelt att byta typsnitt på din webbplats eller lägga till flera nya teckensnitt. Följ med i den här snabba handledningen, så kommer ett nytt teckensnitt att visas på din webbplats inom de närmaste minuterna.

Hur man använder Easy Google Fonts

Det bästa sättet att ändra teckensnittet på din webbplats är med plugin- programmet Easy Google Fonts.

Denna plugin ger dig tillgång till hundratals olika typsnitt att använda på din webbplats. Innan vi går vidare med pluginet, låt oss ta ett ögonblick för att täcka vad Google Fonts är.

Uppdatering: min nya videohandledning kommer att leda dig genom stegen (den använder en annan plugin än den i den här handledningen).

Prenumerera på tävla teman på Youtube

Vad är Google Fonts?

Google Fonts ger tillgång till hundratals teckensnitt som är gratis att använda på vilken webbplats som helst. För alla webbutvecklare som vill lägga till ett teckensnitt på sin webbplats gör Google Fonts det enkelt.

Om du inte känner till detaljerna i att bygga webbplatser, är det där plugin-programmet Easy Google Fonts kommer in. Det hanterar de tekniska delarna åt dig, så allt du behöver göra är att välja vilka typsnitt du gillar.

Jag fattar? Bra, låt oss lägga till dessa typsnitt!

Skapa din teckensnittskontroll

När du aktiverar plugin-programmet hittar du ett nytt menyalternativ för Google Fonts som lagts till under Inställningar. På den sidan hittar du följande alternativ:

Du kommer senare att tilldela teckensnitt till din "fontkontroll" så att du kan ha flera teckensnittskontroller med olika teckensnitt och inställningar. För nu behöver du bara namnge din teckensnittskontroll.

Lägg till en CSS-väljare

Under kontrollnamnet finns en ruta där du kan definiera de CSS-väljare du vill använda. Om du inte vet vad en CSS-väljare är är det inget problem.

Det finns tre CSS-väljare som har lagts till som standard. Klicka på "x" på varje för att ta bort dem. När du har tagit bort, skriv in en asterisk (*) och tryck på enter. CSS Selectors-inställningen ska nu se ut så här:

Asterisken är en CSS-väljare som riktar in sig på alla HTML-element på webbplatsen. Med andra ord, du har precis sagt till Easy Google Fonts att använda ditt nya typsnitt för all text på webbplatsen.

Tvinga överstyrning av stilar

Jag rekommenderar att du också markerar rutan "Force Styles Override". Detta kommer att säkerställa att det teckensnitt du väljer åsidosätter de teckensnitt som används i temat. Det finns inga nackdelar med att använda det här alternativet, så du kan lika gärna kontrollera det och spara en minut om teckensnitten inte åsidosätter det.

Välj ditt nya typsnitt

Nu när Easy Google Fonts vet vilka delar av din webbplats som ska påverkas kan du tala om för det vilket teckensnitt som ska användas.

Besök Customizer för att börja ditt teckensnittsval (Utseende > Anpassa). Väl där klickar du på det nya avsnittet Typografi.

EGF fungerar utmärkt med temat Period.

Det här avsnittet kommer att avslöja två nya undersektioner: Standardtypografi och Tematypografi. Klicka på avsnittet Tematypografi.

Du kommer nu att se kontrollen du namngav tidigare. Klicka på knappen Redigera teckensnitt för att visa anpassningsalternativen.

Det finns en hel del alternativ, men bara två du behöver redigera.

Ändra skriptet/deluppsättningen

Teckensnitt har teckenuppsättningar utformade för att passa olika språk. Om din webbplats är på engelska, välj det första alternativet, latin.

Om du väljer "Alla delmängder" blir teckensnittsfilerna mycket större och dina laddningstider ökar.

Välj teckensnittsfamiljen

Det är här du äntligen får välja ditt nya typsnitt. När du väljer olika typsnitt kommer du att se din webbplats uppdateras omedelbart.

Även om detta verkligen är ett bra sätt att förhandsgranska och ändra teckensnitt, är det inte ett effektivt sätt att bläddra.

Jag rekommenderar att du besöker Google Fonts som är väldesignat för att bläddra och hitta typsnitt. När du har hittat några typsnitt du gillar, kom tillbaka till din webbplats och prova dem med Easy Google Fonts

Lägga till och anpassa fler teckensnitt

Förhoppningsvis älskar du ditt nya typsnitt nu, men det finns mycket mer du kan göra med Easy Google Fonts.

Kommer du ihåg avsnittet Standardtypografi från tidigare? Du kan använda det för att anpassa dina rubriker och stycken. Dessutom behöver du inte stanna vid att ändra teckensnittsfamiljen, du kan också ändra teckenstorlek och färg också. Och om du är bekväm med vissa CSS-väljare kan du anpassa teckensnittet på vilken enskild del av din webbplats som helst.

Om du har några frågor om att byta teckensnitt med WordPress eller har en begäran om en ny handledning, vänligen lämna en kommentar nedan.