Vill du lägga till anpassade typsnitt i WordPress? Anpassade typsnitt förbättrar din webbplats typografi och användarupplevelse genom att låta dig använda ett brett utbud av vackra typsnitt.
På WPBeginner har vi lagt till anpassade typsnitt på många av våra partnerwebbplatser, så vi vet hur mycket de kan förbättra en webbplats visuella attraktionskraft.
Förutom att se bra ut kan anpassade teckensnitt också hjälpa dig att förbättra läsbarheten, skapa en varumärkesbild och öka tiden användare spenderar på din WordPress-webbplats.
I den här artikeln visar vi hur du lägger till anpassade typsnitt i WordPress med hjälp av Google Fonts, TypeKit och CSS3 @Font-Face-metoden.
Notera: Att ladda för många typsnitt kan sakta ner din webbplats. Vi rekommenderar att du väljer två typsnitt och använder dem över hela din webbplats. Vi kommer också att visa dig hur du laddar dem korrekt utan att sakta ner din webbplats.
Innan vi tittar på hur man lägger till anpassade teckensnitt i WordPress, låt oss titta på hur man hittar anpassade teckensnitt som du kan använda.
Hur man hittar anpassade typsnitt att använda i WordPress
Typsnitt brukade vara dyra, men inte längre. Det finns många platser att hitta bra gratis webbtypsnitt som Google Fonts, Adobe Fonts (tidigare Typekit), FontSquirrel och fonts.com.
Om du inte vet hur du blandar och matchar typsnitt, prova Font Pair. Det hjälper designers att para ihop vackra Google-typsnitt tillsammans.
När du väljer dina typsnitt, kom ihåg att användning av för många anpassade typsnitt kommer att sakta ner din webbplats. Det är därför du bör välja två typsnitt och använda dem genom hela din design. Detta kommer också att ge konsekvens åt din WordPress-design.
Med det sagt, låt oss titta på hur man lägger till anpassade teckensnitt i WordPress. Detta är vad vi kommer att täcka i den här handledningen:
- Lägga till anpassade teckensnitt i WordPress från Google Fonts
- Lägga till anpassade teckensnitt i WordPress med Adobe Fonts
- Lägga till anpassade fonter i WordPress med CSS3 @font-face
Lägga till anpassade teckensnitt i WordPress från Google Fonts
Google Fonts är det största, gratis och mest använda typsnittsbiblioteket bland webbutvecklare. Det finns flera sätt att lägga till och använda Google Fonts i WordPress.
Metod 1: Lägga till Google-teckensnitt med ett WordPress-plugin
Om du vill lägga till och använda Google Fonts på din webbplats, är denna metod den absolut enklaste och rekommenderas för nybörjare.
Det första du behöver göra är att installera och aktivera pluginet Google Fonts Typography. För mer information, se vår steg-för-steg-guide om hur man installerar ett WordPress-plugin.
Erbjudande: Om du vill skaffa premiumversionen av pluginet, se till att använda vår Google Fonts för WordPress-kupong för 20% rabatt. Detta låter dig ändra teckensnittsfärg och storlek i ditt WordPress-tema och mer.
Vid aktivering får du möjlighet att ange din e-postadress för att få den officiella snabbstartsguiden.
Därefter behöver du klicka på Typsnitt Plugin » Anpassa typsnitt i sidofältet för administratören.
Detta tar dig automatiskt till WordPress temaanpassare, och öppnar automatiskt den nya sektionen 'Fonts Plugin'.
Här kan du välja standardteckensnitten för din webbplats i avsnittet 'Grundinställningar' och teckensnitt för specifika delar av din webbplats under 'Avancerade inställningar'.
Låt oss börja med att klicka på ‘Grundinställningar’. Härifrån kan du välja typsnitt för ditt innehåll, rubriker, knappar och fält.
Menyn 'Font Family' låter dig välja ett nytt typsnitt. Du hittar standardtypsnittet högst upp, sedan systemtypsnitten och slutligen en enorm lista med över 1455 Google-typsnitt.
När du väljer ett nytt teckensnitt ändras förhandsgranskningen automatiskt för att visa hur det ser ut.
Nu kan du använda pluginets avancerade inställningar för att finjustera dina typsnittsval.
Du måste klicka på bakåtpilen '<' längst upp till vänster på sidan och sedan klicka på avsnittet 'Avancerade inställningar'.
Här hittar du inställningar för de olika sektionerna på din webbplats, såsom webbplatsens titel, navigeringsmeny, innehållsområde, sidofält och sidfot.
Till exempel ger avsnittet 'Innehåll' dig alternativ för att ändra typsnittet för dina olika rubriknivåer och citat.
Du kan välja de anpassade typsnitt du vill använda från rullgardinsmenyerna.
Du kan välja anpassade teckensnitt för ditt sidofältsområde på ett liknande sätt.
Klicka helt enkelt på bakåtpilen och gå till inställningarna för 'Sidofält'. Där hittar du rullgardinsmenyer för att välja teckensnitt för dina sidofältsrubriker och innehåll.
När du är nöjd med dina anpassade fontval, glöm inte att klicka på knappen ‘Publicera’ för att spara dina ändringar.
Metod 2: Lägga till Google-typsnitt manuellt i WordPress
Den här metoden kräver att du lägger till kod i dina WordPress-temafiler. Om du inte har gjort det tidigare, se vår guide om hur du kopierar och klistrar in kod i WordPress.
Besök först Google Fonts-biblioteket och välj ett teckensnitt som du vill använda. På teckensnittsidan ser du de stilar som finns tillgängliga för det teckensnittet.
Välj de stilar du vill använda i ditt projekt och klicka sedan på knappen 'Visa valda familjer' högst upp.
Detta öppnar en sidopanel där du kan kopiera inbäddningskoden.
Det finns två sätt att lägga till den här koden på din WordPress-webbplats.
Först kan du redigera din temas header.php-fil och klistra in koden före <body>-taggen.
Men om du inte är bekant med kodredigering i WordPress kan du använda ett plugin för att enkelt lägga till denna kod.
Installera och aktivera helt enkelt pluginet WPCode. För mer information, se vår steg-för-steg-guide om hur man installerar ett WordPress-plugin.
Efter aktivering, gå till sidan Kodavsnitt » Sidhuvud & Sidfot och klistra in inbäddningskoden i rutan 'Sidhuvud'.
Glöm inte att klicka på knappen ‘Spara ändringar’ för att spara dina ändringar. Pluginet kommer nu att börja ladda Google Fonts inbäddningskod på alla sidor på din webbplats.
Du kan använda detta typsnitt i ditt temas stilmall som denna:
.h1 site-title {
font-family: 'Open Sans', Arial, sans-serif;
}
För att lära dig mer, se vår guide om hur du lägger till Google-teckensnitt i WordPress-teman.
Lägga till anpassade teckensnitt i WordPress med Adobe Fonts
Adobe Fonts, tidigare känt som Typekit, är en annan gratis och premiumresurs för fantastiska typsnitt som du kan använda i dina designprojekt. De har en betald prenumeration samt en begränsad gratisplan som du kan använda.
Registrera dig helt enkelt för ett Adobe Fonts-konto och besök sektionen 'Bläddra bland typsnitt'. Härifrån behöver du klicka på knappen </> för att välja ett typsnitt och skapa ett projekt.
Därefter ser du inbäddningskoden med ditt projekt-ID. Den visar också hur du använder teckensnittet i ditt temas CSS.
Du måste kopiera den här koden och klistra in den i <head>-sektionen på din webbplats.
Det finns två sätt att lägga till den här koden på din WordPress-webbplats.
Först kan du redigera din temas header.php-fil och klistra in koden före <body>-taggen.
Om du däremot är ovan vid kodredigering i WordPress kan du använda ett plugin för att lägga till denna kod. Installera och aktivera helt enkelt det kostnadsfria WPCode-pluginet.
Vid aktivering, gå till sidan Kodavsnitt » Sidhuvud & Sidfot och klistra in inbäddningskoden i rutan 'Sidhuvud'. Klicka sedan på knappen 'Spara ändringar'.
Det är allt. Du kan nu använda Typekit-teckensnittet du valde i din WordPress-temas stylesheet så här:
h1 .site-title {
font-family: gilbert, sans-serif;
}
För mer detaljerade instruktioner, kolla in vår handledning om hur du lägger till fantastisk typografi i WordPress med Adobe Font (Typekit).
Lägga till anpassade fonter i WordPress med CSS3 @font-face
Det mest direkta sättet att lägga till anpassade typsnitt i WordPress är genom att lägga till typsnitten med CSS3 @font-face-metoden. Den här metoden låter dig använda vilket typsnitt du vill på din webbplats.
Först måste du ladda ner teckensnittet du gillar i ett webbformat. Om du inte har webbformatet för ditt teckensnitt kan du konvertera det med FontSquirrel Webfont Generator.
När du har webbtypsnittsfilerna måste du ladda upp dem till din WordPress-värdserver. Bästa stället att ladda upp typsnitten är inuti en ny mapp "fonts" i ditt tema eller barn-temas katalog.
Du kan använda FTP eller Filhanteraren i din cPanel för att ladda upp typsnittet.
När du har laddat upp typsnittet måste du ladda typsnittet i ditt temas stilmall med CSS3 @font-face-regeln som denna:
@font-face {
font-family: Arvo;
src: url(http://www.example.com/wp-content/themes/your-theme/fonts/Arvo-Regular.ttf);
font-weight: normal;
}
Glöm inte att ersätta typsnittsfamiljen och URL:en med din egen.
Därefter kan du använda det teckensnittet var som helst i din temas stilmall så här:
.h1 site-title {
font-family: "Arvo", Arial, sans-serif;
}
Att ladda typsnitt direkt med CSS3 @font-face är inte alltid den bästa lösningen. Om du till exempel använder ett typsnitt från Google Fonts eller Typekit är det bäst att leverera typsnittet direkt från deras server för optimal prestanda.
Vi hoppas att den här handledningen hjälpte dig att lära dig hur du lägger till anpassade typsnitt i WordPress. Du kanske också vill lära dig hur du anpassar färger på din WordPress-webbplats, eller kolla in vår lista över de bästa dra-och-släpp WordPress-sidbyggarna.
Om du gillade den här artikeln, prenumerera då på vår YouTube-kanal för WordPress-videoguider. Du kan också hitta oss på Twitter och Facebook.
Dennis Muthomi
Jag har använt Google Fonts Typography-pluginet som nämns i Metod 1 för mina klienter och det har varit en livräddare. En sak att kanske överväga är hur din webbplats laddningshastighet påverkas. Att välja en delmängd av teckensnittet (t.ex. endast latinska tecken) kan göra stor skillnad i laddningstider samtidigt som du fortfarande får det utseende du vill ha.
WPBeginner Kommentarer
Renderinghastigheten skulle vara densamma i båda fallen.
Kushal Phalak
Jag kan inte vara utan anpassade typsnitt. Det är som om något känns ofullständigt om jag inte använder anpassade typsnitt. Som designer och utvecklare vill jag att mina varumärken ska vara minutiöst utformade eftersom det är det viktigaste steget, och om jag använder något typsnitt, känns det inte bra. Jag vet att vissa standardtypsnitt är bra, men jag hittar inte tillräckligt med variation i dem. I wordpress antar jag att den här funktionen borde vara inbyggd, eftersom det kommer att spara extra besvär att lägga till anpassade typsnitt.
WPBeginner Support
It would depend on the theme but maybe in the future there will be an easier way
Admin
Jiří Vaněk
Tack för den användbara artikeln. Vårt språk har vissa egenheter och särdrag. Det tjeckiska språket använder bokstäver som ěščřž. Ibland är det mycket problematiskt att hitta ett typsnitt som tar hänsyn till dessa tecken och inte visar dem annorlunda. Därför tackar jag dig för den här guiden, som äntligen kommer att hjälpa mig att lösa det eviga problemet med att skriva på tjeckiska.
Jozef Fekete
As a Slovak I know exactly what you are talking about
In cases like this, it is advisable to use a filter to make searching for a suitable font easier. For example, look for fonts in the “Latin extended” category that support Czech and Slovak language.
Jiří Vaněk
Det är bra råd. Tack för det. Jag har redan spårat några av bokstäverna. Vissa kunder är dock inte nöjda med dem och vill ha en dekorativ. Jag ska prova ditt sökningstips.
Moinuddin Waheed
Det finns många Google-typsnitt som är mycket bra och används av många topputvecklare.
Jag har varit ett fan av Poppins och Roboto ett tag och har använt dem på mina statiska webbplatser och även på WordPress-webbplatser.
Jag har sett folk säga att man ska använda Google-typsnitt från ett lokalt bibliotek,
Jag vet inte vad det betyder?
De hävdar att hämtning från servern kan sakta ner webbplatsens hastighet.
Om så är fallet, hur kan vi lägga till dessa typsnitt från vårt eget lokala bibliotek med tanke på att det är Google-typsnitt?
WPBeginner Support
Pluginet från vår guide har ett alternativ för att hosta typsnittsfilen lokalt. När du inte hostar filen lokalt innebär det att dina användare skulle behöva vänta på att typsnittet hämtas från Google för att se det typsnittet på din webbplats.
Admin
Moinuddin Waheed
Tack för guiden för att behålla typsnitten lokalt.
Att behöva hämta från Google är inte en så bra idé för hastighetens skull. Jag kommer att tänka på det när jag använder Google-typsnitt för att behålla det lokalt.
Jiří Vaněk
Om ett teckensnitt används lokalt, betyder det att det lagras på webben. Det vill säga, på FTP precis som WordPress. Detta beror på att WordPress annars måste gå till Googles servrar för teckensnitt och detta saktar ner webbplatsens svarstid. Dessutom kan det hända att Googles servrar för tillfället är långsamma och detta påverkar hastigheten. Om du lägger din webbplats på ett mätverktyg som pagespeed insight eller gtmetrix, kommer du att se hur lång tid det kan ta att ladda teckensnitt från Googles servrar. Därför är det en vanlig praxis att ladda upp teckensnitt lokalt till webbplatsen, vilket förbättrar både webbplatsens responsivitet och mätvärden. Jag har gjort det på det sättet också.
Ahmed Omar
Tack än en gång för en användbar artikel.
Vet du varför mitt teckensnitt visas korrekt på bärbar dator men inte på mobiltelefon?
WPBeginner Support
Den mest troliga anledningen skulle vara om ditt tema åsidosätter stil för mobila enheter. Om du kontrollerar med ditt temas support bör de kunna hjälpa till.
Admin
Brayden Fraser
Du borde ha sagt att man behövde vara en affärsmedlem i Wordpress för att göra detta. Vilseledande.
WPBeginner Support
Allt vårt innehåll är för WordPress.org-sajter, du är på WordPress.com, du kan se vår jämförelse mellan de två i vår artikel nedan:
https://www.wpbeginner.com/beginners-guide/self-hosted-wordpress-org-vs-free-wordpress-com-infograph/
Admin
Tarun Kashyap
Vilket typsnitt använder du på den här webbplatsen? Det ser väldigt attraktivt ut
WPBeginner Support
We’re currently using Proxima Nova
Admin
Joshua
Kan du snälla berätta hur du gör så vackra animerade foton för din blogg? Vilken programvara använder du?
WPBeginner Support
There are multiple tools, for the moment you may want to take a look at Recordit for an option for creating a GIF
Admin
Manuel
Tack så mycket, jag försökte med @font-face i WordPress men typsnittet visades inte, så jag följde rekommendationerna att placera typsnitten inuti temakatalogen och vips!
WPBeginner Support
Glad our recommendation could help
Admin
Roshni Kanchan
Tack än en gång för en användbar artikel.
Vet du varför mitt teckensnitt visas korrekt på bärbar dator men inte på mobiltelefon?
WPBeginner Support
Ditt specifika tema kan ha enhets-specifik CSS som skriver över teckensnittet du har lagt till. Om du kontrollerar med ditt temas support bör de kunna informera dig.
Admin
Vlad
Tack så mycket!
WPBeginner Support
You’re welcome
Admin
Katherine
Tack för att du gjorde denna enkla video. Fixade mitt typsnitt på några minuter med den andra metoden. Du räddade mig mycket tid med att krångla med min temakod. Mycket uppskattat!
WPBeginner Support
Hej Katherine,
Varsågod. Vi är glada att du fann det hjälpsamt.
Admin
Eller
Hej, mitt teckensnitt är inte ett Google-teckensnitt. Jag laddade upp det med font face, men jag ser det inte i min temas anpassningsverktyg. Några råd?
giri
Hej, jag fick absolut massor av värde från ditt inlägg. Snälla, jag har 2 snabba frågor.
1. Vilket är antalet plugins som varje bloggare inte borde överskrida? Jag har för närvarande cirka 18 installerade, skulle du anse det antalet vara orimligt. Kan du snälla också kolla in min sida och ge mig en
2. Ditt typsnitt är verkligen vackert. Skulle du föreslå plugins som skulle ge mig vackra typsnitt precis som dina?
Slutligen, skulle du avvara några seko
WPBeginner Support
Hej Giri,
1. Se vår artikel om hur många WordPress-plugins du bör installera på din webbplats.
2. För teckensnitt, se bästa typografiplugin för WordPress.
Admin
Roshani
Jag har laddat upp anpassade teckensnitts-URL:er i font-face men det visar ett 404-fel i utvecklarverktygen. Innan webbsidan laddas visas normala teckensnitt.
Vänligen hjälp mig med detta
Chamnan
Jag har problem med Khmer-teckensnittet när jag använder Google Font. Problemet är att en del av texterna visas som symboler.
ahmed aboubakr
tack för dina handledningar, det hjälper verkligen, och tack för din vänliga insats
Fadl
Okej, strunt samma… Jag kunde lösa det genom att ta bort @font-face-koden från fältet för anpassad CSS
Amy
Detta är verkligen den bästa guiden för att lägga till typsnitt som jag har hittat. Alla metoder finns på ett ställe och varje metod är lätt att följa. Jag har spenderat de senaste dagarna med att söka på internet för att försöka lista ut hur man lägger till ett anpassat typsnitt som inte kom från Google eller Typekit, och äntligen hittade jag en guide som var lätt att följa. Tack!
Amber
Okej, så jag använde Font Squirrel och fick @font-face-kiten. Jag laddade upp dem till mitt tema i Siteground. Sedan såg jag till att ändra URL:en i WP Editor -> Fonts. Här är ett exempel på vad jag gjorde:
@font-face { font-family: ‘walpurgis_nightregular’; src: url(‘www.example.com/public_html/wp-content/themes/pique/fonts/walpurgisnight-regular-webfont.woff2’) format(‘woff2’), url(‘www.wanderlustconqueror.com/public_html/wp-content/themes/pique/fonts/walpurgisnight-regular-webfont.woff’) format(‘woff’); font-weight: normal; font-style: normal;
}
Trots att jag gjorde detta visas inte teckensnittet i avsnittet "Typografi" i anpassningsalternativen. Jag tänkte att jag kanske också skulle lägga till det i "Ytterligare CSS-redigerare" så jag lade till det där också. Det verkade inte heller fungera.
Jag vill bara kunna använda mitt typsnitt för mina rubriker. Vad gör jag fel här? För att den här handledningen ska vara för nybörjare, får den mig att känna mig riktigt dum. Saknar jag ett steg? Finns det en bättre, mer djupgående handledning om att bara använda Font Face-alternativet? Hjälp!
WPBeginner Support
Hej Amber,
Vi är inte säkra. Försök följa stegen som nämns ovan en gång till.
Admin
Dan
Jag har ett liknande problem som Amber. Trots att jag följt instruktionerna steg för steg, laddas mina typsnitt fortfarande inte.
Jag använder ett anpassat tema baserat på twenty seventeen-temat. Min css-fil finns på wp-content/themes/twentyseventeen-child. Det är också här jag har placerat mina typsnitt. I css-filen har jag följande:
Men min webbplats visar fortfarande inte detta teckensnitt! Vad gör jag fel?
Syed Abbas Ali Shah
Jag har en fråga också. Jag har laddat upp .ttf-filerna i min
publichtml/folder-name-of-web/wp-content/theme/font
och jag har lagt till namnet på teckensnittet i stylesheet css i temat i wordpress-redigeraren. Men den plockar inte upp teckensnittet.
Vänligen ge mig lösningen
Raghava
Tack för den värdefulla informationen. Jag provade och det fungerar bra. Jag använde två typsnitt från Google, när jag använder Google Fonts är webbplatsens prestanda lite långsam.
om du kan lägga upp detaljerat hur man laddar upp teckensnitt direkt i WordPress skulle det uppskattas.
Thanks,
Raghava
Allix
Om jag tittar på en "glyf" genom Photoshop som är ett specialtecken i ett teckensnitt jag har köpt – hur kan jag överföra denna glyf till Photoshop?
Tack!
dsb
löjliga frågor, det är jag säker på! Men, i URL:en – där det står ‘your theme’ ska detta ersättas med titeln på vårt tema, eller hur? Eller ska vi lämna den delen som den är?
Också, för typsnitt som har långa namn, behöver man bara lämna mellanslag emellan eller lägga till + tecken eller något?
Till exempel:
@font-face { font-family: Arvo example one; src: url(http://www.example.com/wp-content/themes/your-theme/fonts/Arvo example one-Regular.ttf); font-weight: normal; }1-click Use in WordPress
Tack så mycket
WPBeginner Support
Hej dsb,
Ja, du måste ersätta din-tema med det faktiska namnet på din temamapp. Om du laddade upp ditt teckensnitt till din nuvarande temas teckensnittskatalog, kan du se vad teckensnittsfilen heter. eller Kopiera filnamnet och klistra bara in det i CSS.
Admin
Vincent
”Det bästa stället att ladda upp fonterna är inuti en ny mapp ‘fonts’ i din tema- eller barn-temakatalog.”
Varför är detta den bästa platsen, exakt? Att skapa ett barn tema för ett enda typsnitt är lite irriterande, men att ladda upp det inuti själva temat innebär att det kan försvinna när temat uppdateras, eller hur? Eller kommer det fortfarande att vara säkert från det eftersom det tekniskt sett är en orelaterad fil?
Andrew
Jag skulle nog säga att det är dumt att inte ha ett barn-tema i allmänhet, oavsett vad du använder det till.
Och nej, det skulle inte vara säkert om ditt tema uppdateras. Det skulle skrivas över av uppdateringen.
DaVince
> Jag skulle nog säga att det är dumt att inte ha ett barn-tema generellt, oavsett vad man använder det till.
Varför tror du det? Tänk på fallet där någon inte ändrar temat på något sätt, form eller vis överhuvudtaget. Det skulle vara helt meningslöst att köra ett barn-tema, och lägger bara ytterligare ett lager av kod ovanpå allt i det här fallet.
> Och nej, det skulle inte vara säkert om ditt tema uppdateras. Det skulle skrivas över av uppdateringen.
Jag fattade det ungefär. Jag tycker att detta borde lyftas fram i artikeln, annars kommer det att göra vissa människor missnöjda.
Shah
Hej,
Jag har inga problem med att lägga till anpassade typsnitt var som helst i mitt tema, bara när jag skulle ändra typsnittet i wp-embed-template.php fungerar inte mina anpassade typsnitt. Jag menar, det är som om de inte är @font-faced alls.
Skulle du snälla hjälpa mig att ändra typsnitten i wordpress-inbäddningsdelen? Ska jag lägga till @font-face igen i php? Det är redan tillagt dock!
Tack på förhand,
Robin
Tack för din hjälp!
När jag har laddat upp typsnittet till min typsnittsmapp, lägger jag till det i min CSS? Låter jag typsnittsfamiljen vara kvar? Eftersom jag använder den mestadels. Detta är ett specialtypsnitt som endast används vid specifika tillfällen.
Jag är så förvirrad.
Alice
Really great! Been struggling a while (I’m quite new to all this) but now it works
Thanks a lot!
Nicole
Hej. Tack för detta. Hur hittar jag licensinformationen för ett teckensnitt? Vissa teckensnitt finns överallt på webben, och jag vill använda ett men det är svårt att hitta EULA-informationen.
Vincent
Det ingår vanligtvis i teckensnittets egen metadata. I Windows kan du högerklicka och visa teckensnittets egenskaper. Om det inte räcker kanske du vill ladda ner en teckensnittsvisare med full funktionalitet som stöder visning av teckensnittsmetadata.
Andrea
Hej, vilken tillägg ska ha typsnittet installerat på wordpress?
Eftersom jag har problem med att installera mitt
Mike
Hej allihopa, jag använde den senaste tekniken (@fontface), den har lagt till teckensnittet i wordpress men den har gjort det till standardteckensnittet. Jag ville bara att det skulle vara ett alternativ i min teckensnittslista. Kan ni hjälpa till?
ep
Använde CSS @font-face-metoden. Fungerar som en charm. Tack.
Abdul Manan Abbasi
Assalam o Alaikum!
Jag är nybörjare i WordPress. Jag vill lägga till typsnittet Noori Nastaleeq på min webbplats. Hur kan jag göra det? Jag behöver din hjälp.
Ildiko
Kan du ge en prestandajämförelse mellan dessa metoder?
Asiyah
Hej,
Jag är helt ny på wordpress så jag hoppas att ni kan hjälpa mig. Jag har precis bokstavligen köpt en anpassad domän från bluehost, sedan installerat wordpress och sist installerat och aktiverat det så enkla temat. Så vad jag vill veta är om mina fontändringar kommer att gå förlorade om jag uppdaterar mitt tema i framtiden, och om så är fallet, hur förhindrar jag det?
Det är bara det att jag har märkt att många andra webbplatser rekommenderar att man först lägger till ett anpassat CSS-plugin och jag har ingen aning om hur man gör det.
Med vänliga hälsningar
WPBeginner Support
Ta en titt på vår guide om hur du enkelt lägger till anpassad CSS på din WordPress-webbplats.
Admin
Vikram
Tack så mycket. Det hjälpte
Hashim Naushahi
Detta var verkligen hjälpsamt! Tack så mycket!!!
Bara en snabb fråga...
Hur skulle jag justera koden om jag har ett teckensnitt med olika vikter?
Jag har en vanlig och en fet version av teckensnittet jag vill använda installerat på min bärbara dator. Jag använde FontSquirrel för att konvertera dem till webbteckensnitt. Och jag laddade upp dessa webbteckensnitt till en mapp i mitt barn-tema som du förklarade. Jag vet bara inte hur jag ska använda @font-face för att använda båda vikterna.
Jag ser verkligen fram emot ditt svar. Sättet du förklarade detta på är fantastiskt!
Tack på förhand!
Med vänliga hälsningar,
Hashim
WPBeginner Support
Du kommer att använda font-weight i CSS. Som detta:
h1 { font-family: 'Open Sans', Arial, serif; font-weight: 400; }1-click Use in WordPress
Admin
Christina
Jag ser inte "redigeringsknappen" i min wordpress under utseende. Jag använde font squirrel för att ladda upp mitt typsnitt men när jag gick för att lägga till det i temaredigeraren var det inte ett alternativ. Kanske har jag en annan version av wordpress. Snälla hjälp. Tack.
Michelle
Kan du ge ett exempel på URL-källan för @fontface-exemplet? Jag gör något fel och känner att jag vill dra ut allt hår :/
Mr.T
Är inte det korrekta sättet att lägga till anpassade Google-typsnitt att använda enqueue_script-funktionen?
WPBeginner Support
Det är idealiskt men inte nödvändigt. Den här metoden är också korrekt och enklare för nybörjare.
Admin
James
Hej allihopa
Jag läser alltid dina inlägg och älskar webbplatsen, bra jobbat, du hjälper mig alltid. Jag har fastnat med att flytta en webbplats för en kund och behövde ändra typsnittet. Jag trodde att jag hade gjort allt, kopierat CSS-filerna etc., men det var när jag läste detta som jag insåg att jag inte hade ändrat koden i sidhuvudet.
Har fastnat på detta i en vecka!
Anyway just wanted to say thanks