Exibir código-fonte para Predefinição:Imagem múltipla/doc

{{Subpágina de documentação}}
{{Lua|Módulo:Imagem múltipla}}
{{Utiliza TemplateStyles|Predefinição:Imagem múltipla/styles.css}}
<!-- Por favor coloque categorias onde indicado na parte inferior desta página e interwikis no Wikidata -->

Esta predefinição cria uma caixa contendo entre duas e dez imagens, dispostas vertical ou horizontalmente e com legendas para toda a caixa inteira ou para cada uma das imagens.

Com a escolha apropriada de parâmetros, a predefinição pode redimensionar automaticamente as imagens para uma determinada largura total, com cada imagem tendo a mesma altura.

== Sintaxe e parâmetros ==

Forneça os parâmetros {{parâmetro|altura[n]}} ou {{parâmetro|largura_total}} para obter o redimensionamento automático. Observe os diferentes significados dos parâmetros {{parâmetro|largura[n]}} com ou sem redimensionamento automático. Observe também a opção de definir um parâmetro {{parâmetro|largura_total}} no início da predefinição {{tl|Imagem múltipla}}.

; Redimensionamento automático de todas as imagens para a mesma altura e para uma determinada largura total
: <syntaxhighlight lang="wikitext">
{{Imagem múltipla|largura_total = 600
<!-- Parâmetros de estilo -->
| alinhar            = <!-- direita (padrão), esquerda, centro, nenhum --> 
| direção            = <!-- horizontal (padrão), vertical -->
| cor de fundo       = <!-- fundo da caixa como uma cor web, por exemplo, #33CC00 -->
| largura            = <!-- largura de exibição de cada imagem em píxeis (um número inteiro, omita o sufixo "px"); substitui os parâmetros "largura[n]" abaixo
 -->
| alinhar_legenda    = <!-- esquerda (padrão), centro, direita --> 
| estilo_imagem      = <!-- border:1; (padrão) -->
| espaçamento_imagem = <!-- 5 (padrão)-->

<!-- Cabeçalho -->
| fundo_cabeçalho    = <!-- fundo do cabeçalho como uma cor web, por exemplo, #33CC00 -->
| alinhar_cabeçalho  = <!-- centro (padrão), esquerda, direita -->
| cabeçalho          = <!-- texto do cabeçalho -->

<!--imagem 1-->
| imagem1            = <!-- apenas o nome do arquivo, ou seja, sem o prefixo "Ficheiro:" ou "Imagem:" -->
| largura1           = <!-- largura de exibição da imagem; substituído pelo parâmetro "largura" acima -->
| alt1               = 
| link1              = 
| thumbtime1         = 
| legenda1           = 
<!--imagem 2-->
| imagem2            = <!-- apenas o nome do arquivo, ou seja, sim o prefixo "Ficheiro:" ou "Imagem:" -->
| largura2           = <!-- largura de exibição da imagem; substituído pelo parâmetro "largura" acima -->
| alt2               = 
| link2              = 
| thumbtime2         = 
| legenda2           = 
<!-- e assim por diante -->

<!-- Rodapé -->
| fundo_rodapé       = <!-- fundo do rodapé como uma cor web, por exemplo, #33CC00 -->
| alinhar_rodapé     = <!-- esquerda (padrão), centro, direita -->
| rodapé             = <!-- texto do rodapé -->
}}
</syntaxhighlight>

