De EncyclopAtys
m |
|||
| (23 révisions intermédiaires par 3 utilisateurs non affichées) | |||
| Ligne 1 : | Ligne 1 : | ||
| − | + | {{TIP|DE=4|EN=3|ES=|FR=0|RU=}} | |
| − | + | <noinclude>{{Trad|DE=Anleitung zum Schreiben/Bildergalerie|FR=Guide de rédaction/Galerie d'images|EN=Writing Guide/Image gallery|palette=wiki|H=1}}</noinclude> | |
Si l'on a plusieurs images, on peux utiliser la "galerie de fichiers". | Si l'on a plusieurs images, on peux utiliser la "galerie de fichiers". | ||
* Soit via la [[BarreOutilsW#Outils|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"'''. | * Soit via la [[BarreOutilsW#Outils|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"'''. | ||
| Ligne 23 : | Ligne 23 : | ||
* Le code <nowiki><gallery>....</gallery></nowiki>, utilisé plus haut utilise par défaut le mode traditional. | * Le code <nowiki><gallery>....</gallery></nowiki>, utilisé plus haut utilise par défaut le mode traditional. | ||
| − | Avec beaucoup d'images de tailles similaires, titre, widths (largeur) et heights (hauteur) : | + | Avec beaucoup d'images de tailles similaires, avec des balises caption (titre), widths (largeur) et heights (hauteur) :<br /> |
| + | code: <nowiki><gallery caption="Un titre avec caption" widths="180px" heights="120px" >></nowiki> | ||
<gallery caption="Un titre avec caption" widths="180px" heights="120px" >> | <gallery caption="Un titre avec caption" widths="180px" heights="120px" >> | ||
Dummy.png|L'emblème de l'ASA, ex de gallerie | Dummy.png|L'emblème de l'ASA, ex de gallerie | ||
| Ligne 34 : | Ligne 35 : | ||
</gallery> | </gallery> | ||
| − | + | ||
| + | Et la meme avec le code <nowiki><gallery caption="en 50px" heights="50px" >></nowiki> | ||
| + | <gallery caption="en 50px" heights="50px" >> | ||
| + | Dummy.png|L'emblème de l'ASA, ex de gallerie | ||
| + | Wiki-bar-insimg.png|Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi ''mettre en forme'' ! | ||
| + | Dummy.png|Titre 1 | ||
| + | Dummy.png|Titre 2 | ||
| + | Dummy.png|Titre 3 | ||
| + | Dummy.png|Titre 4 | ||
| + | Dummy.png|Titre 5 | ||
| + | </gallery> | ||
| + | |||
| + | |||
| + | === La même, avec <nowiki><gallery mode=nolines></nowiki>=== | ||
<gallery mode=nolines> | <gallery mode=nolines> | ||
Barreswiki.png|Barre d'outil du mode édition de ce wiki | Barreswiki.png|Barre d'outil du mode édition de ce wiki | ||
| Ligne 46 : | Ligne 60 : | ||
</gallery> | </gallery> | ||
| − | + | === <nowiki><gallery mode=packed></nowiki> === | |
| + | Les images sont affichées avec une hauteur identique, la largeur pouvant varier pour respecter le ratio original. | ||
<gallery mode=packed> | <gallery mode=packed> | ||
Barreswiki.png|Barre d'outil du mode édition de ce wiki | Barreswiki.png|Barre d'outil du mode édition de ce wiki | ||
| Ligne 52 : | Ligne 67 : | ||
Wiki-bar-insimg.png|Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi ''mettre en forme'' ! | Wiki-bar-insimg.png|Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi ''mettre en forme'' ! | ||
</gallery> | </gallery> | ||
| + | |||
avec <nowiki><gallery mode=packed></nowiki> moins l'image trop large : centré et gain de place | avec <nowiki><gallery mode=packed></nowiki> moins l'image trop large : centré et gain de place | ||
<gallery mode=packed> | <gallery mode=packed> | ||
| Ligne 63 : | Ligne 79 : | ||
</gallery> | </gallery> | ||
| − | packed-overlay | + | === <nowiki><gallery mode="packed-hover" heights=64px perrow=7 ></nowiki> === |
| + | <gallery mode="packed-hover" heights=64px perrow=7 > | ||
| + | File:Atrium_(GM)_guild.png|Support | ||
| + | File:Animation guild-icon.png|Animation | ||
| + | File:Level-Design guild icon.png|Level-Design | ||
| + | File:Lore Team guild-icon.png|Lore | ||
| + | File:Ryzom Forge Graphics guild-icon.png|Graphics | ||
| + | File:Ryzom InCode Developers guild-icon.png|Developers | ||
| + | File:Translation Team guild-icon.png|Translation | ||
| + | </gallery> | ||
| + | |||
| + | === mode=packed-overlay === | ||
| + | <nowiki><gallery mode=packed-overlay></nowiki> | ||
<gallery mode=packed-overlay> | <gallery mode=packed-overlay> | ||
Dummy.png|Ex 1 | Dummy.png|Ex 1 | ||
| Ligne 74 : | Ligne 102 : | ||
</gallery> | </gallery> | ||
| − | + | === Slideshow avec titre caption === | |
| − | + | <nowiki><div style="max-width: 350px;"> <gallery caption="Titre exemple" mode=slideshow>... </gallery> | |
| + | </div></nowiki> | ||
<div style="max-width: 350px;"> | <div style="max-width: 350px;"> | ||
| − | <gallery mode=slideshow> | + | <gallery caption="Titre exemple" mode=slideshow> |
| − | + | Dummy.png|Description 1 | |
| − | + | Wiki-bar-insimg.png|Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi ''mettre en forme'' ! | |
| + | Dummy.png|Description 2 | ||
</gallery> | </gallery> | ||
</div> | </div> | ||
| + | |||
| + | Similaire (2 images) avec hauteur plus petite (heights="20px") est KO {{KO}} | ||
| + | <gallery heights="20px" mode=slideshow> | ||
| + | Dummy.png|Description 1 | ||
| + | Dummy.png|Description 2 | ||
| + | </gallery> | ||
== La syntaxe == | == La syntaxe == | ||
| − | Source : https:// | + | Source : https://fr.wikipedia.org/wiki/Aide:Galerie et https://fr.wikipedia.org/wiki/Aide:Galerie/avanc%C3%A9e |
=== Attributs et valeurs utiles === | === Attributs et valeurs utiles === | ||
| + | Réduire la taille avec une balise div (un [[Tags PvP Roleplay|ex ici]]): <nowiki><div style="width:600px"> ... </div></nowiki> | ||
| + | |||
| + | {| class="wikitable alternance left" | ||
| + | |+ Options complémentaires image par image <br>''(à insérer à la suite des noms de fichiers)'' | ||
| + | |- | ||
| + | | | ||
| + | ! scope="col" style="width:530px;" | Effet | ||
| + | ! scope="col" style="width:400px;" | Notes | ||
| + | |- | ||
| + | ! scope="row" style="width:160px;" | alt=texte | ||
| + | | texte Insère un texte alternatif pour les non-voyants. | ||
| + | | 120 caractères max. | ||
| + | |- | ||
| + | ! scope="row" | <nowiki><div style="text-align:center;"></nowiki>texte<nowiki></div></nowiki> | ||
| + | | texte La légende sera centrée ''(corrige l'affichage justifié à gauche par défaut)'' | ||
| + | | | ||
| + | |- | ||
| + | ! scope="row" | <nowiki><div style="text-align:right;"></nowiki>texte<nowiki></div></nowiki> | ||
| + | | texte La légende sera justifiée à droite ''(corrige l'affichage justifié à gauche par défaut)'' | ||
| + | | | ||
| + | |- | ||
| + | ! scope="row" | <nowiki><div style="text-align:left;"></nowiki>texte<nowiki></div></nowiki> | ||
| + | | texte La légende sera justifiée à gauche (''corrige l'affichage centré du'' <code>mode=nolines</code>) | ||
| + | | | ||
| + | |} | ||
| + | {{clr|left}} | ||
| + | Les légendes sont justifiées à gauche par défaut, sauf pour le <code>mode=nolines</code> pour le moment. Il est possible de corriger l'affichage des légendes en utilisant du code HTML. | ||
| + | <noinclude> | ||
| + | [[catégorie:Aide|Galerie d'images]] | ||
| − | + | </noinclude> | |
Version actuelle datée du 18 octobre 2023 à 09:49
 État des traductions → Cette page est l'une des 25 que nous aimerions voir traduites en français.
|
 Übersetzt •  Proofreading in progress •  No traducido •  Original •  Не переведено
|
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".
- 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,...) :
Barre d'outil du mode édition de ce wiki
L'emblème de l'ASA, ex de gallerie
Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi mettre en forme !
Sommaire
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" >>
- Un titre avec caption
L'emblème de l'ASA, ex de gallerie
Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi mettre en forme !
Titre 1
Titre 2
Titre 3
Titre 4
Titre 5
Et la meme avec le code <gallery caption="en 50px" heights="50px" >>
- en 50px
L'emblème de l'ASA, ex de gallerie
Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi mettre en forme !
Titre 1
Titre 2
Titre 3
Titre 4
Titre 5
La même, avec <gallery mode=nolines>
Barre d'outil du mode édition de ce wiki
L'emblème de l'ASA, ex de gallerie
Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi mettre en forme !
Titre 1
Titre 2
Titre 3
Titre 4
Titre 5
<gallery mode=packed>
Les images sont affichées avec une hauteur identique, la largeur pouvant varier pour respecter le ratio original.
Barre d'outil du mode édition de ce wiki
L'emblème de l'ASA, ex de gallerie
Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi mettre en forme !
avec <gallery mode=packed> moins l'image trop large : centré et gain de place
L'emblème de l'ASA, ex de gallerie
Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi mettre en forme !
Titre 1
Titre 2
Titre 3
Titre 4
Titre 5
<gallery mode="packed-hover" heights=64px perrow=7 >
Support
Animation
Level-Design
Lore
Graphics
Developers
Translation
_guild.png)
mode=packed-overlay
<gallery mode=packed-overlay>
Ex 1
Ex 2
Titre 1
Titre 2
Titre 3
Titre 4
Titre 5
Slideshow avec titre caption
<div style="max-width: 350px;"> <gallery caption="Titre exemple" mode=slideshow>... </gallery> </div>
- Titre exemple
Description 1
Une description longue mais nécessaire à la page où figure cette galerie d'image, car on peux aussi mettre en forme !
Description 2
Similaire (2 images) avec hauteur plus petite (heights="20px") est KO ✗
Description 1
Description 2
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>
| Effet | Notes | |
|---|---|---|
| alt=texte | texte Insère un texte alternatif pour les non-voyants. | 120 caractères max. |
| <div style="text-align:center;">texte</div> | texte La légende sera centrée (corrige l'affichage justifié à gauche par défaut) | |
| <div style="text-align:right;">texte</div> | texte La légende sera justifiée à droite (corrige l'affichage justifié à gauche par défaut) | |
| <div style="text-align:left;">texte</div> | texte La légende sera justifiée à gauche (corrige l'affichage centré du mode=nolines)
|
Les légendes sont justifiées à gauche par défaut, sauf pour le mode=nolines pour le moment. Il est possible de corriger l'affichage des légendes en utilisant du code HTML.
