Skip to main content

Diferenças entre edições de "Ajuda:Imagens"

m (Substituindo texto 'Wiki Fórum SCP' por 'Wiki Sporting')
m (→‎Galeria de imagens: Novas formatações de imagens)
Linha 54: Linha 54:
  
 
== Galeria de imagens ==
 
== Galeria de imagens ==
−
É muito fácil criar uma galeria usando a sintaxe '''<nowiki><gallery></nowiki>''':
+
É muito fácil criar uma galeria usando a sintaxe <nowiki><gallery></nowiki>:
 
<pre><gallery>
 
<pre><gallery>
 
Image:"Nome da imagem 1"|"Legenda"
 
Image:"Nome da imagem 1"|"Legenda"
Linha 69: Linha 69:
  
 
<gallery>
 
<gallery>
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery>
 +
 +
Podemos também alterar a formatação das galerias usando o parâmetro <code>mode</code> (ainda experimental):
 +
 +
* <code>traditional</code> formatação original da galeria.
 +
* <code>nolines</code> semelhante à formatação <code>traditional</code>, mas sem as linhas das bordas.
 +
* <code>packed</code> todas as imagens ficam com a mesma altura, sendo alterada automaticamente a largura. É uma formatação ''responsive'' que se ajusta ao tamanho do écran do dispositivo que estamos a usar.
 +
* <code>packed-overlay</code> mostra a legenda sobreposta com as imagens, inserida numa caixa semi-transparente.
 +
* <code>packed-hover</code> semelhante à formatação <code>packed-overlay</code>, porém a legenda apenas aparece quando se passa com o rato por cima da imagem.
 +
 +
Exemplos:
 +
 +
<pre><gallery mode="traditional">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery></pre>
 +
 +
<gallery mode="traditional">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery>
 +
 +
<pre><gallery mode="nolines">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery></pre>
 +
 +
<gallery mode="nolines">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery>
 +
 +
<pre><gallery mode="packed">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery></pre>
 +
 +
<gallery mode="packed">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery>
 +
 +
<pre><gallery mode="packed-overlay">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery></pre>
 +
 +
<gallery mode="packed-overlay">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery>
 +
 +
<pre><gallery mode="packed-hover">
 +
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 +
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 +
Image:A_imagens.jpg|Banner do Fórum
 +
</gallery></pre>
 +
 +
<gallery mode="packed-hover">
 
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 
Image:Marinho_Peres.jpg|[[Marinho Peres]]
 
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
 
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]

Revisão das 18h16min de 24 de setembro de 2016

Esta página explica os passos necessários para incluir imagens numa edição na Wiki.

Antes de poder incluir imagens tem que as carregar, ou seja, fazer o upload para a Wiki. Para saber mais, aceda à página Ajuda:Carregar ficheiro.

Inserir imagens numa moldura

É recomendado que use este método para incluir imagens nas páginas da Wiki. Para isso, utilize a seguinte sintaxe:

  • Sintaxe recomendada:
[[Imagem:"Nome da imagem"|thumb|"Legenda"]]
  • Sintaxe completa:
[[Imagem:"Nome da imagem"|thumb|"Alinhamento"|"Largura"|"Legenda"]]

Legenda da sintaxe:

  • Nome da imagem: coloque o nome completo da imagem, incluindo a extensão. Exemplo: A_imagens.jpg.
  • thumb: existem outros formatos mas este é o mais aconselhado. Cria uma moldura com legenda.
  • Alinhamento (opcional): define o alinhamento horizontal da imagem usando os valores left (à esquerda), center (ao centro), right (à direita) e none (pré-definido: no caso de thumb, o alinhamento é à direita).
  • Largura (opcional): especifica a largura da imagem em px (pixeis), por exemplo, 100px. Normalmente, não se deve especificar a largura das imagens, de forma a que esta possa ser definida segundo as preferências do utilizador.
  • Legenda: como o nome indica, é a legenda da imagem, podendo ser uma breve descrição ou uma ligação. Caso não seja preenchido, a legenda é igual ao nome da imagem.

Exemplo (com largura definida pelo editor): 

[[Image:A_imagens.jpg|thumb|center|500px|Banner do Fórum SCP - Porta 10A]]
Banner do Fórum SCP - Porta 10A

Exemplo (com largura definida pelas preferências do usuário - por defeito, 180px): 