; Sem redimensionamento automático de todas as imagens para a mesma altura
: <syntaxhighlight lang="wikitext">
{{Imagem múltipla
<!-- Parâmetros de estilo -->
| alinhar            = <!-- direita (padrão), esquerda, centro, nenhum --> 
| direção            = <!-- horizontal (padrão), vertical -->
| cor de fundo       = <!-- fundo da caixa como uma cor web, por exemplo, #33CC00 -->
| largura_total      = <!-- largura total de todas as imagens exibidas em píxeis (um número inteiro, omita o sufixo "px");
 -->
| alinhar_legenda    = <!-- esquerda (padrão), centro, direita --> 

<!-- Cabeçalho -->
| fundo_cabeçalho    = <!-- fundo do cabeçalho como uma cor web, por exemplo, #33CC00 -->
| alinhar_cabeçalho  = <!-- centro (padrão), esquerda, direita -->
| cabeçalho          = <!-- texto do cabeçalho -->

<!--imagem 1-->
| imagem1            = <!-- apenas o nome do arquivo, ou seja, sem o prefixo "Ficheiro:" ou "Imagem:" -->
| alt1               = 
| link1              = 
| thumbtime1         = 
| legenda1           = 
<!--imagem 2-->
| imagem2            = <!-- apenas o nome do arquivo, ou seja, sem o prefixo "Ficheiro:" ou "Imagem:" -->
| alt2               = 
| link2              = 
| thumbtime2         = 
| legenda2           = 
<!-- e assim por diante -->

<!-- Rodapé -->
| fundo_rodapé       = <!-- fundo do rodapé como uma cor web, por exemplo, #33CC00 -->
| alinhar_rodapé     = <!-- esquerda (padrão), centro, direita -->
| rodapé             = <!-- texto do rodapé -->
}}
</syntaxhighlight>

