Version actuelle datée du 2 avril 2023 à 00:32

 

Traduction à revoir !

Ne blâmez pas les contributeurs, mais venez les aider 😎

Texte de référence (original utilisé comme référence) :
Notes :

Pour les apprentis bureaucrates, voici un petit tutoriel pas à pas, qui va montrer comment gérer les images.

Objectif: Il s'agit de créer une gallerie d'images qui présente les cadeaux gagnés à la Roue de la Fortune. La page existe en FR et en EN (voir Roue de la Fortune), il y a plusieurs images à importer, de plus, on va créer une catégorie pour regrouper ces images dans Common (le wiki qui héberge toutes les images, pour les wiki (en langues FR, EN, ES, DE, RU...).

En gros, on va détailler sur des exemples concrets, mais on va commencer par plus simple (qui apportera des informations utiles pour la suite).

1. Cas simple en introduction: j'ai trouvé sur le wiki une image, je veux la mettre en forme sur une page du wiki FR.

2. Cas usuel: je souhaite ajouter des images qui ne sont que sur mon PC.

• préparer ses images (nom et type de fichiers acceptés, texte descriptif et choix de catégories d'images)
• importer de votre PC une image vers le wiki commun à toutes les langues (avec un descriptif et les catégories choisies pour l'image dans common)
• mise en forme de l'image dans un texte

3. Avancé: création d'une sous-catégorie pour regrouper les images dans Common

Mettre en forme une image

Mettons que j'ai vu sur une page du wiki, ici BarreOutilsW, une image que je souhaite ajouter sur ma page.

Le plus simple est

1. S'il n'y a pas de lien modifier à droite du titre: repérer un titre et du texte aux alentours (utiliser Modifier dans les onglets de page en haut), sinon toujours préférer ces modifier près des titres (on se perd moins)
2. entrer en mode édition de la page (BarreOutilsW Modifier) et aller dans la zone repérée à la recherche du code ressemblant à [[Fichier:Barreswiki.png|vignette|machin]] ^[1] pour la copier (CTRL+C)
3. Modifier sa page pour coller le code (CTRL+V)
4. Prévisualiser (en bas de page) pour vérifier la position et mise en forme.

Regarde le code qui permet d'afficher correctement Atys en petite puce:

• à gauche de Le plus simple est c'est [[file:Dummy.png|32px|En 32 pixel, simple: sans cadre ou légende]]
• d'ici
• Tu ne vois pas ? Alors fais 1 clic sur l'image pour voir où alt arrive :)

Quelques astuces et FAQ

• Si l'image déborde sur du texte dessous, ajouter {{clear}} sous l'image.
• 

  Rechercher et Remplacer: à droite dans Avancé)
  Rechercher et Remplacer: vérifier que Avancé est déployé et c'est à l’extrême droite. Vers astuces de recherche sur le wiki.
• sur de grandes images, on voit parfois diverses résolutions (le serveur a créé 2 versions, de tailles en pixel différentes). En voici un exemple Size of this preview: 800 × 450 pixels. Other resolutions: 320 × 180 pixels | 1,600 × 900 pixels.
• liens et image ^[2]
  • Pour ajouter un lien sur une image il suffit d'ajouter le lien après un link= comme ici: [[Fichier:Atysmap.jpg|50px|link=Carte d'Atys]]
  • Alors que pour faire un lien vers une image voir en grand, il faut préfixer par un : avant Fichier comme ici: [[:Fichier:Atysmap.jpg|voir en grand]]
  • Depuis sa page (wiki fr), on peux facilement ajouter un lien vers une category de common:
    • avec du texte: [[:atys:Category:Wiki|Toutes les images taguées '''wiki''']] donne Toutes les images taguées wiki
    • sur une image
    • imagemap fonctionne, en voici quelques exemples. Un outil on-line pour en faire.
• Afficher une image à partir d'une adresse internet (image hébergée sur un autre site web) ? Utiliser du html:
  

<img src="https://app.ryzom.com/.../favicon.png" width="32" >

• Pas de table des matières ? ajoute quelques sous-titres: soit avec la barre d'outil (liste déroulante Titre - si on ne la voit pas, cliquer sur Avancé à gauche de Caractères spéciaux), soit en utilisant ==Un titre de Niveau 2== , ===Un titre de Niveau 3===...

