Cum să adăugați fonturi personalizate la WordPress în mod simplu

Adăugarea mai multor fonturi pe computer este destul de simplă. Pur și simplu descărcați fișierele în directorul dvs. de fonturi și apoi puteți începe să le utilizați în software-ul și aplicațiile dorite.

Cu toate acestea, dacă doriți să utilizați fonturi personalizate pe site-ul dvs. web, în ​​special acele fonturi pe care vizitatorii dvs. ar putea să nu le fi instalat pe dispozitivele lor, devine puțin mai complicat.

Din fericire, în calitate de utilizator WordPress, există câteva instrumente gratuite excelente pe care le puteți folosi pentru a adăuga fonturi individuale sau o bibliotecă întreagă a acestora pe site-ul dvs. web. După ce ați pus fonturile disponibile pentru tema dvs., puteți începe să le aplicați diferitelor stiluri utilizate pe site-ul dvs. web.

În acest articol vă vom arăta unde puteți găsi fonturi gratuite și premium de înaltă calitate, cum să le adăugați pe site-ul dvs. WordPress, plus câteva instrumente care vă vor ajuta să alegeți setările potrivite pentru fiecare tip de tip de pe site-ul dvs. web.

Unde să găsiți fonturi pentru site-ul dvs. web

Înainte de a ajunge la instrucțiunile care acoperă modul în care puteți adăuga fonturi personalizate pe site-ul dvs. WordPress, haideți să aruncăm o privire la câteva dintre locurile în care puteți găsi noi fonturi pentru a modifica aspectul textului de pe site-ul dvs.

Există câteva resurse online gratuite excelente, unde puteți găsi fonturi open source care pot fi folosite liber pe site-ul dvs. Unele resurse pe care ați dori să le explorați includ:

• Fonturi Google: răsfoiți peste 600 de fonturi open source care au fost optimizate pentru web. Utilizarea acestor fonturi pe site-ul dvs. WordPress este foarte ușoară, așa cum vom trata în scurt timp.
• Font Squirrel: un alt depozit mare de fonturi gratuite.
• Edge Web Fonts: o colecție de fonturi web gratuite, dezvoltate de Adobe Typekit.
• Typekit: o colecție profesională de peste 4.000 de fonturi gratuite și premium de la Adobe, pentru utilizare pe web și în tipărire.

După cum puteți vedea, există o mulțime de surse online legitime de fonturi gratuite și premium pe care le puteți utiliza pentru a personaliza aspectul site-ului dvs. WordPress.

Instrumente de tipografie pentru web designeri

Alegerea setului potrivit de fonturi pentru site-ul dvs. poate fi dificilă. Procesul înseamnă mai mult decât alegerea unuia sau două fonturi care vă plac și apoi adăugarea lor pe site-ul dvs. web.

Nu numai că trebuie să luați în considerare aspectul fontului, ci și dimensiunea pe care o veți alege, cât de largă este zona de conținut de pe site-ul dvs. și care este înălțimea optimă a liniei pentru fiecare font.

Din fericire, există câteva instrumente online gratuite pe care le puteți folosi pentru a vă ajuta să aplicați corect fonturile alese. Astfel, se asigură că conținutul tău arată cel mai bine .

O resursă online pe care ar trebui să o aruncați cu siguranță o privire rapidă atunci când personalizați fonturile de pe site-ul dvs. web este Calculatorul tipografiei raportului de aur. Acest instrument de tipografie, de la tipul din spatele Tezei Framework, vă permite să introduceți o dimensiune a fontului, urmată de lățimea zonei de conținut. Instrumentul va calcula apoi setările tipografice perfecte pentru configurația specifică a site-ului dvs. web.

Type Scale este un alt instrument online care facilitează stabilirea dimensiunii diferitelor stiluri de text de pe site-ul dvs. web în relație între ele. După ce ați introdus dimensiunea fontului de bază, cum ar fi dimensiunea textului paragrafului de pe site-ul dvs., veți afla apoi la ce dimensiune ar trebui setat fiecare dintre diferitele titluri .

