Så här addar du fantastisk typografi i WordPress med Typekit

Har du någonsin undrat hur designers kan använda beautiful custom web fonts på sina webbplatser? Ofta lägger de till customize-teckensnitt i WordPress med hjälp av Typekit, en Adobe-tjänst som ger dig tillgång till högkvalitativa font. I den här artikeln visar vi hur du addar Typekit-fonts i WordPress för att förbättra din typografi.

Varför använda Typekit Fonts?

Typekit är en populär prenumerationsbaserad tjänst för font som kan save you mycket pengar. Istället för att betala för enskilda fontlicenser, som kan bli ganska dyra, kan du få tillgång till hela deras bibliotek med hundratals font gratis eller för ett fast årligt pris.

Typekit-biblioteket är en massiv samling med över 1 000 font. Några av de mest beautiful fonts som du kan hitta på webben är tillgängliga via Typekit, en Adobe-tjänst.

Deras grundläggande gratis plan kommer med tillgång till 230+ fonts, och du kan använda 2 fontfamiljer på en website gratis. Andra planer börjar från $ 49,99 till $ 99,99 per år.

Dessa fantastiska Typekit-fonts kan enkelt addas till vilken website som helst utan att sakta ner sidans laddningshastighet. Fontarna serveras från Adobes CDN och laddas med mycket snabbare hastigheter än om du skulle servera dem på din egen site.

Typekit för WordPress Video Tutorial

Om du inte gillar videoklippet eller behöver fler instruktioner kan du fortsätta att läsa under.

Varför använda Custom Web Fonts på WordPress?

Typografi spelar en avgörande roll i utformningen av din site.

Att välja rätt font kommer att tydligt kommunicera din personlighet och ditt budskap till dina läsare. Oavsett vilken image du vill förmedla – professionell, vänlig, avslappnad, erfaren – kan fonten på din website hjälpa dig att projicera rätt image.

Genom att använda rätt uppsättning font kan du lämna ett bestående intryck. Istället för att gilla alla andra webbplatser på webben, ser din text notice different ut. Genom att välja rätt font för din WordPress site kan du få din website att gå från en enkel design till ett estetiskt tilltalande och fantastiskt konstverk.

Rätt customize webbtypsnitt kan:

• öka konverteringsgraden
• sänka studsfrekvensen på din site
• öka den tid som spenderas på din website
• skapa en minnesvärd upplevelse för användarna

Är du redo att komma igång med Typekit fonts? Så här använder du Typekit för att customize din WordPress-design.

Så här kommer du igång med Typekit

Först måste du skapa ett Typekit account. För att göra detta besöker du bara Typekit .com för att jämföra de tillgängliga planerna.

Du måste välja vilken plan du vill registrera dig för. Den gratis planen limiterar you till en website och ger tillgång till ett begränsat antal fonts. Du kanske vill komma igång med den gratis planen för att prova den, och sedan uppgradera senare. Uppgraderingen ger dig ett större bibliotek med fonts, och du kan använda dem på fler websites.

Nästa steg är att skapa ett kit. Med kitet kan du sätta ihop ett specifikt bibliotek med font och settings för din website, så att Typekit bara hämtar de filer och den kod som behövs. För att skapa ditt kit lägger du till namnet på din site och ditt domain name och klickar sedan på Continue.

När du har fyllt i informationen för ditt kit kommer Typekit att ge dig lite JavaScript-kod som du kan add till din site. Du kan copy and paste den här koden i en textredigerare som Notepad för att save den för tillfället. Vi lägger till den på din site i nästa steg i denna tutorial.

För tillfället kan du börja välja dina fonts. Du kan browsa font-biblioteket och filtrera by alternativ som gillar klassificering, vikt, bredd, x-höjd, och mer.

När du ser ett font som du gillar kan du clicka på det för att få mer details och exempel. Om du gillar att add to det till ditt webbkit klickar du på Web Use: Add to Kit -knappen på höger sida.

Detta kommer att visa en popup-fönster där du måste add to den font du valt till det kit du just skapat.

Nu kan du klicka på knappen Publicera för att spara ändringarna i ditt kit.

Nu är allt klart! Your font kit är nu redo att användas.

Lägga till dina Typekit Fonts i WordPress

Det enklaste sättet att add new custom web fonts till din WordPress blogg är att använda ett WordPress Typekit plugin.

Vi rekommenderar pluginet Typekit Fonts for WordPress. När du har installerat och aktiverat pluginet kan du gå till Settings ” Typ ekit Fonts för att konfigurera pluginet.

Först måste du klistra in JavaScript-koden som du sparade tidigare i fältet Typekit embed code. Efter det kan du lägga till CSS-selektorer för att ange var du vill använda fonten på din webbplats.

I screenshoten ovan har vi add to fonten till CSS-väljaren h1.site-title.

Your WordPress theme kan använda olika klasser för olika element. Du måste använda verktyget Inspect Element i din web browser för att ta reda på dessa CSS-klasser. Du kanske också vill kolla in vårt WordPress-genererade CSS-fuskblad för nybörjare för att hjälpa dig att komma igång.

Det var allt! Vi hoppas att den här artikeln hjälpte dig att lära dig hur du lägger till fantastisk typografi i WordPress med Typekit. Du kanske också vill ta en titt på vår guide om hur du lägger till Googles webbtypsnitt i dina WordPress themes.

Om du gillade den här artikeln, vänligen prenumerera på vår YouTube-kanal för WordPress video tutorials. Du kan också hitta oss på Twitter och Facebook.