✅ WEB- och WordPress -nyheter, teman, plugins. Här delar vi tips och bästa webbplatslösningar.

Hur man ändrar teckensnitt i WordPress utan krångel

56

Teckensnitt i WordPress är en avgörande del av ett företags varumärke. Även om vissa kan avfärda typsnitt som irrelevanta, är de för många en viktig del av deras webbplats.

Tillsammans med färger, bilder, logotyper och andra varumärkeselement spelar typsnitt en avgörande roll för ditt varumärkes image och hur kunderna uppfattar ditt varumärke. Eftersom de erbjuder en mängd alternativ är WordPress en av de bästa plattformarna för anpassning.

Trots att det finns många gratis teckensnittsalternativ är det viktigt att veta hur man ändrar teckensnitt i WordPress, vilket kan kräva viss kunskap om CSS-kodning.

Den här artikeln skapad av vårt team på wpDataTables kommer att visa hur du enkelt ändrar teckensnitt i WordPress.

Hur man ändrar teckensnitt i WordPress-teman

Hur man ändrar teckensnitt i WordPress utan krångel

Låt oss titta på följande scenario. Du vill ha olika teckensnittskombinationer för din webbplats, men något hindrar dig från att gå vidare.

Att ändra teckensnitt i teman kan vara utmanande eftersom de vanligtvis kommer med förinställda teckensnitt som används i olika delar av temat. Du måste hitta CSS-skriptet som ställer in typsnittet för det specifika området, oavsett om det är sidfoten, sidhuvudet, brödtexten eller andra delar.

Viss förkodning kommer att krävas om du vill använda ett helt nytt typsnitt. Välj först ett licensierat teckensnitt för din webbplats och ladda sedan upp det till servern. Överst i style.css måste du också definiera teckensnittsfamiljen. Här är ett exempel på hur koden kan se ut:

@font-face {font-family: Museo300;
src: local('Museo300-Regular'),
url("fonts/Museo300-Regular.ttf") format('truetype’);
font-weight: normal;}

Hur man ändrar teckensnitt i WordPress globalt med anpassningsfunktionen

Hur man ändrar teckensnitt i WordPress utan krångel

Det är enkelt att ändra teckensnitt med anpassningsfunktionen. Logga först in på din WordPress-profil och gå till instrumentpanelen, klicka på Utseende och sedan Anpassa.

Ett annat sätt att komma åt detta område är genom att logga in på din WordPress-instrumentpanel, klicka på webbplatsens namn längst upp till vänster och klicka sedan på knappen Anpassa.

Hur man ändrar teckensnitt i WordPress utan krångel

Scrolla sedan ner till vänster och leta reda på fältet där du kan lägga till ytterligare CSS-kod. Klicka på den för att lägga till koden. Här är ett exempel på koden:

* {font-family:"Courier New", Courier, monospace}Copy

När du lägger till * i början kommer det att lägga till typsnittet på hela webbplatsen. När du klistrar in koden ändras den omedelbart. När du är redo att göra ändringarna klickar du på knappen Publicera.

Hur man ändrar teckensnitt i WordPress i specifika områden av temat

Teman kommer med förinställda teckensnitt i olika områden, och du kommer att kräva olika teckensnitt för olika områden på din webbplats, vilket ger anpassningsbarhet. Att identifiera teman inom olika områden är utmanande.

Du hittar ett teckensnitt för kroppen som är skilt från resten, som kan användas för att bestämma teckensnitt som inte definieras av en tagg, klass eller div.

body {font-family: Verdana, Arial, Helvetica, Futura, sans-serif;
font-size: 1em;
padding:0;
margin:0; }

Du hittar förmodligen typsnitten i de olika CSS-klasserna: innehåll, inlägg, inlägg och post-entry.

Lägg till anpassade teckensnitt

Hur man ändrar teckensnitt i WordPress utan krångel

Att lägga till anpassade typsnitt är ett av de bästa sätten att ändra rubriker och bastypsnitt. Gå till Design > Anpassa > Teckensnitt.

Hur man ändrar teckensnitt i WordPress utan krångel

Det är enkelt att byta till ett anpassat teckensnitt. Det finns många fantastiska typsnitt som finns på Google Fonts, Typekit och slutligen med WordPress premiumprenumeration eller högre.

Hur man gör det:

  • Gå till Design >
  • Klicka på Teckensnitt i avsnittet Anpassa. Klicka sedan på rullgardinsmenyn för att se de tillgängliga alternativen under alternativet Rubriker.

Hur man ändrar teckensnitt i WordPress utan krångel

  • Om teckensnitten här inte är synliga, erbjuder temat förmodligen inte möjligheten att ändra teckensnitt till anpassade teckensnitt. Hitta i så fall ett annat tema som erbjuder det här alternativet.
  • Teckensnitt kommer ofta i par, en för rubriker och en för kroppen. För rubriker är det viktigt att välja ett typsnitt som är tilltalande för titlar, widgettitlar, kommentarsrubriker och andra delar av bastypsnittet kommer att vara typsnittet för brödtexten så gör den så läsbar som möjligt.

Hur man ändrar teckensnitt i WordPress utan krångel

  • Du kommer att se en liveförhandsvisning innan du kan välja ett teckensnitt.

Hur man justerar teckenstorlek och stil

Hur man ändrar teckensnitt i WordPress utan krångel

För att justera teckensnittsstilen, klicka på alternativet till vänster om teckensnittet. Du kommer att ha olika stilar tillgängliga, beroende på vilket typsnitt som valts.

För att justera teckenstorleken, gå till storleksalternativet nedan och justera teckenstorleken. Gör det lämpligt för rubriker, eller för kroppen, vilket är enkelt att göra från rullgardinsmenyn.

Hur man ändrar teckensnitt i WordPress utan krångel

WordPress premiumprenumeration eller högre, tillåter ändringar av teckensnittsstorleken i CSS-koden.

Hur man sparar teckensnitt

Hur man ändrar teckensnitt i WordPress utan krångel

När du är klar med anpassningsalternativen sparas typsnittet på två sätt: genom att klicka på Publicera din webbplats eller på Spara utkast.

Efter att ha sparat, vänta ett par minuter tills teckensnitten dyker upp på bloggen. Om de inte dyker upp, försök att rensa webbläsarens cache för att se till att det är den senaste versionen av webbplatsen.

Hur man ändrar teckensnitt

Hur man ändrar teckensnitt i WordPress utan krångel

Så här ändrar du typsnitt i WordPress när du har skapat ett anpassat typsnitt.

Ändra anpassade teckensnitt genom att gå till Design och sedan till Anpassa. Gå sedan till Teckensnitt, välj en annan rubrik eller bastypsnitt. Du kan också byta tillbaka till standardteckensnittet genom att klicka på X, som finns till höger om det anpassade teckensnittsnamnet.

För att slutföra teckensnittsändringarna, klicka på Publicera eller Spara utkast.

Återigen kan det ta några minuter för teckensnitten att dyka upp, och det är viktigt att rensa webbläsarens cache.

Återställa teckensnitt

För att återställa teckensnitt, tryck bara på X bredvid det aktuella teckensnittet du använder.

Hur man sätter teckensnitt i kö

Hur man ändrar teckensnitt i WordPress utan krångel

För att korrekt lägga till teckensnitt för WordPress, måste du ändra olika filer; viktigast av allt, filen functions.php, eller filen function_wp; enqueuer_script och wp_enqueue_style.

Med kodavsnitt ändrar du helt enkelt teckensnittet utan att ange koden i filerna. Lägg bara till dem i rubriken via en funktion.

Hur man ändrar teckensnitt i WordPress utan krångel

Wp_enqueue_script och wp_enqueue_style är liknande filer, så det är bättre att ändra stilfilen, beroende på vad din teckensnittsleverantör erbjuder.

Google Fonts ger typsnitt som stilmallar, så lägg till dem så här:

function add_google_fonts() {

Andra typsnitt, som Adobe Edge Web Fonts, kommer i form av Javascript-filer. Koden skulle se ut så här:

function add_adobe_fonts() {

När du vet var du ska göra teckensnittsändringarna blir den här funktionen enkel.

Hur man ändrar teckenstorlek

Att justera teckenstorleken är grundläggande, helt enkelt genom att justera rubrikstorlekarna. När du använder en visuell redigerare finns alla alternativ under fliken "Paragraph".

Typsnittsstorlekarna styrs vanligtvis av filen style.css, vilket möjliggör åtkomst till teckenstorlekarna.

Att använda rätt rubriker i artiklar är viktigt för att skapa en tillfredsställande användarupplevelse samt göra den mer SEO-vänlig.

Om du tyckte om att läsa den här artikeln om hur du ändrar teckensnitt i WordPress, bör du kolla in den här om hur du laddar ner WordPress mediebibliotek.

Vi skrev också om några relaterade ämnen som hur man hittar sid-ID:t i WordPress, hur man bäddar in en WordPress iframe, hur man eliminerar renderingsblockerande JavaScript och CSS i innehåll ovanför mitten, hur man stoppar en DDoS-attack och hur för att dölja sidtitel i WordPress.

Inspelningskälla: wpdatatables.com

Denna webbplats använder cookies för att förbättra din upplevelse. Vi antar att du är ok med detta, men du kan välja bort det om du vill. Jag accepterar Fler detaljer