Există o serie de scale din care să alegeți, inclusiv raportul de aur de mai sus. Odată ce sunteți mulțumit de setări, puteți copia rapid CSS -ul pentru a-l utiliza pe propriul site web.

Pluginuri de font personalizate WordPress

Așa cum există multe locuri pentru a găsi fonturi online, există și o mulțime de modalități de a le integra în site-ul dvs. WordPress. Cu toate acestea, pentru a vă ajuta să începeți cât mai repede posibil , iată câteva dintre cele mai bune plugin-uri legate de fonturile WordPress:

Fonturi Google ușoare

Easy Google Fonts este un plugin gratuit care vă oferă posibilitatea de a utiliza oricare dintre cele peste 600 de fonturi gratuite din depozitul Google de pe site-ul dvs. WordPress. Pluginul funcționează cu instrumentul WordPress Customizer. Acest lucru vă permite să previzualizați modificările înainte de a lua o decizie finală cu privire la fonturile pe care să le utilizați pe site-ul dvs.

După instalarea și activarea pluginului pe site-ul dvs. web, puteți începe să schimbați fonturile utilizate de tema dvs. actuală WordPress. Pentru a face acest lucru, mergeți la instrumentul de personalizare WordPress și faceți clic pe secțiunea Tipografie.

Ieșit din cutie, pluginul vă permite să schimbați setările de tipografie pentru stilurile principale utilizate de tema dvs. Aceasta ar putea include paragraful și titlurile individuale. Cu toate acestea, prin pagina de setări Easy Google Fonts, puteți crea controale personalizate pentru fonturi . Acestea sunt apoi adăugate la interfața Customizer, oferindu-vă o modalitate ușoară de a schimba fontul folosit de elemente precum liste, citate și multe altele.

După ce ați adăugat un control personalizat al fontului, îl puteți accesa din setările Tipografiei temei din Personalizator.

Folosind această caracteristică a pluginului, puteți modifica fonturile utilizate de oricare dintre elementele sau stilurile temei dvs. WordPress. Controalele care sunt adăugate la Personalizator acoperă, de asemenea, greutatea fontului, decorarea textului și proprietățile de transformare, precum și culoarea fontului, culoarea de fundal, dimensiunea, înălțimea liniei și spațierea dintre litere.

Combinând controalele personalizate ale fonturilor cu setările detaliate oferite, pluginul Easy Google Fonts deschide o lume întreagă de posibilități atunci când vine vorba de modificarea aspectului textului de pe site-ul tău WordPress, totul fără a fi nevoie să editezi direct vreun cod.

Utilizați orice font

Pluginul Easy Google Fonts de mai sus este foarte recomandat. Cu toate acestea, are un dezavantaj: puteți folosi doar fonturile din colecția Google Fonts. Dacă niciunul dintre aceste 686 de fonturi nu atrag sau doriți să utilizați un tip de liter personalizat , atunci pluginul la fel de gratuit Use Any Font este o alternativă bună.

După instalarea și activarea pluginului, puteți încărca unul sau mai multe fonturi pe site-ul dvs., direct de pe computer. Cu toate acestea, înainte de a începe, trebuie să vă înscrieți pentru cheia API gratuită (sau să faceți o donație), care va conecta pluginul la instrumentul de conversie a fonturilor.

După ce ați încărcat cel puțin un font, îl puteți atribui elementelor specifice ale site-ului dvs. web. Aceasta include lista de elemente implicite, precum și orice elemente personalizate pe care le definiți.

Pluginul adaugă, de asemenea, unele comenzi ale fonturilor editorului de postări WordPress . Acest lucru facilitează schimbarea fonturilor utilizate în postările și paginile dvs., la nivel individual, mai degrabă decât la nivel global.

După atribuirea unui font, puteți vedea modificările aduse tipografiei vizitând partea frontală a site-ului dvs. Deși controalele acestui plugin nu se compară cu cele oferite de pluginul Easy Google Fonts, dacă doriți doar să schimbați fonturile utilizate de elementele specifice ale temei dvs. într-un font personalizat la alegere, atunci Folosiți orice font nu treaba frumos.

