3 moduri de a schimba fontul de pe site-ul dvs. WordPress

Publicat: 2022-11-05

Dacă doriți să schimbați fontul pe site-ul dvs. WordPress, există câteva moduri în care puteți face acest lucru. Una este prin instalarea unui plugin precum Easy Google Fonts , care vă va oferi o pagină de setări în care puteți selecta ce fonturi doriți să utilizați și unde doriți să le utilizați. O altă modalitate este să editați fișierul CSS al temei pentru a schimba fontul. Aceasta este o metodă mai avansată și va trebui să cunoașteți ceva CSS pentru a o face. Dacă utilizați Genesis Framework, există un instrument încorporat pentru schimbarea fonturilor. Pentru a-l folosi, accesați Genesis > Setări teme și derulați în jos la secțiunea Fonturi. De acolo, puteți selecta fonturile pe care doriți să le utilizați pentru titluri și text.

Creați fonturi personalizate pentru tema dvs. Confetti Genesis Child! Descărcați și extrageți fontul pe computer după cum este necesar. Pentru uz comercial, DaFont și FontSquirrel sunt resurse excelente pentru fonturi gratuite. Dacă preferați un font mai premium/distinct, Creative Market este un loc bun pentru a începe. Arhivele trebuie să fie încărcate de dvs. Puteți face acest lucru folosind clienți FTP precum FileZilla sau Hosting File Manager. Pentru a personaliza CSS-ul, accesați Aspect. Folosind fiecare fișier ca URL sursă, adăugați noua adresă URL creată din fișierele pe care le-ați încărcat. Schimbarea numelui fontului și URL-ului vă va asigura că fișierul cu font al serverului dvs. rămâne în formatul corect.

Cum adaug fonturi personalizate la tema WordPress?

Imagine de la: https://wpbeginner.com

Există câteva moduri diferite prin care puteți adăuga fonturi personalizate la tema dvs. WordPress. O modalitate este să utilizați biblioteca Fonturi Google . Puteți să răsfoiți biblioteca și să selectați fonturile pe care doriți să le utilizați pe site-ul dvs. Apoi, puteți adăuga codul pentru acele fonturi în foaia de stil a temei. O altă modalitate de a adăuga fonturi personalizate la tema dvs. WordPress este să utilizați un plugin precum Easy Google Fonts. Acest plugin vă permite să selectați fonturile pe care doriți să le utilizați și apoi să adăugați automat codul temei. În cele din urmă, puteți adăuga și fonturi personalizate la tema dvs. WordPress, încărcând fișierele cu fonturi pe server și apoi adăugând codul în foaia de stil a temei.

Folosind pluginul Easy Google Fonts, puteți crea fonturi personalizate pentru site-ul dvs. WordPress. Veți avea ocazia să afișați combinații uimitoare de diverse fonturi pe site-ul dvs. web ca urmare a acestui aranjament. S-a demonstrat că utilizarea unei tipografii adecvate are o serie de avantaje. Clienții vor putea comunica cu dvs. mai eficient dacă site-ul dvs. este simplu de citit și utilizat. În plus, proprietățile CSS pot fi folosite pentru a ajusta stilul și poziționarea fontului pe care îl alegeți. În plus, dacă aveți un plugin WordPress, puteți adăuga propriile controale pentru font făcând clic pe pagina de setări a pluginului. Puteți utiliza acest lucru ca alternativă la fonturile Adobe dacă nu doriți să utilizați un plugin.

Pluginul Custom Adobe Fonts vă permite să încorporați cu ușurință aceste fonturi în site-ul dvs. WordPress. După instalarea pluginului, accesați biblioteca extinsă de fonturi Adobe pentru a găsi fontul potrivit (trebuie să vă înregistrați pentru a-l utiliza). După ce ați selectat un font care vă place, îl puteți adăuga la un proiect web făcând clic pe butonul Adăugați pe Web din colțul din dreapta sus al paginii. Instrumentul Font Pair este o modalitate excelentă de a previzualiza fonturile împreună, astfel încât să le puteți combina și potrivi după cum credeți de cuviință. Mai multe site-uri excelente vând fonturi personalizate concepute de designeri. De exemplu, fontul Squirrel este o alegere excelentă pentru dezvoltatori, deoarece are o bibliotecă mare de fonturi și este ușor de implementat. @Font-Face are un kit de fonturi web pe care să îl utilizați.

