Guide de rédaction/Galerie d'images

De EncyclopAtys

< Guide de rédaction
Révision datée du 7 août 2020 à 14:37 par Craftjenn (discussion | contributions) (Slideshow avec titre caption)
    Script edit.png État des traductionsCette page est l'une des 25 que nous aimerions voir traduites en français.
De.png Übersetzung angefordertGb.png Translation requestedEs.png No traducidoFr.png OriginalRu.png Не переведено


Si l'on a plusieurs images, on peux utiliser la "galerie de fichiers".

  • Soit via la barre d'outil en mode édition du wiki: cliquer sur Avancé pour développer le Mode Avancé comme dans l'image au dessus, de façon à voir l’icône juste à droite de "Insérer".
En mode d'édition d'une page, voici la barre d'outil d'édition du wiki, en Mode Avancé
  • Soit directement via le code wiki - ce qui s'avère dans ce cas le plus simple, en insérant par exemple ce simple code:


<gallery>
Image1.png|La description, date du lucio...
Dummy.png|Description 2
</gallery>

Cela facilite la lecture/modification du code wiki, car avec les balises gallery, chaque image sera sur une ligne (dans le code wiki), avec une syntaxe simple : nomdufichier.jpg la "barre verticale" (AltGr+6) et une description (pouvant être mis en forme, contenir des liens vers d'autres pages,...) :

Des exemples

  • Le code <gallery>....</gallery>, utilisé plus haut utilise par défaut le mode traditional.

Avec beaucoup d'images de tailles similaires, avec des balises caption (titre), widths (largeur) et heights (hauteur) :
code: <gallery caption="Un titre avec caption" widths="180px" heights="120px" >>


Et la meme avec le code <gallery caption="en 50px" heights="50px" >>


La même, avec <gallery mode=nolines>

<gallery mode=packed>

Les images sont affichées avec une hauteur identique, la largeur pouvant varier pour respecter le ratio original.

avec <gallery mode=packed> moins l'image trop large : centré et gain de place

<gallery mode="packed-hover" heights=64px perrow=7 >

mode=packed-overlay

<gallery mode=packed-overlay>

Slideshow avec titre caption

<div style="max-width: 350px;"> <gallery caption="Titre exemple" mode=slideshow>... </gallery> </div>

Similaire (2 images) avec hauteur plus petite (heights="20px") est KO

La syntaxe

Source : https://fr.wikipedia.org/wiki/Aide:Galerie et https://fr.wikipedia.org/wiki/Aide:Galerie/avanc%C3%A9e

Attributs et valeurs utiles

Réduire la taille avec une balise div (un ex ici): <div style="width:600px"> ... </div>