IL SOFTWARE
Articoli, tips, recensioni e news sul mondo del software

Modificare font al tema WordPress

In questo articolo ti mostrerò due tecniche per cambiare il font del tuo tema WordPress.

Il primo metodo, prevede l’utilizzo di un plugin, mentre il secondo richiede una piccola modifica al foglio di stile (style.css)

1.METODO: Utilizzo del plugin Easy Google Fonts

Con Easy Google Fonts avremo la possibilità di aggiungere tutti i font di google nel tema WordPress, senza nessuna codifica. Basterà entrare in Aspetto>Personalizza ed avremo in tempo reale le modifiche al font del nostro tema. Una volta scelto il font, le dimensioni e il colore per ogni aspetto del tema, basterà premere il pulsante Salva.

screenshot-4

2.METODO: Modifica del file style.css

Questo metodo è più macchinoso ma evita l’installazione di un ulteriore plugin nel nostro sito. Attraverso questa tecnica potrai cambiare dimensione e font attraverso il foglio di stile del tuo tema WordPpress. Questo metodo richiede un pò di dimestichezza con i linguaggio CSS, ma è abbastanza semplice.

Per accedere al foglio di stile del tuo tema, recati in Aspetto, dal menù a sinistra, e seleziona Editor. Il file che si aprirà sarà il vostro foglio di stile (stylesheet.css), scorriamo il foglio fino a quando non vediamo il <tag> body, come raffigurato qui sotto:

 
body,
button,
input,
select,
textarea {
 color: #2b2b2b;
 font-family: 'Cardo', serif;
 font-size: 16px;
 font-weight: 400;
 line-height: 1.5;
}

La voce da modificare sarà font-family e font-size (nel caso vogliate modificare le dimensioni del testo). Rechiamoci sul sito Google Fonts, dove ci vengono forniti, attraverso i server di Google, oltre 600 tipi di font differenti. Io nell’esempio qui sopra ho utilizzato il font Cardo.

google-fonts

Una volta scelto il font, premi il link “Quick-use”, verrai così condotto direttamente nella pagina dei setaggi del font. Il codice che a noi interessa è presente nel punto 4. Integrate the fonts into your CSS, copiatelo ed incollatelo nel vostro foglio di stile in corrispondenza della riga font-family.

google-fonts-CSS

A seconda del tema, è possibile trovare voci aggiuntive nel vostro foglio di stile che controllano le dimensione del testo e altri tipi font, relativi ad altri testi presenti nel vostro sito (ad esempio, si può trovare un codice che controlla i titoli dei widget).