Puteți obține software-ul de pe site-ul dvs. WordPress. Fiecare kit include un fișier de font, precum și o foaie de stil care conține codul de care veți avea nevoie pentru a vă construi propria foaie de stil CSS. Trebuie să folosim următorul CSS pentru un exemplu de font OpenSans-ExtraBold-web. Cel mai bine este să salvați toate fișierele cu fonturi într-un director la alegere.

Cum schimb fontul în Genesis Framework?

Imagine de la: https://realtydigitalmarketing.com

Dacă doriți să schimbați fontul în cadrul Genesis Framework, puteți face acest lucru accesând pagina Setări stil din tabloul de bord WordPress. Pe această pagină, veți găsi un meniu derulant etichetat „Familie de fonturi de bază”. Din acest meniu, puteți selecta fontul pe care doriți să îl utilizați pentru site-ul dvs.

Tema Genesis vine cu un font implicit Source Sans Pro Google. Mai întâi trebuie să editați configurația fontului site-ului dvs. și fișierele styling.html. Când schimbați fontul, este esențial să îl salvați făcând clic pe butonul Actualizare fișier din partea de jos a paginii. Adăugați font Google la temele Genesis folosind acest tutorial. Puteți modifica greutatea setării fontului Google căutându-l („Fonts-url”). Următorul exemplu va arăta cum să adăugați greutatea 500 la https://fonts.googleapis.com/CSS?family=Montserrat:400,400i,500,600,700&display=swap.

Cum măresc dimensiunea fontului în Genesis?

Dimensiunea fontului din acest exemplu este. Dimensiunea fontului de pe ecran poate fi setată la orice număr. Derulați în jos la ecranul de setări ale temei/temei și atingeți [Dimensiune font].

Cum schimb fontul din tema mea?

Selectați fontul dorit din fila Aspect pagină din Excel sau fila Design din Word. Tema actuală are mai multe fonturi în colțul din stânga sus. Când selectați opțiunea de personalizare a fonturilor, puteți crea un set personalizat de fonturi. Accesați caseta Creare fonturi tematice noi și alegeți fontul dorit din casetele pentru fonturi pentru titlu și corp.

Implicațiile utilizării fontului:inherit

Dacă utilizați font:inherit pe pagina dvs. web, acesta va folosi același font ca și elementul părinte, chiar dacă acel font nu este declarat. Moștenirea vă poate ajuta să economisiți timp, economisind și bani pe termen lung, dar țineți cont de potențialele consecințe ale acestuia.
Când fontul unui element părinte diferă de cel al elementului său fiu, font:inherit nu poate fi folosit pentru a-l modifica. Dacă utilizați moștenirea pentru a înlocui stilurile care au fost definite anterior într-o foaie de stil, rezultatele pot fi imprevizibile.
Trebuie să precizați în mod explicit dacă doriți sau nu să utilizați fontul folosit pe un element copil atunci când îl înlocuiți. De exemplu, puteți utiliza familia de font Arial sau dimensiunea fontului: x-large; pe elementul copil.
Dacă aveți font:inherit în foaia de stil, asigurați-vă că îl testați în browser pentru a vedea cum vă va afecta paginile. Actualizați foaia de stil cât mai curând posibil dacă intenționați să schimbați fontul din paginile dvs.
Utilizarea fonturilor:inherit este esențială pentru designul și aspectul oricărui site web și este esențial să înțelegem implicațiile acestuia. Când utilizați această declarație, toate elementele descendente vor folosi același font ca și elementele părinte. Iti poate economisi mult timp la coafat, dar trebuie inteles ca poate avea si consecinte grave. Dacă declarația font:inherit nu specifică fontul elementului copil, aceasta nu afectează elementul părinte. Pentru a suprascrie fontul folosit pe un element copil, declarați-l în mod explicit.