{| class=wikitable
! Parâmetro !! Descrição
|-
| alinhar        || direita ''(padrão)'', esquerda, centro, nenhum
|-
| direção        || horizontal ''(padrão)'', vertical
|-
| cor de fundo   || Para definir a cor de fundo da caixa na qual as imagens aparecem.
|-
| fundo_cabeçalho || 
|-
| alinhar_cabeçalho || centro ''(padrão)'', esquerda, direita
|-
| cabeçalho      || 
|-
| largura        || Use para definir a mesma largura para todas as imagem (ou seja, substitui qualquer {{parâmetro|largura[n]}} abaixo). Não inclua se pretender usar larguras de imagem diferentes, inclusive se as imagens tiverem que ser redimensionadas para uma largura total fixa.
|-
| largura_total  || Use para redimensionar as imagens para a mesma altura para totalizar essa largura total. Não use tanto {{parâmetro|largura_total}} quanto {{parâmetro|largura}}.
|-
| imagem''[n]''  || (onde ''[n]'' = 1 to 10)&nbsp; Nome do arquivo da [n]-ésima imagem.
|-
| largura''[n]'' || ''(mesmo que acima)''&nbsp; Dois significados: (1) A largura (em píxeis, número inteiro, omitir “px”) da [n]-ésima imagem. Substituída por {{parâmetro|largura}} (se definido). (2) A largura total da [n]-ésima imagem original se {{parâmetro|largura_total}} for fornecido para redimensionar todas as imagens para a mesma altura e uma determinada largura total.
|-
| altura''[n]''  || ''(mesmo que acima)''&nbsp; A altura total da [n]-ésima imagem original se {{parâmetro|largura_total}} for fornecida para redimensionar todas as imagens para a mesma altura e uma determinada largura total. Caso contrário, será ignorado.
|-
| alt''[n]''     || ''(mesmo que acima)''&nbsp; [[WP:ALT|Texto alternativo]] da [n]-ésima imagem.
|-
| link''[n]''    || ''(mesmo que acima)''&nbsp; A página vinculada à [n]-ésima imagem (ou seja, a página que é aberta quando a imagem é clicada).
* Se esse parâmetro for totalmente omitido, a imagem será vinculada à sua página de descrição da imagem como de costume (esse é de longe o caso de uso mais comum).
* Se esse parâmetro estiver presente, mas for deixado em branco (ou seja, {{parâmetro|link1|...}}), a imagem não será vinculada a nada — esse deve ser o caso apenas para imagens puramente decorativas, como descrito em [[WP:ALT]].
* '''Importante:''' Se a imagem estiver sob uma [[licença livre]] (como a [[GNU Free Documentation License|GDFL]] ou uma [[Licenças Creative Commons|licença CC]] livre), os termos dessa licença exigem que a licença, ou uma ligação para ela, seja reproduzida com a imagem. A imagem '''deve''', portanto, ter uma ligação para sua página de descrição da imagem, o que pode ser feito simplesmente omitindo o parâmetro link[n] da predefinição, conforme mencionado. Imagens de domínio público e (teoricamente) de uso não gratuito não estão sujeitas a essa restrição.
|-
| thumbtime''[n]'' || ''(mesmo que acima)''&nbsp; Ao usar arquivos de vídeo, define o tempo dentro do vídeo que é usado para a exibição inicial. Esse é um número em segundos ou horas:minutos:segundos; ver [[:commons:Commons:Video#Setting a video thumbnail image]].
|-
| legenda''[n]'' || ''(mesmo que acima)''&nbsp; Legenda da [n]-ésima imagem.
|-
| alinhar_legenda || esquerda ''(padrão)'', centro, direita
|-
| fundo_rodapé   || 
|-
| alinhar_rodapé || esquerda ''(padrão)'', centro, direita
|-
| rodapé         || Legenda que abrange a caixa inteira, em vez de imagens individuais. Evite “esquerda” e “direita” se possível, pois os dispositivos móveis podem [[#Usando direção|exibir as imagens verticalmente]].
|}

== Exemplos==

{{demo|invertido=1|<nowiki>{{imagem múltipla
 | largura = 60
 | imagem1 = Yellow card.svg
 | alt1 = Uma carta amarela
 | imagem2 = Red card.svg
 | alt2 = Uma carta vermelha
 | rodapé = Os jogadores são advertidos com um cartão amarelo e expulsos com um cartão vermelho.
}}</nowiki>}}

{{clear}}

{{demo|invertido=1|<nowiki>{{imagem múltipla
 | alinhar = esquerda
 | direção = vertical
 | largura = 200
 | cabeçalho = Demonstração de transparência do [[PNG]]
 | imagem1 = PNG transparency demonstration 1.png
 | alt1 = Dados coloridos com fundo branco
 | legenda1 = Uma imagem PNG com uma camada de transparência de 8 bits...
 | imagem2 = PNG transparency demonstration 2.png
 | alt2 = Dados coloridos com fundo quadriculado
 | legenda2 = ...e aqui sobrepondo um fundo quadriculado.
}}</nowiki>}}

{{clear}}

{{demo|invertido=1|<nowiki>{{imagem múltipla
 | largura = 60
 | imagem1=Ribbon numeral 2.png | alt1=2
 | imagem2=Ribbon numeral 3.png | alt2=3
 | imagem3=Ribbon numeral 4.png | alt3=4
 | rodapé = Quando um usuário tem muitos de um tipo de [[WP:Wikiamor|medalhas]], ele pode representá-las com fitas e esses números para indicar a contagem.
.
}}</nowiki>}}

{{clear}}

=== Com ''cor de fundo'' ===
{{demo|<nowiki>{{imagem múltipla
 | alinhar = esquerda
 | cor de fundo = #BBDD99
 | largura = 160
 | imagem1 = Adoxa_moschatellina_210406.jpg
 | alt1 = Erva verde com algumas pequenas flores amarelo-esbranquiçadas
 | imagem2 = Adoxa_moschatellina_210406a.jpg
 | alt2 = Três pequenas flores brancas e amarelas em um fundo de folhas verdes
 | imagem3 = adoxa_moschatellina_blatt.jpeg
 | alt3 = Folhas de uma planta, em grupos de três, cada uma com três lóbulos
 | fundo_rodapé = #33CC00
 | alinhar_rodapé = centro
 | rodapé = ''[[Adoxa]]'' (''Adoxa moschatellina'')
}}</nowiki>}}

{{clear}}

Se as imagens tiverem um fundo claro, ele será alterado para branco por padrão. Para fazer com que a cor de fundo das imagens coincida, defina-as com {{parâmetro|estilo_imagem|background-color:}}. Talvez você também queira remover a borda.

{{demo|<nowiki>{{imagem múltipla 
| alinhar = centro
| largura = 64 
| cor de fundo = black 
| estilo_imagem = background-color:black; border:none;
| imagem1 = Aries symbol (planetary color).svg|link1=Áries
| imagem2 = Taurus symbol (planetary color).svg|link2=Touro (astrologia)
| imagem3 = Gemini symbol (planetary color).svg|link3=Gêmeos (astrologia)
| imagem4 = Leo symbol (planetary color).svg|link4=Leão (astrologia)
}}</nowiki>}}

{{clear}}

=== Com ligações (''link[n]'') ===
{{demo|invertido=1|<nowiki>{{imagem múltipla
 | alinhar = esquerda

 | imagem1 = Mule (PSF).png
 | largura1 = 143
 | alt1 = Uma mula
 | link1 = Mula
 | legenda1 = Uma mula

 | imagem2 = Donkey 1 arp 750px.jpg
 | largura2 = 150
 | alt2 = Um burro
 | link2 = 
 | legenda2  = Um burro

 | imagem3 = Rainbow_trout.png
 | largura3 = 91
 | alt3 = Uma truta
 | legenda3  = Um peixe

 | rodapé = A imagem da mula está ligada a [[Mula]]; a imagem do burro não está ligada a nada; a imagem da truta está ligada a uma página de descrição de imagem padrão.
}}</nowiki>}}

{{clear}}

=== Usando ''direção'' ===

Por padrão, as imagens que a predefinição apresenta são exibidas horizontalmente, como uma linha (veja à esquerda; equivalente à configuração {{parâmetro|direção|horizontal}}). Para exibi-las verticalmente, ou seja, como uma coluna, defina {{parâmetro|direção|vertical}} (veja à direita).

{{imagem múltipla
 |alinhar=esquerda |direção=horizontal |cabeçalho=(horizontal) |largura=60
 |imagem1=Ribbon numeral 2.png |imagem2=Ribbon numeral 3.png |imagem3=Ribbon numeral 4.png
}}
{{imagem múltipla
 |alinhar=direita |direção=vertical |cabeçalho=(vertical) |largura=60
 |imagem1=Ribbon numeral 2.png |imagem2=Ribbon numeral 3.png |imagem3=Ribbon numeral 4.png
}}

{{clear}}

Em dispositivos móveis, algumas imagens podem ser sempre exibidas verticalmente se a largura total for maior que 320.

=== Para corresponder às alturas das imagens ===
{{Nota de cabeçalho|Observação: O seguinte é desnecessário se todas as imagens apresentadas pela predefinição tiverem a mesma proporção; nesse caso, basta definir a largura de acordo.}}
* Decida uma largura total para todas as imagens, por exemplo, <code>320px</code>
* Defina a largura total usando {{parâmetro|largura_total}}

{{demo|invertido=1|<nowiki>{{imagem múltipla
 | alinhar = direita
 | largura_total = 320

 | imagem1 = Donkey 1 arp 750px.jpg
 | alt1 = Uma mula
 | legenda1 = Uma imagem retangular de uma mula, originalmente 536 píxeis de altura.

 | imagem2 = Rainbow_trout.png
 | alt2 = Uma Truta
 | legenda2 = Uma imagem quadrada de uma truta, originalmente 300 píxeis de altura.

 | rodapé = Ambas imagens foram renderizadas com a mesma altura, e uma largura total de 320px
}}</nowiki>}}

{{clear}}

'''Usando os parâmetros {{parâmetro|largura[n]}} e {{parâmetro|altura[n]}}.'''

{{demo|invertido=1|<nowiki>{{imagem múltipla
 | alinhar = direita
 | largura_total = 480

 | imagem1 = Rainbow_trout.png
 | legenda1 = Uma imagem quadrada de uma truta, originalmente 300 x 300 píxeis.

 | imagem2 = Rainbow_trout.png
 | largura2 = 900
 | altura2 = 900
 | legenda2 = <code>largura2</code> x <code>altura2</code> = 900 x 900.
 
 | imagem3 = Rainbow_trout.png
 | largura3 = 100
 | altura3 = 200
 | legenda3 = <code>largura3</code> x <code>altura3</code> = 100 x 200.
 
 | imagem4 = Rainbow_trout.png
 | largura4 = 200
 | altura4 = 100
 | legenda4 = <code>largura4</code> x <code>altura4</code> = 200 x 100.
 
 | rodapé = Todas as imagens foram renderizadas para a mesma altura, exceto a imagem3, que tem 100/200 = 1/2 da altura das outras imagens. A imagem4 tem 200/100 = 2 vezes a altura da imagem1, portanto, somente sua metade superior é visível. Largura total definida como 480px.
}}</nowiki>}}

{{clear}}

A proporção de aspecto de cada imagem é retirada automaticamente dos metadados do arquivo. Você pode substituir os valores nativos de largura e altura
* Examinando as páginas individuais da imagem para obter a resolução total. Por exemplo:
** [[:Imagem:Donkey 1 arp 750px.jpg]] mostra "Donkey_in_Clovelly,_North_Devon,_England.jpg (750 × 536 píxeis, tamanho: 181 kB, tipo MIME: image/jpeg)"
** [[:Imagem:Rainbow trout.png]] mostra "Rainbow_trout.png (300 × 300 píxeis, tamanho: 158 kB, tipo MIME: image/png)"
* Especifique a largura e a altura completas de cada imagem, no formato:
** {{parâmetro|largura1}} {{parâmetro|altura1}}  {{parâmetro|largura2}} {{parâmetro|altura2}}

=== Múltiplas linhas ===

Para criar uma matriz de imagens, com múltiplas linhas, use {{parâmetro|porlinha}}. O valor passado para {{parâmetro|porlinha}} pode ser um único número ou uma lista de números delimitados por <code>/</code>.  Esse recurso também pode ser combinado com {{parâmetro|largura_total}} para ter várias linhas de imagens com a mesma largura total.

{{demo|invertido=1|<nowiki>{{imagem múltipla|porlinha=2|largura_total=300
| imagem1 = Kern_Theodolit_DKM2-A.jpg
| imagem2 = Total-Robotic-Station.jpg
| imagem3 = DumpyLevel.jpg
| imagem4 = GPS_Survey_Equipment_at_Weir_Dyke_Bridge_-_geograph.org.uk_-_336908.jpg
| rodapé = Equipamento de levantamento topográfico. No sentido horário, a partir do canto superior esquerdo: Teodolito óptico, estação total robótica, Estação base de um GPS [[Real Time Kinematic|RTK]], nível óptico.
}}</nowiki>}}

{{clear}}

=== Remover a borda da imagem ===

A borda pode ser removida usando {{parâmetro|estilo_imagem|border:none}}

{{demo|invertido=1|<nowiki>{{imagem múltipla
 | alinhar = direita
 | largura_total = 320
 | estilo_imagem = border:none;

 | imagem1 = Donkey 1 arp 750px.jpg
 | alt1 = Uma mula
 | legenda1 = Imagem de uma mula

 | imagem2 = Rainbow_trout.png
 | alt2 = Uma truta
 | legenda2 = Imagem de uma truta
}}</nowiki>}}

{{clear}}

=== Aumentar o espaçamento entre imagens ===

O espaçamento entre as imagens pode ser aumentado usando {{parâmetro|espaçamento_imagem|N}}, em que N é o número de pixels (deve ser não negativo).

{{demo|invertido=1|<nowiki>{{imagem múltipla
 | alinhar = direita
 | largura_total = 320
 | espaçamento_imagem = 20

 | imagem1 = Donkey 1 arp 750px.jpg
 | alt1 = Uma mula
 | legenda1 = Imagem de uma mula

 | imagem2 = Rainbow_trout.png
 | alt2 = Uma truta
 | legenda2 = Imagem de uma truta
}}</nowiki>}}

{{clear}}

=== Invocar o módulo diretamente ===

Em páginas grandes, múltiplos usos dessa predefinição pode contribuir para que a página exceda o [[WP:LIMITE|limite máximo de tamanho de inclusão após expansão]]. Para reduzir o tamanho do inclusão, [[Módulo:Imagem múltipla]] pode ser invocado diretamente da seguinte forma (observe o caractere | extra após o nome do módulo):

{{demo|invertido=1|<nowiki>{{#invoke:Imagem múltipla|
 | largura = 60
 | imagem1 = OOjs UI icon wikiTemplate.svg
 | imagem2 = Cib-lua (CoreUI Icons v1.0.0).svg
}}</nowiki>}}

{{clear}}

{{Cabeçalho de TemplateData}}

== Categorias de monitoramento ==
* {{clc|!Páginas que usam imagem múltipla com imagens com escalas automáticas}}
* {{clc|!Páginas que usam imagem múltipla com imagens com escalas manuais}}

== Ver também ==
* {{tl|Galeria}}
* {{tl|Imageframe}}
* {{tl|Matriz de imagens}}
* {{tl|Montagem fotográfica}}
* {{tl|Imagem dupla}}
* {{tl|Stack}}

<includeonly>{{Testes outro||
<!-- Categorias abaixo desta linha, por favor; interwikis no Wikidata -->
[[Categoria:!Predefinições gráficas]]
[[Categoria:!Predefinições de formatação e função de imagem]]
[[Categoria:!Predefinições que adicionam categorias de manutenção]]
}}</includeonly>