Insérer des images dans un article

Il existe 3 façons d’utiliser des images :

  1. Elles peuvent faire partie d’un diaporama sur la colonne de gauche des articles. Pour cela, il suffit d’associer plusieurs images à l’article.
  2. Elles peuvent être insérées sous forme de logo d’article. Ces images ont alors pour fonction de représenter l’article sur les pages listant plusieurs contenus (rubrique, recherche, etc.). Elles-sont réduites et redimensionnées automatiquement en fonction de la mise en page.
  3. Elles peuvent servir à habiller le texte d’un article. Lorsque l’on insère une image associée à un article dans le texte de ce dernier. L’image disparaît du diaporama de bas de page pour apparaître à l’emplacement souhaité dans le texte.

L’article ci-dessous décrit comment insérer et mettre en forme ces images à l’intérieur du texte d’un article.

Alignement

Sur la colonne de gauche de chaque page d’édition, les images associées à la page éditée s’affichent, suivi de petits codes (par exemple : <doc25> | left | center | right). L’utilisation d’un de ces codes dans votre article permet d’insérer l’image du document.

Cliquer sur left, center ou right permettra respectivement d’insérer une image alignée à gauche, centrée, ou alignée à droite.

Lorsque du texte est positionné sous une image alignée à gauche ou à droite, il vient s’insérer sur le côté de celui-ci. L’image est automatiquement réduite à la moitié de la largeur de la page pour générer une mise en page agréable à lire.

Par contre, une image centrée ne laissera passer aucun texte sur ses côtés. Elle ne sera réduite que dans la mesure où ses dimensions seront supérieures à la largeur de la page. En effet, Une image trop grande est automatiquement redimensionnée pour qu’elle ne puisse pas déborder de la largeur de la page.

Liens

Il est possible de créer un lien sur une image en ajoutant :

|lien=adresse_de_mon_lien

Dans le petit code généré, l’image ci-dessous pointe sur un site externe.

Le titre et le descriptif de l’image

Radonnée Peintures préhistoriques

Il est possible d’associer des informations à votre image. Pour cela, cliquez sur le bouton modifier en dessous de celle-ci. Une fenêtre apparaîtra vous permettant de renseigner :

  • le titre de l’image,
  • la description de l’image,
  • les crédits de l’image,
  • l’alternative textuelle (une description de l’image pour les personnes malvoyantes),
  • la vignette (ou visuel) sur laquelle il faudra cliquer pour voir l’image. (Cela peut par exemple être un détail de l’image sur lequel il faudra cliquer pour voir l’image entière).

Dans l’exemple ci-contre, l’image est associée à sa légende composée de son titre et de son descriptif et ses crédits.

Une fois que votre image contiendra un de ces éléments, la légende s’affichera automatiquement en dessous de l’image. Si vous avez besoin d’utiliser l’image sans sa légende, il faudra alors ajouter "legende=non" à votre balise "doc" pour insérer l’image seule.

Dans l’exemple ci-contre, la légende de la même image a disparu.

Redimensionnement

Il est possible de diminuer la taille des images en indiquant soit une largeur, soit une hauteur.

  • Le code "largeur" ajouté ainsi : <doc1624|largeur=200> permettra d’afficher une image limitée 200px de large.
  • Le code hauteur ajouté ainsi : <doc1624|largeur=200> permettra d’afficher une image limitée 200px de haut.