• tu n'arrives pas à utiliser le modèle spoiler ? regarde à Test spoiler

• Seau Lore: blanc (en cours de validation)

• Des icônes du jeu sont récupérables via l'api, avec le modèle APIitemIcon, les codes (dans l'exemple: icmm2ms.sitem) étant à https://github.com/nimetu/ryzom_extra - plus à en:Ryzom API/Item sheetids.

Par exemple:

Le code	affiche
{{APIitemIcon|sheetid=icmm2ms.sitem}}
on peut même changer la quantité {{APIitemIcon|sheetid=teddyubo.sitem|q=2}}

Note: ne fonctionne pas avec gallery. APIitemIcon a été pensé pour utiliser dans des tableaux ?

avec la barre d'outil

En mode d'édition d'une page, voici la barre d'outil d'édition du wiki, montrant Avancé

Un seul fichier (dans du texte):
Juste après l’icône "Liens" se trouve "Fichier inséré" (en 4e position), qui ouvre cette fenêtre, bien mal nommée (pour ceux qui préfèrent une interface graphique, bien que comprendre le code wiki est assez facile et indispensable à tout bureaucrate consciencieux) :

La fenêtre qui apparaît après avoir cliqué "Fichier inséré", permet d'ajouter facilement une image déjà hébergée sur le wiki

(le bouton Télécharger semble ne pas fonctionner chez moi - dixit CraftJenn)

L'image a été envoyée (et on ne voit plus les instructions pour l'aide à l'insertion... MDR). Or, il faut maintenant l'insérer dans le code wiki. CraftJenn a toujours un onglet d'ouvert sur https://atys.wiki.ryzom.com/wiki/Special:Upload (URL obtenue via Ryzom Commons et Importer un fichier").

Code wiki d'ajout d'une image dans un contenu : voir Guide_de_rédaction_2018#Ajouter_une_image. Plus à Wikipedia.

galery

Plusieurs fichiers dans une galerie

Si l'on a plusieurs images, on peux utiliser la "galerie de fichiers" (sur la barre d'outil en mode édition du wiki, l’icône juste à droite de "Insérer"). Cela facilite la lecture/modification du code wiki, car ajoute des balises gallery ; ainsi, chaque image sera sur une ligne (dans le code wiki), avec une syntaxe simple : nomdufichier.jpg la "barre verticale" (AltGr+6) et une description :

• 

  Barre d'outil du mode édition de ce wiki

• 

  L'emblème de l'ASA, ex de gallerie

• 

  mal nommée, car ne permet pas d'envoyer une image, mais juste de l'ajouter dans la page

• la page Guide de rédaction/Galerie d'images montre des exemples de diverses mise en forme
• le code est commun aux divers wiki (pour traduire, coller le code, modifier la, description et c'est fini).

Un peu de navigation

Sur le wiki français

Si je clique sur cette image, une pop up s'ouvre (la page reste visible dans le fond, avec un effet transparent), montrant un apercu de l'image et dessous, la légende est suivie d'un lien bleu en gras more info

En cliquant sur ce more info je vois l'image depuis le wiki FR (https://fr.wiki.ryzom.com/wiki/Fichier:Barreswiki.png)

On va ajouter une description locale (au wiki FR)

Sur cette image (ci-dessus), on voit:

• l'URL https://fr.wiki.ryzom.com/wiki/Fichier:Barreswiki.jpg (puis ma barre d'outil de navigateur)
• le menu déroulant (Navigation, Ryzom Commons, Outils...)
• les onglets pour les images en FR: Fichier Discussion Voir sur un dépot partagé (ie Common) Ajouter une description locale Suivre Purger...
• en gras et gros: le nom du fichier (précédé de Fichier:)
• un apercu, avec dessous diverses résolutions en pixel (par ex: Size of this preview: 800 × 162 pixels. Other resolution: 832 × 168 pixels).
• la description (avec categorie)
• l'historique (de l'image) dans un tableau qui indique: taille, l'utilisateur qui a importé l'image, la catégorie ou les catégories dans Commentaires
• les pages (FR) qui utilisent cette image

