Predefinição:Imagem múltipla/Testes
 | Esta é a página de testes de predefinições de Predefinição:Imagem múltipla (dif). Ver também exemplos para testes na subpágina acompanhante. |
 | Esta predefinição usa Lua: |
 | Essa predefinição utiliza TemplateStylesEN: |
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
editarForneça os parâmetros |altura[n]= ou |largura_total= para obter o redimensionamento automático. Observe os diferentes significados dos parâmetros |largura[n]= com ou sem redimensionamento automático. Observe também a opção de definir um parâmetro |largura_total= no início da predefinição {{Imagem múltipla}}.
- Redimensionamento automático de todas as imagens para a mesma altura e para uma determinada largura total
{{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, sim 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é --> }}
- Sem redimensionamento automático de todas as imagens para a mesma altura
{{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, sim o prefixo "Ficheiro:" ou "Imagem:" --> | alt1 = | link1 = | thumbtime1 = | legenda1 = <!--imagem 2--> | imagem2 = <!-- apenas o nome do arquivo, ou seja, sim 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é --> }}
| 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 |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 |largura_total= quanto |largura=.
|
| imagem[n] | (onde [n] = 1 to 10) Nome do arquivo da [n]-ésima imagem. |
| largura[n] | (mesmo que acima) Dois significados: (1) A largura (em píxeis, número inteiro, omitir “px”) da [n]-ésima imagem. Substituída por |largura= (se definido). (2) A largura total da [n]-ésima imagem original se |largura_total= for fornecido para redimensionar todas as imagens para a mesma altura e uma determinada largura total.
|
| altura[n] | (mesmo que acima) A altura total da [n]-ésima imagem original se |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) Texto alternativo da [n]-ésima imagem. |
| link[n] | (mesmo que acima) A página vinculada à [n]-ésima imagem (ou seja, a página que é aberta quando a imagem é clicada).
|
| thumbtime[n] | (mesmo que acima) 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) 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 exibir as imagens verticalmente. |
Exemplos
editar
Os jogadores são advertidos com um cartão amarelo e expulsos com um cartão vermelho.
{{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.
}}
Demonstração de transparência do PNG
Uma imagem PNG com uma camada de transparência de 8 bits...
...e aqui sobrepondo um fundo quadriculado.
{{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.
}}
Quando um usuário tem muitos de um tipo de medalhas, ele pode representá-las com fitas e esses números para indicar a contagem.
.
{{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.
.
}}
Com cor de fundo
editar{{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'')
}}
Adoxa (Adoxa moschatellina)
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 |estilo_imagem=background-color:. Talvez você também queira remover a borda.
{{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)
}}
Com ligações (link[n])
editar
Uma mula
Um burro
Um peixe
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.
{{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.
}}
Usando direção
editarPor padrão, as imagens que a predefinição apresenta são exibidas horizontalmente, como uma linha (veja à esquerda; equivalente à configuração |direção=horizontal). Para exibi-las verticalmente, ou seja, como uma coluna, defina |direção=vertical (veja à direita).
(horizontal)
(vertical)
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
editar- Decida uma largura total para todas as imagens, por exemplo,
320px - Defina a largura total usando
|largura_total=
Uma imagem retangular de uma mula, originalmente 536 píxeis de altura.
Uma imagem quadrada de uma truta, originalmente 300 píxeis de altura.
Ambas imagens foram renderizadas com a mesma altura, e uma largura total de 320px
{{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
}}
Usando os parâmetros |largura[n]= e |altura[n]=.
Uma imagem quadrada de uma truta, originalmente 300 x 300 píxeis.
largura2 x altura2 = 900 x 900.largura3 x altura3 = 100 x 200.largura4 x altura4 = 200 x 100.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.
{{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.
}}
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:
|largura1=|altura1=|largura2=|altura2=
Múltiplas linhas
editarPara criar uma matriz de imagens, com múltiplas linhas, use |porlinha=. O valor passado para |porlinha= pode ser um único número ou uma lista de números delimitados por /. Esse recurso também pode ser combinado com |largura_total= para ter várias linhas de imagens com a mesma largura total.
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 RTK, nível óptico.
{{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.
}}
Remover a borda da imagem
editarA borda pode ser removida usando |estilo_imagem=border:none
Imagem de uma mula
Imagem de uma truta
{{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
}}
Aumentar o espaçamento entre imagens
editarO espaçamento entre as imagens pode ser aumentado usando |espaçamento_imagem=N, em que N é o número de pixels (deve ser não negativo).
Imagem de uma mula
Imagem de uma truta
{{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
}}
Invocar o módulo diretamente
editarEm páginas grandes, múltiplos usos dessa predefinição pode contribuir para que a página exceda o 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):
.svg){kind=icon}
{{#invoke:Imagem múltipla|
| largura = 60
| imagem1 = OOjs UI icon wikiTemplate.svg
| imagem2 = Cib-lua (CoreUI Icons v1.0.0).svg
}}
Cabeçalho de TemplateData
As informações a seguir (editar) são definidas com TemplateData. Isso possibilita o seu uso pelo Editor Visual e por outras ferramentas. Predefinição:Imagem múltipla/Testes/dados
Categorias de monitoramento
editar- Categoria:!Páginas que usam imagem múltipla com imagens com escalas automáticas (1 130)
- Categoria:!Páginas que usam imagem múltipla com imagens com escalas manuais (125)
Ver também
editar- {{Galeria}}
- {{Imageframe}}
- {{Matriz de imagens}}
- {{Montagem fotográfica}}
- {{Imagem dupla}}
- {{Stack}}