Template:FreedImg

[visualizza] [modifica] Documentazione

Questa documentazione è transclusa da Template:FreedImg/doc. (modifica | cronologia)
Questo template ha una pagina delle prove (modifica) per fare sperimentazioni.

Questo template usa il foglio di stile Template:FreedImg/style.css.

Descrizione[modifica]

Il template costituisce un'alternativa al markup File: per la visualizzazione delle immagini¹. Inserisce l'immagine in un "box primario", visualizzabile a destra, a sinistra, centrato o "centrato-flottante", e permette di integrare facilmente nel box una didascalia, il cui stile può essere finemente regolato.

L'opzione "centrato-flottante" permette di visualizzare un'immagine centrata, che non interrompe il flusso del testo.

Attenzione: L'opzione "centrato-flottante" richiede CSS3. L'esportazione in ePub funziona correttamente ma richiede un lettore di ePub abilitato a CSS3 (ePub3).

Uso[modifica]

Per favore usate sempre l'abbreviazione per FreedImg, {{FI}}, piuttosto che il nome per esteso.

{{FI
 | type          = opzionale 
 | file          = obbligatorio
 | tsize         = opzionale; dimensioni dell'immagine ridotta, in pixel; default 450px
 | width         = opzionale; default 100%
 | cclass        = opzionale; classe del contentore primario, default floatnone
 | float         = opzionale; default center; valori ammessi left|right|center|floating-center
 | margin-left   = opzionale; default 1em; lasciare vuoto se floating-center
 | margin-right  = opzionale; default 1em; lasciare vuoto se floating-center
 | margin-top    = opzionale; default 1em
 | margin-bottom = opzionale; default 1em
 | clear         = opzionale; default nessuno
 | header        = opzionale; titolo in alto
 | hstyle        = opzionale: stile del titolo
 | halign        = opzionale; allineamento del titolo, default center
 | caption       = opzionale; didascalia
 | talign        = opzionale; allineamento della didascalia, default center
 | indent        = opzionale; indentatura della didascalia
 | tstyle        = opzionale: stile della didascalia
 | talign        = opzionale; allineamento della didascalia, default center
 | alt           = opzionale; default nessuno
 | link          = opzionale; parametro link come da markup standard
 | annoCopyright = opzionale; anno di scadenza copyright dell'immagine, fino al quale l'immagine viene oscurata
}}

Parametri[modifica]

per l'mmagine

file: Il nome del file (senza il prefisso "File:") (parametro obbligatorio)
- alt: Testo alternativo per l'immagine, cioè per il box di testo al passaggio del mouse o per l'uso su un lettore di schermo per gli ipovedenti)

Al momento non vi è la possibilità di utilizzare l'immagine come link utilizzando il parametro|link=.

quando ( type=user ) è presente e contiene un valore

Il codice per le immagini generate da alcune estensioni (es. the default <math> User preference, <score>, etc.) può essere inserito al posto del file.

Contenitore SPAN (tipo inline-block) primario

width: la larghezza del contenitore primario in percentuale (present, variable, default 100%). Fortemente consigliato l'uso della misura espressa come percentuale (viene calcolata come percentuale del box testo corrente).
cclass: La classe del contenitore primario, (presente, modificabile, default floatnone [un nome di classe indefinito che serve unicamente come segnaposto])
float: L'allineamento del contenitore primario (non presente; deve essere aggiunto, le opzioni sono "left" or "right"; altrimenti l'immagine risulta centrata).
clear: I margini del contenitore primario da collassare (non presente; deve essere aggiunto, le opzioni sono "left", "right" or "both").
margin-left,margin-right : Ogni margine speciale da applicare al contenitore primario (default adatto alla posizione centrata). Vedi sotto una alternativa più utile.
- per generare un'immagine centrata, conservando la continuità del testo sopra e sotto l'immagine, esprimere width, margin-left e margin-right in percentuale, con valori tali che la somma dia 100%, e porre float = left oppore float = right.
annoCopyright: accetta un anno di scadenza copyright e oscura completamente l'immagine finchè {{CURRENTYEAR}} (l'anno corrente) è inferiore all'anno di scadenza.

Didascalia