Optionnel: Descriptions locales et partagées Plutôt à portée pédagogique, car en fait je n'en vois pas bien l’intérêt... Gérer 2 sites différents qui ont des catégories différentes est compliqué et source d'erreur !
On va ajouter une description locale (cliquer sur Ajouter une description locale) qui viendra s'afficher sous l'apercu et au-dessus de Historique du Fichier. Ces onglets d'images vont alors se changer pour

wiki FR: notion de description locale et de dépot partagé

Je suis bien sur le wiki FR (l'adresse URL commence par https://fr.wiki.ryzom.com et sous le menu Ryzom commons les 3 entrées sont bien en Français: Répertoire d'image et Importer un fichier).
Donc, je dois pense à catégoriser mon image (une 2e fois, car les mots clefs et l'organisation des catégories ne sont pas les même) avec le code [[Catégorie:]] (et non category), que je choisis dans les catégories du wiki Français (ou anglais, allemand, espagnol...).

• Plus à Catégorisation/aide.
• Si l'on utilise ce système de Description locale, alors Fichiers sans catégorie pourra être utile.

le wiki Common

Pour rappel:

• Il y a 6 wikis: Common héberge toutes les images, qu'on pourra placer sur des pages des 5 wikis (Français, Anglais, Allemand, Espagnol et Russe).
• La langue par défaut sur Common est l'anglais: ainsi, il faudra écrire Catégorie pour classer des pages du wiki français, mais Category pour regrouper des images sur Common (qui lui, ne sait pas ce qu'est une catégorie).

Sur mon image que je viens tout juste d'importer, si je clique sur Voir sur un dépot partagé je quitte le wiki FR, et suis sur le wiki Common:

la même image, mais vu depuis l'interface du wiki Common

On voit que:

• tout est en anglais et l'URL commence par https://atys.wiki.com
• 

  bas de la page, sur Common
  même si cette image apparaît sur diverses pages du wiki FR, on ne les voit pas sur File usage (qui indiquera les pages wiki de common utilisant cette image). Ainsi, depuis common, on n'a aucun moyen de retrouver facilement où cette image est utilisée sur les autres wiki (pas de lien de common vers le wiki FR ou EN ou autre).
• Si, ayant trouvé une image sur common, j'ai besoin de savoir quelles pages utilisent cette image, je dois donc utiliser la recherche dans chaque wiki:
  • sur le wiki fr à
  • sur le wiki anglais à https://en.wiki.ryzom.com/w/index.php?title=Special:Searcht&search=Barreswiki.png
  • sur l'allemand à https://de.wiki.ryzom.com/wiki/Spezial:Suche?search=Barreswiki.png ...