[[Image:A_imagens.jpg|thumb|Banner do Fórum SCP - Porta 10A]]
Banner do Fórum SCP - Porta 10A



Ligar directamente a uma imagem

Este é o método recomendado para se referir a uma imagem numa página de discussão - atenção, é recomendado que utilize o Fórum da Wiki. Para criar uma ligação directa para uma imagem use uma ligação do tipo media: 

[[media:"Nome da imagem"]]

Exemplo: 

[[media:A_imagens.jpg]]

media:A_imagens.jpg

Tal como nas ligações para páginas, também pode alterar o nome da ligação: 

[[media:A_imagens.jpg|Banner do Fórum SCP]]

Banner do Fórum SCP

Ligar à pagina de descrição

Se quiser criar uma ligação para a página de descrição de uma imagem (não se esqueça de colocar os "dois pontos" antes da palavra "Imagem"): 

[[:Imagem:"Nome da imagem"]]

Exemplo: 

[[:Imagem:A_imagens.jpg]]

Imagem:A_imagens.jpg

Tal como nas ligações para páginas, também pode alterar o nome da ligação: 

[[:Imagem:A_imagens.jpg|Página de descrição do Banner do Fórum SCP]]

Página de descrição do Banner do Fórum SCP

Galeria de imagens

É muito fácil criar uma galeria usando a sintaxe <gallery>: 

<gallery>
Image:"Nome da imagem 1"|"Legenda"
Image:"Nome da imagem 2"|"Legenda"
...
</gallery>

Exemplo: 

<gallery>
Image:Marinho_Peres.jpg|[[Marinho Peres]]
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
Image:A_imagens.jpg|Banner do Fórum
</gallery>

Podemos também alterar a formatação das galerias usando o parâmetro mode (ainda experimental):

  • traditional formatação original da galeria.
  • nolines semelhante à formatação traditional, mas sem as linhas das bordas.
  • packed todas as imagens ficam com a mesma altura, sendo alterada automaticamente a largura. É uma formatação responsive que se ajusta ao tamanho do écran do dispositivo que estamos a usar.
  • packed-overlay mostra a legenda sobreposta com as imagens, inserida numa caixa semi-transparente.
  • packed-hover semelhante à formatação packed-overlay, porém a legenda apenas aparece quando se passa com o rato por cima da imagem.

Exemplos: 

<gallery mode="traditional">
Image:Marinho_Peres.jpg|[[Marinho Peres]]
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
Image:A_imagens.jpg|Banner do Fórum
</gallery>
<gallery mode="nolines">
Image:Marinho_Peres.jpg|[[Marinho Peres]]
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
Image:A_imagens.jpg|Banner do Fórum
</gallery>
<gallery mode="packed">
Image:Marinho_Peres.jpg|[[Marinho Peres]]
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
Image:A_imagens.jpg|Banner do Fórum
</gallery>
<gallery mode="packed-overlay">
Image:Marinho_Peres.jpg|[[Marinho Peres]]
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
Image:A_imagens.jpg|Banner do Fórum
</gallery>
<gallery mode="packed-hover">
Image:Marinho_Peres.jpg|[[Marinho Peres]]
Image:Francisco_stromp.jpg‎|[[Francisco Stromp]]
Image:A_imagens.jpg|Banner do Fórum
</gallery>

Sugestões

Existem casos especiais em que é necessário especificar a largura de uma imagem:

  • Em predefinições, pois as imagens sem tamanho definido poderiam sair do espaço destinado à página;
  • Em imagens com gráficos ou diagramas demasiado complexos para uma imagem pequena, sendo necessário aumentar o tamanho para se tornarem compreensíveis;
  • Em imagens panorâmicas, devido à relação largura-altura;
  • Por forma a manter uma boa apresentação da página.

O uso das galerias de imagens nas páginas deve ser evitado porque:

  • A página pode ficar muito "pesada" para o browser a carregar. Por isso, procure manter uma boa relação qualidade/tamanho do ficheiro;
  • As imagens nas páginas da Wiki têm como objectivo ilustrar e ajudar a compreender o seu assunto e não o contrário.

A Wiki Sporting permite também a inserção de vídeos alojados em serviços externos. Saiba como em Ajuda:Vídeos.

Obtida de "https://www.wikisporting.com/index.php?title=Ajuda:Imagens&oldid=170559"