Google Web fonts, come sapete, è un ottimo servizio fornito da google per poter visualizzare in maniera veloce ed intuitiva tramite css o richiamo javascript un elenco di caratteri con ottime prestazioni per quando concerne il caricamento della pagina. Google Web fonts fornisce le varianti di richiamo da mettere nel template e tu, naturalmente, tramite foglio di stille (css), lo puoi richiamare dove più ti aggrada, grazie al comando font-family (utilizzato molto spesso) che serve appunto per richiamare il “font famiglia” come dice la stessa parola, e quindi si visualizzerà il testo con il carattere che avete scelto.
Ora, grazie al piccolo ma geniale plugin Google Web fonts plugin, tutto il procedimento sopra descritto è reso molto più facile, specie per chi non ha approfondite conoscenze di codice.
Grazie a Google Web fonts plugin, infatti, per richiamare il font che hai scelto ti basterà andare su google web fonts, e richiamare il font all’interno del tuo sito con un semplice click, successivamente sarai tu a scegliere dove mettere il font nel contesto del tuo template.
Installazione Google Web fonts plugin per WordPress
- Caricare e attivare Google Web Fonts per WordPress.
- Passare alla Customizer Theme.
- Scegliere i font dall’elenco di tutti i font disponibili (www.google.com/fonts/) e salvare le selezioni.
- Aggiungere la condizione del codice css font-family con proprietà per il tema o al foglio di stile.
Se avete problemi dubbi o voglia di implementare questo plugin potete approfittare del nostro forum nell’area dedicata hai plugin.
Come posso essere richiamati i font
link da aggiungere nel head del sito
<link href='http://fonts.googleapis.com/css?family=Caesar+Dressing' rel='stylesheet' type='text/css'>
all’interno del foglio di stile
@import url(http://fonts.googleapis.com/css?family=Caesar+Dressing);
body {font-family: 'Caesar Dressing', cursive; }
javascript
<script type="text/javascript">
WebFontConfig = {
google: { families: [ 'Caesar+Dressing::latin' ] }
};
(function() {
var wf = document.createElement('script');
wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
'://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
wf.type = 'text/javascript';
wf.async = 'true';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(wf, s);
})();
</script>