Descrizione:

In questo tutorial cercherò di spiegarti come utilizzare all’interno del tuo blog i font di Google. I font di google sono Gratuiti, open source e ottimizzati per web, perciò utilizzare questi font nei tuoi progetti web ti porterà numerosi vantaggi.

Codice:

Introduzione:

Il concetto basilare da comprendere è che un font è visibile solo se installato nel computer, per questo motivo perchè i tuoi visitatori possano visualizzare correttamente il font che hai scelto è necessario che wordpress sappia dove cercarlo.

Un secondo problema è che decidendo di utilizzare a posteriori (leggi “dopo aver ultimato il tuo progetto” ) i font di google dovrai anche sostituire la “famiglia di caratteri” utilizzata nel fogli di stile, quindi valuta accuratamente la convenienza nell’utilizzo di questi font.

Google Web Fonts:

E’ l’area di google dedicata ai font studiati per il web e lì troverai (quasi) tutte le integrazioni necessarie per utilizzare i font sul tuo sito.

La prima cosa da fare, dopo esserti collegato a Google Web Font è scegliere quale tra quelli disponibili utilizzare. Fatta questa scelta dovresti cliccare sul link in inglese “Quick Use”.

A questo punto Nel rettangolino blu apparirà un codice sotto la voce “Standard”; copialo e incollalo nel blocco note.

Apri il file function.php del tuo tema e inserisci questa breve funzione:

function wpc_google_fonts(){ ?>
   <link href='http://fonts.googleapis.com/css?family=Allerta+Stencil&v2' rel='stylesheet' type='text/css'> // Sostituisci questa riga con il codice che hai copiato prima
<?php }
add_filter('wp_head','wpc_google_fonts');

A questo punto wordpress sa che dove prendere i font di google, l’ultimo passo è modificare il file:

Style.css:

Ovviamente per questioni logiche non sono in grado di fornire il metodo per tutti i temi e tutti i font, posso solo dirti che una volta aperto il file Style.css del tuo tema wordpress potresti cercare tutti i tag h1 e includere la famiglia di font che hai scelto.

Esempio:

h1 { font-family: ‘Metrophobic’, Arial, serif; font-weight: 400; }

Molto in generale posso dirti che devi sostituire il valore predefinito di “font-family” con quello che hai scelto.