Template:Galleria: differenze tra le versioni
Zaza (rosica | curriculum) m (→Sintassi) |
(è stato reso funzionante quindi non lo toglierei però resta obsoleto) |
||
(39 versioni intermedie di 13 utenti non mostrate) | |||
Riga 1: | Riga 1: | ||
<noinclude>{{obsoleto|archivio=sì}}</noinclude><includeonly> |
|||
<includeonly><div style="width: {{#expr:{{{larghezza|200}}}+15}}px; {{#if:{{{allineamento|}}}|float: {{{allineamento|}}}; clear: {{{allineamento|}}};|margin:0 auto;}} background-color: {{{sfondo|inherit}}}; border: 1px solid {{{bordo|#BBBBBB}}}; padding: 3px; padding-bottom: 0px;">{{#if:{{{titolo|}}}|<div style="font-size:110%; font-weight:bold; text-align: center;">{{{titolo}}}</div>}}<!-- |
|||
{| class="noprint" align="{{{allineamento|center}}}" float="{{{allineamento|center}}}" |
|||
--><div id="{{{nome|galleria}}}Counter" style="text-align: center; font-size: smaller;">(1/?)</div><span id="{{{nome|galleria}}}LinkPrev" style="float: left; font-size: 20px; display: none; position: relative; bottom: 20px; z-index: 50;">◄</span><span id="{{{nome|galleria}}}LinkNext" style="float: right; font-size: 20px; position: relative; bottom: 20px; z-index: 50;">►</span><br clear="both" /> |
|||
| <div |
|||
<div class="galleryMorphMaster" id="{{{nome|galleria}}}Master" style="text-decoration: blink; text-align: center;">Caricamento delle immagini in corso...</div><!-- |
|||
class="ImageGroup" |
|||
--><div id="{{{nome|galleria}}}Content1" style="display: none; padding: 0px; position: relative; bottom: 8px;">[[file:{{{immagine1|Esempio.jpg}}}|{{{larghezza|200}}}px|center|{{{commento1|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento1|}}}</div></div><!-- |
|||
style=" |
|||
-->{{#if:{{{immagine2|}}}|<div id="{{{nome|galleria}}}Content2" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine2}}}|{{{larghezza|200}}}px|center|{{{commento2|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento2|}}}</div></div>|}}<!-- |
|||
border:1px solid {{{bordo|#BBB}}}; |
|||
-->{{#if:{{{immagine3|}}}|<div id="{{{nome|galleria}}}Content3" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine3}}}|{{{larghezza|200}}}px|center|{{{commento3|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento3|}}}</div></div>|}}<!-- |
|||
float:{{{allineamento|center}}}; |
|||
-->{{#if:{{{immagine4|}}}|<div id="{{{nome|galleria}}}Content4" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine4}}}|{{{larghezza|200}}}px|center|{{{commento4|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento4|}}}</div></div>|}}<!-- |
|||
clear:{{{allineamento|center}}}; |
|||
-->{{#if:{{{immagine5|}}}|<div id="{{{nome|galleria}}}Content5" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine5}}}|{{{larghezza|200}}}px|center|{{{commento5|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento5|}}}</div></div>|}}<!-- |
|||
text-align:center; |
|||
-->{{#if:{{{immagine6|}}}|<div id="{{{nome|galleria}}}Content6" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine6}}}|{{{larghezza|200}}}px|center|{{{commento6|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento6|}}}</div></div>|}}<!-- |
|||
{{ #ifeq: {{{allineamento|}}} | right | margin-left:1em; | margin-right:1em; }} |
|||
-->{{#if:{{{immagine7|}}}|<div id="{{{nome|galleria}}}Content7" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine7}}}|{{{larghezza|200}}}px|center|{{{commento7|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento7|}}}</div></div>|}}<!-- |
|||
background-color:{{{sfondo|white}}}; |
|||
-->{{#if:{{{immagine8|}}}|<div id="{{{nome|galleria}}}Content8" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine8}}}|{{{larghezza|200}}}px|center|{{{commento8|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento8|}}}</div></div>|}}<!-- |
|||
<!--width:{{#expr: {{{larghezza|200}}} + 15 }}px;--> |
|||
-->{{#if:{{{immagine9|}}}|<div id="{{{nome|galleria}}}Content9" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine9}}}|{{{larghezza|200}}}px|center|{{{commento9|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento9|}}}</div></div>|}}<!-- |
|||
" |
|||
-->{{#if:{{{immagine10|}}}|<div id="{{{nome|galleria}}}Content10" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine10}}}|{{{larghezza|200}}}px|center|{{{commento10|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento10|}}}</div></div>|}}<!-- |
|||
>{{#if:{{{titolo|}}}|<div style="font-size:110%; font-weight:bold;">{{{titolo}}}</div>}}<div class="ImageGroupUnits"><!-- |
|||
-->{{#if:{{{immagine11|}}}|<div id="{{{nome|galleria}}}Content11" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine11}}}|{{{larghezza|200}}}px|center|{{{commento11|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento11|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{ |
-->{{#if:{{{1|{{{immagine1|}}}}}}| [[{{{1|Immagine:{{{immagine1}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{2|{{{commento1|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{3|{{{immagine2|}}}}}}| [[{{{3|Immagine:{{{immagine2}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{4|{{{commento2|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{5|{{{immagine3|}}}}}}| [[{{{5|Immagine:{{{immagine3}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{6|{{{commento3|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{7|{{{immagine4|}}}}}}| [[{{{7|Immagine:{{{immagine4}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{8|{{{commento4|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{9|{{{immagine5|}}}}}}| [[{{{9|Immagine:{{{immagine5}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{10|{{{commento5|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{11|{{{immagine6|}}}}}}| [[{{{11|Immagine:{{{immagine6}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{12|{{{commento6|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{13|{{{immagine7|}}}}}}| [[{{{13|Immagine:{{{immagine7}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{14|{{{commento7|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{15|{{{immagine8|}}}}}}| [[{{{15|Immagine:{{{immagine8}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{16|{{{commento8|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{17|{{{immagine9|}}}}}}| [[{{{17|Immagine:{{{immagine9}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{18|{{{commento9|}}}}}}]]}}<!-- |
||
-->{{#if:{{{ |
-->{{#if:{{{19|{{{immagine10|}}}}}}| [[{{{19|Immagine:{{{immagine10}}}}}}|{{{larghezza|200}}}px|thumb|center|{{{20|{{{commento10|}}}}}}]]}}<!-- |
||
--></div></div>{{#ifeq:{{{allineamento|}}}|left|<br clear="left">|}} |
|||
-->{{#if:{{{immagine22|}}}|<div id="{{{nome|galleria}}}Content22" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine22}}}|{{{larghezza|200}}}px|center|{{{commento22|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento22|}}}</div></div>|}}<!-- |
|||
|}</includeonly><noinclude> |
|||
-->{{#if:{{{immagine23|}}}|<div id="{{{nome|galleria}}}Content23" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine23}}}|{{{larghezza|200}}}px|center|{{{commento23|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento23|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine24|}}}|<div id="{{{nome|galleria}}}Content24" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine24}}}|{{{larghezza|200}}}px|center|{{{commento24|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento24|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine25|}}}|<div id="{{{nome|galleria}}}Content25" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine25}}}|{{{larghezza|200}}}px|center|{{{commento25|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento25|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine26|}}}|<div id="{{{nome|galleria}}}Content26" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine26}}}|{{{larghezza|200}}}px|center|{{{commento26|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento26|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine27|}}}|<div id="{{{nome|galleria}}}Content27" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine27}}}|{{{larghezza|200}}}px|center|{{{commento27|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento27|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine28|}}}|<div id="{{{nome|galleria}}}Content28" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine28}}}|{{{larghezza|200}}}px|center|{{{commento28|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento28|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine29|}}}|<div id="{{{nome|galleria}}}Content29" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine29}}}|{{{larghezza|200}}}px|center|{{{commento29|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento29|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine30|}}}|<div id="{{{nome|galleria}}}Content30" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine30}}}|{{{larghezza|200}}}px|center|{{{commento30|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento30|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine31|}}}|<div id="{{{nome|galleria}}}Content31" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine31}}}|{{{larghezza|200}}}px|center|{{{commento31|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento31|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine32|}}}|<div id="{{{nome|galleria}}}Content32" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine32}}}|{{{larghezza|200}}}px|center|{{{commento32|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento32|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine33|}}}|<div id="{{{nome|galleria}}}Content33" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine33}}}|{{{larghezza|200}}}px|center|{{{commento33|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento33|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine34|}}}|<div id="{{{nome|galleria}}}Content34" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine34}}}|{{{larghezza|200}}}px|center|{{{commento34|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento34|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine35|}}}|<div id="{{{nome|galleria}}}Content35" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine35}}}|{{{larghezza|200}}}px|center|{{{commento35|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento35|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine36|}}}|<div id="{{{nome|galleria}}}Content36" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine36}}}|{{{larghezza|200}}}px|center|{{{commento36|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento36|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine37|}}}|<div id="{{{nome|galleria}}}Content37" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine37}}}|{{{larghezza|200}}}px|center|{{{commento37|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento37|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine38|}}}|<div id="{{{nome|galleria}}}Content38" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine38}}}|{{{larghezza|200}}}px|center|{{{commento38|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento38|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine39|}}}|<div id="{{{nome|galleria}}}Content39" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine39}}}|{{{larghezza|200}}}px|center|{{{commento39|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento39|}}}</div></div>|}}<!-- |
|||
-->{{#if:{{{immagine40|}}}|<div id="{{{nome|galleria}}}Content40" style="display: none; position: relative; bottom: 8px;">[[file:{{{immagine40}}}|{{{larghezza|200}}}px|center|{{{commento40|}}}]]<div style="margin-left: 8px; margin-right: 8px; font-size: {{{dim-commento|smaller}}};">{{{commento40|}}}</div></div>|}}</div>{{#ifeq:{{{allineamento|right}}}|left|<br clear="left" />|}}</includeonly><noinclude> |
|||
== Utilizzo == |
|||
Questo template serve a creare una galleria di immagini alternabili in un unico ''thumb'' della stessa larghezza, funziona attraverso un comando [[Javascript]], che permette di scorrere le immagini una per una. Ricorda però che, proprio perché questo template usa javascript, un suo abuso può rallentare notevolmente il caricamento di una pagina.<br> |
|||
Se il tuo [[Internet Explorer|browser]] da [[niubbo]] ha disattivato in automatico i javascript, cavoli tuoi, non vedrai nulla.<br> |
|||
Il limite delle foto è 40, ma cosa [[cazzo]] ti serve caricarne di più?<br> |
|||
'''<span style="color:#FF0000">Attenzione:</span>''' per non perturbare l'impaginazione, si raccomanda di utilizzare immagini di proporzioni simili.<br> |
|||
{{Template complesso}} |
|||
==Sintassi== |
|||
{{man}} |
|||
Per l'inserimento in una pagina, fai riferimento alla seguente sintassi: |
|||
[[Categoria:Template strumenti di layout immagini]] |
|||
<nowiki>{{</nowiki>Galleria |
|||
|titolo= |
|||
|nome= |
|||
|larghezza= |
|||
|allineamento= |
|||
|sfondo= |
|||
|bordo= |
|||
|immagine1= |
|||
|commento1= |
|||
|immagine2= |
|||
|commento2= |
|||
|etc... |
|||
|etc... |
|||
|immagine40= |
|||
|commento40= |
|||
<nowiki>}}</nowiki> |
|||
*<code>titolo</code>: È il titolo che verrà visualizzato sopra tutte le immagini. Di default non c'è titolo. |
|||
*<code>nome</code>: È il nome della galleria, non verrà visualizzato da nessuna parte e serve nel caso si usi più volte questo template nella stessa pagina. È '''fondamentale''' usare il nome in questi casi, altrimenti javascript non riesce a distinguere tra le immagini di ogni singolo template. |
|||
*<code>larghezza</code>: È la larghezza da utilizzare per ogni immagine, in px (non mettere l'unità), di default è 200. Il riquadro sarà 15 pixel più largo. |
|||
*<code>sfondo</code>: È il colore di sfondo del riquadro, di default eredita lo sfondo sotto il template. |
|||
*<code>bordo</code>: È il colore del bordo del riquadro, di default è <span style="color: #BBBBBB;">#BBBBBB</span>. |
|||
*<code>allineamento</code>: Determina la posizione : ''left'' per allineare a sinistra, ''right'' per allineare a destra. Se volete una posizione centrata, omettete questo parametro. |
|||
*<code>dim-commento</code>: Dimensione del testo del commento, si applica a tutti i commenti. |
|||
*<code>immagine1, ..., immagine40</code>: Sono le immagini che verranno visualizzate. A parte la prima immagine, tutte le altre sono opzionali. |
|||
*<code>commento1, ..., commento40</code>: Sono i commenti relativi ad un'immagine. Sono tutti opzionali. |
|||
==Esempio== |
|||
{{galleria |
|||
|larghezza=100 |
|||
|immagine1=Chuck22.jpg |
|||
|immagine2=Mosconi1 0001.jpg |
|||
|immagine3=McGyver.jpg |
|||
|immagine4=Magnotta.jpg |
|||
}} |
|||
<code><nowiki>{{</nowiki>galleria<br /> |
|||
|larghezza=100<br /> |
|||
|immagine1=Chuck22.jpg<br /> |
|||
|immagine2=Mosconi1 0001.jpg<br /> |
|||
|immagine3=McGyver.jpg<br /> |
|||
|immagine4=Magnotta.jpg<br /> |
|||
}}</code> |
|||
<br clear="all" /> |
|||
== Template correlati == |
|||
*{{Template|GalleriaVideo}} |
|||
[[Categoria:Utility templates]] |
|||
</noinclude> |
</noinclude> |
Versione attuale delle 13:44, 22 set 2021
Questo template ha un codice sorgente piuttosto complesso. |
Non ti lasciano vandalizzare questo template? Eh, la vita è dura. Puoi comunque modificare le istruzioni che vedi qui sotto, contenute nella sottopagina Template:Galleria/man (modifica·cronologia)
Questo template serve solo per inserire una sequenza di immagini all'interno di una pagina. Il suo uso deve essere limitato ad un numero ridotto di immagini che effettivamente devono essere visualizzate in sequenza per poter essere comprese (ad es. una serie di versioni della stessa mappa per mostrare la migrazione di un popolo). |
Per tutti gli altri usi va preferito il normale tag <gallery>.
Attraverso questo template viene creata una galleria di immagini alternabili in un unico thumb della stessa larghezza. Una funzione JavaScript permette di scorrere le immagini una per una. la disattivazione della funzione JavaScript non impedisce di vedere le immagini.
Nota: per non perturbare l'impaginazione, si raccomanda di utilizzare immagini di proporzioni simili.
In presenza di testi di didascalia molto estesi si consiglia l'allineamento a sinistra.
Sintassi
{{Galleria
|larghezza = (predefinito è di 200 pixel: se si desidera un formato differente indicarne la grandezza senza scrivere px)
|titolo = (titolo del riquadro)
|allineamento = (determina la posizione: left per allineare a sinistra, center per centrare, right per allineare a destra.)
|sfondo = (il colore di sfondo del quadro, predefinito è bianco)
|bordo = (il colore del bordo del quadro, predefinito è nero)
|Immagine:1.jpg|legenda 1
|Immagine:2.jpg|legenda 2
|...
|...
|Immagine:10.jpg|legenda 10 (massimo 10 immagini)
}}
Esempio
Il codice non viene riportato perché è molto lungo, ma se sei interessato a vederlo premi qui.
Nota: sfondo e bordo di default sono bianchi (nell'esempio a fianco: bordo grey)