caption: La didascalia (assente; deve essere aggiunto).
tstyle,talign: Qualsiasi stile o allineamento speciale da aggiungere al blocco della didascalia (se presente).
mleft,indent: Ogni contollo di flow del testo da ap licare alla didascalia (se presente).

Intestazione

header: La didascalia (assente; deve essere aggiunto).
hstyle: Qualsiasi stile o allineamento speciale da aggiungere al blocco dell'intestazione (se presente).
halign: Ogni contollo di allineamento del testo da aplicare all'intestazione (se presente).

Precauzioni d'uso[modifica]

Per usare questo template al meglio bisogna aver l'accortezza di inserirlo nel flusso del testo senza bloccare lo stesso. Bisogna quindi:

evitare di inserire degli a capo tra il template (prima e dopo) e il testo in cui è inserito;
usare possibilmente la larghezza immagine in percentuale, il template è contenuto in un blocco e la larghezza percentuale è relativa a quel blocco, in tal modo la proporzione fra immagini e blocco testo può restare invariata;
nei parametri evitare assolutamente i template; per la didascalia ad es. non usare centrato od altro, usare piuttosto il parametro dedicato tstyle: in esso va inserito lo stile da usarsi: vedi in sandbox di Ineuw alcuni stili da poter esprimere, naturalmente usare la "CSS declaration" intera, non quella abbreviata.

Ripetiamo quindi: evitare di usare elementi blocco (come p, div, table...) o elementi che li generano come centrato o simili) in titolo "header" o didascalia "caption" altrimenti le proprietà del template vengono meno.

Per il "centrato con il testo che scorre attorno", si usi per il parametro float il valore floating-center. Si può anche inserire il testo in una div con classe "testi" per un effetto migliore come dall'esempio che segue.

<div class="testi">
... faceva sembrare un pescatore bretone, teneva il volante con l’attenzione {{FI
|file = Barzini - La metà del mondo vista da un'automobile, Milano, Hoepli, 1908 (page 98 crop).jpg
| width = 100%
| float = floating-center
| caption = Manovra per deviare una ruota interiore incastratasi in un solco profondo. Un ''cooly'' la spinge col piede mentre il Principe Borghese dirige agli sforzi d’una cordata.
|tstyle=font-size:75%
}} d’un timoniere alla ruota, e comandava le sue schiere a colpi di tromba. Un colpo: avanti! due colpi: Alt!, ma le schiere ...</div>

... faceva sembrare un pescatore bretone, teneva il volante con l’attenzione

Manovra per deviare una ruota interiore incastratasi in un solco profondo. Un cooly la spinge col piede mentre il Principe Borghese dirige agli sforzi d’una cordata. d’un timoniere alla ruota, e comandava le sue schiere a colpi di tromba. Un colpo: avanti! due colpi: Alt!, ma le schiere ...

Esempi[modifica]

Vedi anche esempi nelle Pagina di prova dell'utente Ineuw.

1. Immagine da sola: File:Iceberg.jpg²

{{FI
 | file     = Iceberg.jpg
 | tsize    = 400px
 | width    = 25%
 | alt      = WS Iceberg
 | link     = Wikisource:Bar
}}

WS Iceberg

2. Partitura musicale:

{{FI
 | type  = user
 | width = 50%
 | file  = <score>{ \clef bass \time 4/4 \key d \minor d2 (a2 f2 d2 cis2 d4 e4 f4. g8 f8 e8 d2) \bar "|." }</score>
}}

${ \clef bass \time 4/4 \key d \minor d2 (a2 f2 d2 cis2 d4 e4 f4. g8 f8 e8 d2) \bar "|." }$

3. Formula matematica³:

{{FI
 | type  = user
 | width = 15%
 | file  = <math>\sin x = {e^{ix} - e^{-ix} \over 2i} </math>
}}

$\sin x={e^{ix}-e^{-ix} \over 2i}$

4. Immagine inserita in un testo