Fonturi Typekit pentru WordPress

Dacă doriți să utilizați fonturile gratuite și premium din serviciul Adobe Typekit pe site-ul dvs. WordPress, atunci pluginul gratuit Typekit Fonts for WordPress este pentru dvs.

Cu acest plugin, puteți fie să utilizați selectoarele predefinite, fie să adăugați propriile reguli CSS personalizate . Acest lucru vă asigură că orice parte a site-ului dvs. web pe care doriți să o personalizați cu un font Typekit, sunteți liber să faceți acest lucru cu acest plugin.

Adăugarea manuală a fonturilor personalizate la WordPress

Dacă, indiferent de motiv, ideea de a utiliza unul dintre pluginurile gratuite de mai sus nu atrage, puteți oricând să schimbați manual fonturile folosite pe site-ul dvs. WordPress. Dacă fontul pe care doriți să îl utilizați poate fi găsit în depozitul Google Fonts, atunci adăugarea acestuia pe site-ul dvs. web este foarte ușoară.

Tot ce trebuie să faceți trebuie să selectați fontul de pe site-ul Google și apoi să copiați codul relevant în secțiunea de cap și foaia de stil CSS a site-ului dvs.

Cu toate acestea, dacă fontul pe care îl alegeți nu este găzduit într-un depozit precum Google Fonts, de unde puteți pur și simplu să vă conectați la acesta, atunci va trebui să găzduiți singur fontul. Acest lucru modifică ușor procesul și adaugă câțiva pași suplimentari, cum ar fi încărcarea fontului pe server.

Puteți încărca fișierul cu font folosind software-ul FTP sau instrumentul de gestionare a fișierelor din panoul de control al gazdei dvs. web. Este o idee bună să încărcați fontul într-un director de fonturi dedicat , de preferință în folderul cu tema copilului pentru a vă ajuta să păstrați lucrurile organizate.

Odată ce fișierul cu fonturi este pe serverul dvs., deschideți fișierul foaia de stil CSS pentru teme pentru editare. Acest lucru se poate face din tabloul de bord WordPress, pe ecranul Aspect > Editor.

După ce ați adăugat CSS-ul de mai sus la foaia de stil pentru a încărca fontul, îl puteți utiliza oriunde în acel fișier CSS pentru a modifica aspectul textului, după cum urmează:

Din motive de performanță, acolo unde este posibil, ar trebui să încercați să vă conectați la un depozit extern de fonturi, cum ar fi Google Fonts. Cu toate acestea, dacă nu puteți găsi fontul pe care doriți să îl utilizați online, poate fi necesar să sacrificați o parte din viteza paginii dvs. găzduind fișierul.

Concluzie

Sperăm că acum știți unde să găsiți fonturi personalizate, precum și cum să începeți să le adăugați pe site-ul dvs. WordPress. Folosind unul dintre pluginurile gratuite, cum ar fi Easy Google Fonts, puteți începe să schimbați nu numai fonturile care sunt utilizate pe site-ul dvs. web, ci și modul în care sunt prezentate acele fonturi .

Datorită instrumentului WordPress Customizer, acum puteți modifica cu ușurință aspectul textului de pe site-ul dvs. web. Toate acestea au loc printr-un set de meniuri vizuale, completate cu o previzualizare live.

Dacă tema dvs. actuală nu vă oferă prea mult control asupra fonturilor folosite pe site-ul dvs., folosind una dintre metodele de mai sus, aveți acum o modalitate ușoară de a face acele modificări, fără a edita singur niciunul dintre CSS-ul de bază.

Care sunt fonturile tale preferate? Ce setări de tipografie de pe site-ul dvs. doriți să schimbați? Dacă aveți întrebări despre fonturi, tipografie sau WordPress în general, vă rugăm să le împărtășiți în comentariile de mai jos.