Joomla.it Forum

Joomla! 2.5 (versione con supporto terminato) => Joomla! 1.6/1.7/2.5 => : napster90 29 Oct 2012, 11:24:34

: [Risolto] Problema cambio font
: napster90 29 Oct 2012, 11:24:34

Ciao ragazzi, ho un problema con il sito. Vorrei inserire un tipo di font diverso per tutti gli articoli. L'unico problema è che seguendo la wiki di joomla sono fermo ad un punto.


1)Ho il font nei due formati (ttf ed eot) all'interno della dominio/templates/font
2)Ho aggiunto le stringhe al css del template in uso


Ora mi guidate per il passo successivo? Grazie.


http://www.fattoriadidatticafonni.it (http://www.fattoriadidatticafonni.it)

: Re:Problema cambio font
: xplosion 29 Oct 2012, 11:59:16

Ok, facciamo un po di luce sull'argomento.
Per la compatibilità con vari browser ti servono vari formati per font: eot, woff, ttf, svg
Ora supponiamo che il nostro font si chiama MioFont.

Inseriamo nel CSS:

:

@font-face {
    font-family: 'MioFont';
    src: url('miofont-webfont.eot');
    src: url('miofont-webfont.eot?#iefix') format('embedded-opentype'),
         url('miofont-webfont.woff') format('woff'),
         url('miofont-webfont.ttf') format('truetype'),
         url('miofont-webfont.svg#miofont') format('svg');}

.classeMioFont{font-family: 'MioFont';}Nota: fare attenzione al percorso e modificarlo in base a dove sono caricati i 4 font.

Nel html inseriamo la classe dove vogliamo, tipo:

:

<div class="classeMioFont">Qui comparirà il font del tipo MioFont</div>
Vedi se funziona

: Re:Problema cambio font
: napster90 29 Oct 2012, 12:43:03

ok, grazie xplosion. Ho messo i 4 file dei font nella cartella font che a sua volta è dentro templates. Ho editato il css (credo bene), con il percorso ->

@font-face {   
font-family: 'gabriola';   
src: url('templates/siteground-j16-38/font/gabriola.eot');   
src: url('templates/siteground-j16-38/font/gabriola.eot?#iefix') format('embedded-opentype'),              url('templates/siteground-j16-38/font/gabriola.woff') format('woff'),         
url('templates/siteground-j16-38/font/gabriola.ttf') format('truetype'),         
url('templates/siteground-j16-38/font/gabriola.svg#miofont') format('svg');
}
.classegabriola{[size=78%]font-family: [/size][size=78%]'gabriola'[/size][size=78%];}[/size]

La classe in che html la devo scrivere? (Scusa ma non ho capito).

: Re:Problema cambio font
: xplosion 29 Oct 2012, 12:50:46

Visto che hai già assegnato al body, questo significa che il tuo font dovrebbe comparire dappertutto, vero?

: Re:Problema cambio font
: xplosion 29 Oct 2012, 13:02:03

Vedi che il percorso è sbagliato. Nel tuo caso devi modificare con:

:

@font-face {
    font-family: 'gabriola';
    src: url('../font/gabriola.eot');
    src: url('../font/gabriola.eot?#iefix') format('embedded-opentype'),
         url('../font/gabriola.woff') format('woff'),
         url('../font/gabriola.ttf') format('truetype'),
         url('../font/gabriola.svg#miofont') format('svg');}
L'istruzione .classegabriola era solo un esempio se volevi assegnare quella classe ad un specifico contenuto, nel tuo caso se vuoi che ti compare dappertutto, al posto di :

:

.classegabriola{font-family: 'gabriola';}devi scrivere:

:

body{font-family: 'gabriola';}
Spero che mi sono spiegato...

: Re:Problema cambio font
: napster90 29 Oct 2012, 14:11:44

Ho apportato le modifiche suggerite. Ora spero funzioni tutto.. Grazie.

: Re:Problema cambio font
: xplosion 29 Oct 2012, 14:17:45

Non sperare, devi essere sicuro  ;)