• en bas de page, la catégorie apparaît (c'est une Category de Common, les plus fréquentes sont affichées dans un tableau à https://atys.wiki.ryzom.com/wiki/Main_Page)

Ajouter une image

Tu as fait un beau lucio d'une scène de chasse, et souhaite montrer ce roi sur une page? Il te faut d'abord vérifier qu'elle est bien cadrée, lisible... Puis l'envoyer sur le serveur, pour finir par ajouter le bon code sur la page voulue (ou les pages).

Préparer ses images

Pour importer une image qui est sur ta machine :

• vérifie qu'elle n'est pas trop grosse (temps d'affichage), utilise des outils pour les découper, les compresser.
• Bien les nommer sur son PC, avant de les envoyer sur le serveur, est aussi très utile ^[3] :p
• Attention! l'image doit être sous une licence libre comme la GFDL

Je crée un dossier, j'y mets toutes mes images. Et j'y crée un fichier note.txt qui comportera les codes que j'utilise fréquemment, avec 2 grands titres "Common" et "Wiki FR" (pour mes codes d'insertion d'image préférées, et adresses des pages que j'utilise souvent).

Types de fichiers acceptés:

• Taille maxi du fichier: 2 MB
• png, gif, jpg, jpeg, webp, pdf, odt, ods

choix des category pour les images

Enfin, il est plus pratique de commencer par identifier les catégories (mot-clef Category sur Commons) qu'on va indiquer pour chaque image. Souvent, une bonne partie du texte descriptif se retrouvera sur toutes les images (comme la date, l'auteur, sujet...), alors autant faire du copier coller. Une image doit avoir au moins une Category, ou plusieurs categories (au pire, merci d'ajouter au minimum dans le Summary [[Category:Images]]).

Idée: si à la place de "Categorize! Add you file to a category using [[Category:DesiredCategory]] or consult this page for help! " (sur https://atys.wiki.ryzom.com/wiki/Special:Upload qui a un lien vers une page d'aide wikimedia générale, qui n'a aucun rapport avec les catégories de common) on avait plutôt un lien vers https://atys.wiki.ryzom.com/wiki/Main_Page ca serait mieux :p

Pour classer cette scène de chasse, on pourrait hésiter entre diverses catégories. En surfant dans les catégories ^[4], on identifie ici

• Category:Images à utiliser si l'on ne trouve pas mieux :p
• Category:Boss images car les rois y sont regroupés
• Category:Event images à éviter, vu qu'une chasse en guilde n'est pas vraiment un event...
• Category:Guild images non, vu son contenu
• Category:User work pourrait être assez générique
• Category:Screenshots conviendrait aussi, car regroupe d'assez grandes images ^[5]

Ainsi, mon fichier note.txt pour Yubokin_en_guilde.jpg ressemblerait à

Partie COMMON

Boss hunt on Silan, screenshot, Scène de chasse, Nom de la Guilde, Date: 2019_05, Silan, Roi, Yubokin. [[Category:Boss images]] [[Category:Screenshots]]
Notes: [[Category:Images]]ou [[Category:User work]] à utiliser si l'on ne trouve pas mieux et [[Category:Homins images]] pour les portraits

Partie FR

centré: [[Fichier:uneimage.png|vignette|centré|légende]]
à droite: [[Fichier:image.png|vignette]]
[[file:Dummy.png|15px]] mes puces persos et {{clear}} si déborde

Ainsi, si je dois envoyer 10 images, je vais limiter mes erreurs, en collant (texte et catégories) vers le Summary de Common.

Importer ses images

On est sur une page du wiki (FR ou autre, ces menus déroulants sont partout), pour importer le premier fichier, soit:

• en haut via le menu déroulant Ryzom Common/Importer un fichier
• en bas de page Upload (wiki anglais) ou Importer un fichier

Astuce: faire non un clic gauche sur importer un fichier, mais un clic droit pour ouvrir dans un autre onglet ou une autre fenêtre. On aura ainsi dans une fenêtre son texte en mode édition, dans l'autre sa liste d'images pour y récupérer le nom des fichiers.

En pratique:

• il faut choisir dans le menu Ryzom Commons la commande Importer un fichier" :
  • Cliquer sur "Parcourir" pour choisir l'image (rangée dans un dossier sur ta machine),
  • dans Summary: il est utile d'indiquer des mots clefs et au moins une catégorie d'image (au pire [[Category:Images]] ou [[Category:User images]], la date,
  • valider en bas d'un clic sur le bouton "Upload file" (attendre pour l'envoi de l'image sur les serveurs d'Atys).

En cliquant sur Importer un fichier, on arrive sur cette page. Sur ce lucio, on a déjà cliqué sur Parcourir pour sélectionner l'image sur son PC, collé la description dans summary, il ne reste plus qu'a utiliser le bouton du bas Upload file

import d'un fichier

On voit le résultat : on est sur Common (et non plus sur le wiki FR, donc on doit retrouver sa page si l'on n'a pas plusieurs fenêtres ou onglets dans son navigateur pour aller la placer dans son contenu).

De plus:

• en bas de la page, la catégorie choisie devrait être en bleue , le rouge indiquant que la catégorie qui a été saisie n'existe pas ^[6].
• sous File history, juste au dessus de File usage, il y a un lien Upload a new version of this file qui permet de remplacer une image déjà envoyée. Utile, si après avoir inséré l'image sur sa page, on constate qu'on devrait la changer d'échelle ou la recadrer pour la ré-importer (en d'autres termes, au lieu qu'elle ait 400 pixels de large sur 200, il aurait été plus pratique qu'elle ne soit qu'en 200x100 pixels).
• Si autre une image avec le même nom de fichier existe déjà, on verra:

message (et actions possible) en cas de doublon

Création d'une category

Bon, on a déjà bien avancé...

Attention (plus à Catégorisation/aide)

• Il y un os de taille avec les catégories: on ne peut pas les détruire facilement.
• Si on les renomme, cela se voit.

Pour créer une catégorie dans common qui servira à regrouper un ensemble d'images (dans common uniquement):

1. Choisir un nom de catégorie: si possible en anglais qui est la langue par défaut de common ^[7]. Pour info, on ne peux pas effacer facilement une catégorie, c'est une fonctionnalité intégrée au cœur des wiki. Merci d'essayer de penser à ajouter un peu de texte en haut de page (aide pour les recherches ultérieures).
2. Réfléchir à la catégorie mère idéale, sachant que
   • il est facile de déplacer toute une branche vers une autre sous-branche de l'arbre (changer de parents MDR)
   • chaque image (ou page) peux avoir plusieurs category et donc apparaître plusieurs fois, sous diverses rubriques thématiques pour un surfeur sur Common (et les moteurs de recherches du web). Elle sera alors plus facilement "trouvable".
3. Importer une image (Upload) et dans Summary y coller la catégorie à créer, ici [[Category:Wheel of fortune]] (et sauver).
4. On arrive alors sur la page qui présente l'image importée avec sa Category en rouge, on vérifie ici qu'on n'a pas fait d'erreur, car elle n'a pas été encore créée, cliquer sur ce lien rouge,
5. on arrive sur un formulaire de création de catégorie, pour y coller la catégorie mère choisie [[Category:User images]] Ajouter un minimum de texte pour cette catégorie ^[8].

Voici un petit modèle type:

Voici un exemple d'erreur ne pas faire... et que je ne sais pas résoudre...

1. A l'import de l'image, l'utilisatrice a écrit Catégorie et non Category (à la création de l'image dans common, elle a mis [[Catégorie:Wheel of fortune]] comme dans le wiki FR) alors qu'elle était sur le wiki Commun (et que je lui avait dit d'ajouter [[Category:Wheel of fortune]] vu que je venais de lui créer cette catégorie sur le Common).
2. Après des explications de plusieurs minutes, elle a réussi à éditer le fichier pour corriger son erreur (1. aller dans le common depuis le FR, puis clic sur Edit)
3. En bas de page (lieu où s'affichent les catégories) on voit bien que la correction a été prise en compte.

correction ok, le bas de page le confirme

Un autre exemple: Heernis a traduit (une BD d'Arily, 2008) vers l'Allemand.

• Comme les images comportent beaucoup de texte en allemand, Heernis a créé une sous-catégorie (nommée Ruinen von Silan - Beginner Guide), sous Encyclopatys/DE/Gameplay qui est sous Encyclopatys, pour héberger ses images (pour ceux qui n'aiment pas les PDF).
• Les images ont été nommées pour être dans le bon ordre => pas besoin de se fatiguer avec l'insertion du code dans une page, un lien sur une image envoie directement sur common avec la syntaxe [[File:nom image apercu.jpg|50px|link=https://atys.wiki.ryzom.com/wiki/Category:la category]].
• Le fichier PDF est sous Category:Comics car c'est une BD et aussi sous Silan Anleitung (images d'aide pour Silan, en allemand).

Notes et ref

Sur ce wiki:

• Guide_de_rédaction_2018#Ajouter_une_image
• Pour davantage d'exemples de syntaxe (et de mise en forme): Guide de rédaction/Galerie d'images.
• Plus sur l'utilisation de la Barre d'outil (mode édition du wiki).

• Voir aussi SOS/Catégoriser une image.

• aide officielle https://www.mediawiki.org/wiki/Help:Images/fr#Taille_et_cadre

• Nous vous conseillons fortement, avant d'aller plus loin, de relire les Avertissements généraux d'EncyclopAtys, ainsi que http://atys.wiki.ryzom.com/wiki/Terms_of_Use.

Sur le forum, un post de Fyrosfreddy en anglais, qui explique comment ajouter une image dans le forum https://app.ryzom.com/app_forum/index.php?page=topic/view/30223