Quel ramo del lago di Como, che volge a mezzogiorno, tra due catene non interrotte di monti, tutto a seni e a golfi, a seconda dello sporgere e del rientrare di quelli, vien, quasi a un tratto, a ristringersi, e a prender corso e figura di fiume, tra un promontorio a destra, e un’ampia costiera dall’altra parte; e il ponte, che ivi congiunge le due rive, par che renda ancor più sensibile all’occhio questa trasformazione, e segni il punto in cui il lago cessa, e l’Adda rincomincia, per ripigliar poi nome di lago dove le rive, allontanandosi di nuovo, lascian l’acqua distendersi e rallentarsi in nuovi golfi e in nuovi seni. La costiera, formata dal deposito di tre grossi torrenti, scende appoggiata a due monti contigui, l’uno detto di san [p. 10]Martino, l’altro, con voce lombarda, il Resegone, dai molti suoi cocuzzoli in fila, che in vero lo fanno somigliare a una sega: talché non è chi, al primo vederlo, purché sia di fronte, come per esempio di su le mura di Milano che guardano a settentrione, non lo discerna tosto, Lecco e il Resegone a un tal contrassegno, in quella lunga e vasta giogaia, dagli altri monti di nome più oscuro e di forma più comune. Per un buon pezzo, la costa sale con un pendìo lento e continuo; poi si rompe in poggi e in valloncelli, in erte e in ispianate, secondo l’ossatura de’ due monti, e il lavoro dell’acque. Il lembo estremo, tagliato dalle foci de’ torrenti, è quasi tutto ghiaia e ciottoloni; il resto, campi e vigne, sparse di terre, di ville, di casali; in qualche parte boschi, che si prolungano su per la montagna.

5. Immagine inserita in un testo e dotata di intestazione

Quel ramo del lago di Como, che volge a mezzogiorno, tra due catene non interrotte di monti, tutto a seni e a golfi, a seconda dello sporgere e del rientrare di quelli, vien, quasi a un tratto, a ristringersi, e a prender corso e figura di fiume, tra un promontorio a destra, e un’ampia costiera dall’altra parte; e il ponte, che ivi congiunge le due rive, par che renda ancor più sensibile all’occhio questa trasformazione, e segni il punto in cui il lago cessa, e l’Adda rincomincia, per ripigliar poi nome di lago dove le rive, allontanandosi di nuovo, lascian l’acqua distendersi e rallentarsi in nuovi golfi e in nuovi seni. La costiera, formata dal deposito di tre grossi torrenti, scende appoggiata a due monti contigui, l’uno detto di san [p. 10]Martino, l’altro, con voce lombarda, il Resegone, dai molti suoi cocuzzoli in fila, che in vero lo fanno somigliare a una sega: talché non è chi, al primo vederlo, purché sia di fronte, come per esempio di su le mura di Milano che guardano a settentrione, non lo discerna tosto, Figura n. xxxxLecco e il Resegone a un tal contrassegno, in quella lunga e vasta giogaia, dagli altri monti di nome più oscuro e di forma più comune. Per un buon pezzo, la costa sale con un pendìo lento e continuo; poi si rompe in poggi e in valloncelli, in erte e in ispianate, secondo l’ossatura de’ due monti, e il lavoro dell’acque. Il lembo estremo, tagliato dalle foci de’ torrenti, è quasi tutto ghiaia e ciottoloni; il resto, campi e vigne, sparse di terre, di ville, di casali; in qualche parte boschi, che si prolungano su per la montagna.

↑ l'idea è di en:User:George Orwell III
↑ A piena risoluzione: ‎573 × 833 pixels, dimensioni del file: 87 KB, MIME type: image/jpeg.
↑ N.B. Questo funziona solo se nelle preferenze di gestione delle immagini sono di default (es. Preferenze/Aspetto/Formule matematiche è "mmagini PNG". Scegliere "MathJax" foza la resa della formula come testo eludendo ogni effetto di {{FreedImg}}.)

[1] 'idea è di en:User:George Orwell III

[2] A piena risoluzione: ‎573 × 833 pixels, dimensioni del file: 87 KB, MIME type: image/jpeg.

[3] N.B. Questo funziona solo se nelle preferenze di gestione delle immagini sono di default (es. Preferenze/Aspetto/Formule matematiche è "mmagini PNG". Scegliere "MathJax" foza la resa della formula come testo eludendo ogni effetto di {{FreedImg}}.)

1

2

3