Una galería muestra varias imágenes en una matriz o diseño similar.
Las galerías pueden mostrar imágenes formadas en filas y columnas mediante el uso de la etiqueta <gallery>...</gallery>
analizador (conversión de Wikitext a HTML). Tenga en cuenta que los diferentes tamaños de pantalla y navegadores pueden afectar la accesibilidad para algunos lectores.
Los atributos y valores van después de la palabra gallery
y un espacio en blanco, y antes del corchete angular final:<gallery attributes...>
mode=
traditional
Predeterminado, el efecto se explica a continuaciónnolines
Sin bordes, menos relleno, títulos centrados debajo de las imágenespacked
Todas las imágenes alineadas con la misma altura, justificadas y títulos centrados debajo de las imágenes.packed-overlay
Como empaquetado, pero el título se superpone a la imagen, en una caja translúcida.packed-hover
Como superposición empaquetada, pero el título solo es visible al pasar el mouse (se degrada elegantemente en los lectores de pantalla y vuelve a la superposición empaquetada si se usa una pantalla táctil)slideshow
Diapositivascaption=
Agrega un título (o título) general encima de la galería; para varias palabras, encierre entre comillas dobleswidths=
Anchos de imagen en píxeles (no tiene ningún efecto si el modo está configurado en empaquetado, superposición empaquetada, desplazamiento flotante o presentación de diapositivas)heights=
Alturas de imagen en píxeles (no tiene efecto si el modo está configurado en presentación de diapositivas)perrow=
Número de imágenes por fila (no tiene ningún efecto si el modo está configurado en empaquetado, superposición empaquetada, desplazamiento flotante o presentación de diapositivas; consulte las notas de uso a continuación )showfilename=yes
Mostrar cada nombre de archivo debajo de la imagen correspondienteclass=
Uno o más nombres de clases separados por espacios y entre comillas doblesstyle=
Una o más declaraciones CSS separadas por punto y coma y entre comillas doblesperrow
atributo, porque anula el uso flexible de diferentes tamaños de pantalla y relaciones de aspecto , que van desde pantallas móviles en miniatura hasta pantallas anchas de "cine". Sin embargo, el atributo debe usarse cuando sea apropiada una disposición de cuadrícula fija , como "antes/después", "bajo/medio/alto" u otras comparaciones sistemáticas de imágenes.perrow
se omite, el ancho es fluido: una fila comprende tantas imágenes como quepan en el ancho disponible de la pantalla del usuario, ajustándose automáticamente a tantas líneas adicionales como sea necesario.perrow
es ahora el valor predeterminado recomendado . Antes de MediaWiki 1.17, el valor predeterminado era 4.<Gallery>...</Gallery>
etiqueta no obedecen a las preferencias de visualización del usuario.packed
modo ajustará automáticamente los tamaños de las imágenes para utilizar de manera óptima el espacio de visualización disponible.File:
prefijo es innecesario.</gallery>
etiqueta de cierre.Al cargar imágenes usando Insertar > Imágenes y medios, obtendrá lo siguiente:[[File:Name of file|thumb|Caption]]
En una galería, debes eliminar todos los corchetes ("[" o "]") (excepto en los wikilinks que están incrustados dentro de los subtítulos ). También debes eliminar el |thumb
. Finalmente, elimine el File:
prefijo. Te quedará lo siguiente:Name of file|Caption
Esto es aceptable para la galería. Si no desea incluir un título, elimínelo .|Caption
Hay varios "modos" de galerías.
tradicional :
El modo "tradicional" es actualmente el predeterminado y, como tal, no es necesario especificarlo. La sintaxis básica es:
<galería>
Detroit Publishing Co. - Un Yeoman of the Guard (NB en realidad un Yeoman Warder), restauración completa.jpg |1Programa_oficial_-_Proceso_de_sufragio_mujer_3 de marzo_1913_-_crop.jpg|2Thurston, el famoso mago - Truco con la cuerda de las Indias Orientales.jpg |3 Joseph Ferdinand Keppler - The Pirate Publisher - Revista Puck - Restauración por Adam Cuerden.jpg|4 </gallery>
Lo que da:
Si desea asegurarse de que cualquier cambio futuro en el modo de galería predeterminado mantendrá este estilo de galería, puede especificar "modo=tradicional", similar a los ejemplos siguientes.
no líneas :
Al especificar el parámetro de modo "nolines", se eliminan los cuadros. Usando la misma sintaxis que antes, pero reemplazando <gallery>
con <gallery mode=nolines>
obtenemos:
embalado :
Cambiar <gallery>
a <gallery mode=packed>
produce una galería centrada , con un espacio de ligeramente a significativamente menor alrededor de cada imagen (dependiendo de su ancho y alto relativos), como se muestra a continuación. Puede ampliar relativamente algunas imágenes que eran más pequeñas en las vistas anteriores.
Para subtítulos largos debajo de imágenes estrechas, probablemente sea mejor agregar un heights=
parámetro para hacer las imágenes un poco más grandes, ya que el tamaño pequeño predeterminado puede generar imágenes feas. Vea abajo.
Superposición empaquetada :se utiliza<gallery mode=packed-overlay>
para producir títulos que se superponen a la parte inferior de la imagen. Probablemente sea mejor que los subtítulos sean breves.
Hover empaquetado :
Esto usa <gallery mode=packed-hover>
. Pase el mouse sobre las imágenes a continuación.
Además del modo, la sintaxis extendida es (consulte la ayuda de la etiqueta de la galería y más adelante para obtener una lista completa de parámetros):
<gallery caption= "Galería de muestra" anchos= "180px" altos= "120px" > Wiki.png|SubtituladoWiki.png|alt=El logotipo de Wikipedia |Subtitulado con texto alternativo Wiki.png|[[Ayuda:Contenidos/Enlaces|Enlaces]] se puede poner en subtítulos. Wiki.png| [[MediaWiki]] completo <br /> [[sintaxis]] ahora se puede utilizar... </gallery>
Que produce:
Los parámetros widths=
y perrow=
no hacen nada en los modos empaquetado, superposición empaquetada o desplazamiento flotante, y class="center"
no hacen nada cuando perrow=
se usan.
Sin embargo, el heights=
parámetro puede resultar extremadamente útil en estos modos. Este parámetro especifica la altura inicial para representar cada miniatura de imagen, antes de que JavaScript pueda ampliar las imágenes (manteniendo su proporción de tamaño) para llenar filas; cuando sea necesario, Javascript consultará al servidor de imágenes para obtener miniaturas redimensionadas para varias escalas entre 100% (la altura inicial especificada) y aproximadamente 125%. Esto proporciona galerías atractivas que pueden llenar páginas incluso cuando su proporción de tamaño no es exactamente la misma y permite utilizar el área real disponible para mostrar en dispositivos móviles estrechos y portátiles/computadores de escritorio/TV grandes, e imprimir en varios formatos de papel. (Este modo también permite galerías de desplazamiento automático horizontal incrustándolas en un contenedor grande dentro de un contenedor desplazable de tamaño adecuado al ancho de la página).
Por ejemplo, tome lo siguiente:
<gallery mode= "packed" >
Detroit Publishing Co. - Un Yeoman of the Guard (NB en realidad un Yeoman Warder), restauración completa.jpg |Un Yeoman Warder, de un [[fotocromo]] de la época victoriana Official_program_-_Woman_suffrage_procession_March_3,_1913_-_crop.jpg|El programa oficial de la Procesión por el Sufragio Femenino de 1913 celebrada en Washington, DC Thurston, el famoso mago - East Indian Rope Trick.jpg|[[Howard Thurston]] realizando el [[ truco indio con la cuerda ]] Joseph Ferdinand Keppler - The Pirate Publisher - Revista Puck - Restauración por Adam Cuerden.jpg|"The Pirate Publisher", una sátira de la infracción de derechos de autor de la revista ''[[Puck (revista)|Puck]]''.</galería>
da:
Como puede ver, la estrechez de la imagen distorsiona el título. Esto se puede solucionar fácilmente agregando el heights=
parámetro como tal.
<modo galería = alturas empaquetadas = 200px > Detroit Publishing Co. - Un Yeoman of the Guard (NB en realidad un Yeoman Warder), restauración completa.jpg |Un Yeoman Warder, de un [[fotocromo] de la época victoriana Official_program_-_Woman_suffrage_procession_March_3,_1913_-_crop.jpg|El programa oficial de la Procesión por el Sufragio Femenino de 1913 celebrada en Washington, DC Thurston, el famoso mago - East Indian Rope Trick.jpg|[[Howard Thurston]] realizando el [[ truco indio con la cuerda ]] Joseph Ferdinand Keppler - The Pirate Publisher - Revista Puck - Restauración por Adam Cuerden.jpg|"The Pirate Publisher", una sátira de la infracción de derechos de autor de la revista ''[[Puck (revista)|Puck]]''.</galería>
da:
Otro consejo para utilizar el modo empaquetado es mantener los subtítulos de imágenes particularmente estrechas tan breves como sea conveniente.
Para todos los modos excepto el tradicional, los subtítulos están centrados. Para alinear los títulos a la izquierda, especifique la declaración CSS text-align:left
en el style=
atributo:
< modo galería = alturas empaquetadas = 150px estilo= "text-align:left" >
Detroit Publishing Co. - Un Yeoman of the Guard (NB en realidad un Yeoman Warder), restauración completa.jpg |Un Yeoman Warder, de la época victoriana [[fotocromo]] Official_program_-_Woman_suffrage_procession_March_3,_1913_-_crop.jpg|El programa oficial de la Procesión por el Sufragio Femenino de 1913 celebrada en Washington, DC Joseph Ferdinand Keppler - The Pirate Publisher - Revista Puck - Restauración por Adam Cuerden.jpg|"The Pirate Publisher", una sátira de la infracción de derechos de autor de la revista ''[[Puck (revista)|Puck]]''.</galería>
da:
Para centrar un título cuando otras opciones no son efectivas, quizás la alternativa más confiable sea usar:
yourimage.jpg | <div style="text-align: center;">yourcaption</div>
Para centrar una galería utilice class="center"
:
< clase de galería = "centro" > Detroit Publishing Co. - Un Yeoman of the Guard (NB en realidad un Yeoman Warder), restauración completa.jpg|1Programa_oficial_-_Proceso_de_sufragio_mujer_3 de marzo_1913_-_crop.jpg|2Thurston, el famoso mago - Truco con la cuerda de las Indias Orientales.jpg|3Joseph Ferdinand Keppler - The Pirate Publisher - Revista Puck - Restauración por Adam Cuerden.jpg|4</ galería >
Lo que da:
El uso del perrow
atributo hará que esto no funcione. Cuando se desee un número específico de imágenes por fila, utilice <gallery>
elementos separados. Las galerías centradas son las predeterminadas para la mayoría de los modos de galería variantes.