FANDOM


Cette page décrit comment utiliser et personnaliser les galeries d'images, diaporamas et carrousels en utilisant le wikitexte.

Consultez aussi Aide:Galeries, diaporamas et carrousels pour les bases. Veuillez noter que les vidéos sont aussi supportées pour les galeries et carrousels, si les nouvelles galeries d'images ne sont pas activées.

GalerieModifier

Une galerie est une série de miniatures affichées sous forme de tuiles sur la page.

Exemple simpleModifier

Voici le code de base pour les galeries :

<gallery>
Example1.png
Example2.png
Example3.png
</gallery>

Autres exemplesModifier

Le code suivant produira une galerie plus complexe :

<gallery navigation="true">
Example1.png
Example2.png|Avec légende
Example3.png|Le '''[[Aide:Wikitexte|wikitexte]]''' peut être utilisé dans les légendes
Example4.png|link=Aide:Contenu|Cette image renvoie vers [[Aide:Contenu]]
</gallery>

Dans cet exemple :

  • Le premier élément est une image seule
  • Le deuxième élément est une image avec une légende
  • Le troisième élément est une image avec une légende qui comprend du wikitexte
  • Le quatrième élément est une image qui renvoie vers une page de wiki, suivie par une légende

Si vous souhaitez utiliser des variables au lieu d'images, vous aurez besoin d'utiliser une forme légèrement différente des balises de galerie telle que ci-après (avec trois variables et quelques réglages définis) :

{{#tag:gallery|
{{{1|}}}
{{{2|}}}
{{{3|}}}
|hideaddbutton="true"
|crop="true"
}}

DiaporamaModifier

Un diaporama est un module d'images qui affiche une image à la fois et les fait défiler automatiquement.

  • Chatons !
  • Chiots !
  • Singes !
  • Girafes !

Exemple simpleModifier

Voici le code de base pour les diaporamas :

<gallery type="slideshow">
Example1.png
Example2.png
Example3.png
</gallery>

Autres exemplesModifier

Le code suivant génère un diaporama plus complexe :

<gallery type="slideshow" hideaddbutton="true" navigation="true">
Example1.png
Example2.png|Avec légende
Example3.png|Le  '''[[Aide:Wikitexte|wikitexte]]''' peut être utilisé dans les légendes
Example4.png|Cliquer sur l'image vous emmène sur [[Aide:Contenu]]|link=Aide:Contenu|linktext=Aide:Contenu
</gallery>

Dans cet exemple :

  • Le premier élément est une image seule.
  • Le deuxième élément est une image avec une légende.
  • Le troisième élément est une image avec une légende qui comprend du wikitexte.
  • Le quatrième élément est une image qui renvoie vers une page de wiki. Il inclut aussi une légende, ainsi qu'un texte pour le lien.

CarrouselModifier

Un carrousel est un module d'image qui prend toute la la largeur de la page et fait défiler jusqu'à 4 images.

Astuce : pour un meilleur résultat, utilisez des images dont la taille est exactement 670 x 360px.

Exemple simpleModifier

Voici le code de base pour les carrousels :

<gallery type="slider">
Example1.png
Example2.png
Example3.png
</gallery>

Autres exemplesModifier

Le code suivant génère un carrousel plus complexe :

<gallery type="slider">
Example1.png
Example2.png|Exemple deux
Example3.png|Exemple trois|linktext=Super liens
Example4.png|Exemple quatre|link=Aide:Contenu|linktext=Pages intéressantes
</gallery>

Dans cet exemple :

  • Le premier élément est une image seule.
  • Le deuxième élément est une image avec un titre.
  • Le troisième élément est une image avec un titre et un sous-titre.
  • Le quatrième élément est une image liée à une page de wiki. Il inclut aussi une légende, ainsi qu'un texte pour le lien.

Wikitexte et optionsModifier

Le tableau suivant liste les options de personnalisation pour chacun des trois modules d'images.

GalerieModifier

Type Options wikitexte Par défaut
Options de mise en page
Largeur des images (max) widths=<nombre de pixels> 200px
Nombre de colonnes columns=<nombre de colonnes> ou perrow=<nombre de colonnes> S'adapte à la page*
* Si columns n'est pas indiqué, le nombre d'images affichées par ligne sera automatiquement ajusté en fonction de la taille de la fenêtre du navigateur
Position de la galerie position=[left|center|right] left
Espacement des images spacing=[small|medium|large] medium
Orientation et rognage des images orientation=[none|landscape|portrait|square] none (aucun)
Options de légende
Position de la légende captionposition=[within|below] below
Alignement de la légende captionalign=[left|center|right] left
Couleur de la légende captiontextcolor=<code hexadécimal couleur> Couleur du texte de l'article
Options de bordure
Épaisseur de la bordure bordersize=[none|small|medium|large] small
Couleur de la bordure bordercolor=<code hexadécimal couleur> Style du thème nommé accent
Autre
Masquer le bouton « ajouter une image » hideaddbutton=true Non masqué
Légende de galerie caption=<texte affiché> Pas de légende
Images
Les images sont séparées par un saut de ligne.
Les légendes ne sont pas obligatoires. Les crochets ne sont utilisés que pour ajouter des liens dans les légendes.
Les liens ne sont pas obligatoires et utilisent link=

DiaporamaModifier

Type Options wikitexte Par défaut
Options de mise en page
Largeur des images (max) widths=<nombre de pixels> 300px
Rognage crop=true Pas de rognage
Afficher les importations récentes showrecentuploads=true N'affiche pas
Position du diaporama position=[left|center|right] right
Autre
Masquer le bouton « ajouter une image » hideaddbutton=true Non masqué
Légende du diaporama caption=<texte affiché> Pas de légende
Images
Les images sont séparées par un saut de ligne.
Les légendes ne sont pas obligatoires. Les crochets ne sont utilisés que pour ajouter des liens dans les légendes.
Les liens ne sont pas obligatoires et utilisent link=

CarrouselsModifier

Type Options wikitexte Par défaut
Options de mise en page
Alignement orientation=[left|right] left
Images
Les images sont séparées par un saut de ligne.
Les titres ne sont pas obligatoires.
Les liens ne sont pas obligatoires et utilisent link=
Les sous-titres ne sont pas obligatoires et utilisent linktext=

Voir aussiModifier

Plus d'aideModifier

Sauf mention contraire, le contenu de la communauté est disponible sous licence CC-BY-SA  .