Fiche n°12 - La gestion des images

dernière modification 27 mai 2024

Depuis la V4 de SPIP seul le modèle d’image <docXX> subsiste ; (XX indique le rang d’enregistrement de l’image dans la BD du site) .
Si les codes <imgXX> ou <embXX> sont rencontrés dans le code source d’une page, ils sont assimilés à <docXX>.

Les options de placement de l’image

Trois options de placement de l’image :

Image insérée à gauche d’un texte
Exemple <docXX|left> :
L’image s’affiche à gauche devant le texte. Au-delà de la hauteur de l’image toute la largeur disponible est occupée par le texte.

Image insérée à droite d’un texte
Exemple <docXX|right> :
L’image s’affiche à droite derrière le texte.. Au-delà de la hauteur de l’image toute la largeur disponible est occupée par le texte.

Image centrée sur la ligne
Exemple <docXX|center> (ou équivalent <docXX>)
L’image se place au centre de la ligne et l’affichage continue à la ligne suivante.

Placer des images côte à côte

<docXX|left><docYY|left><docZZ|left>

<docXX|right><docYY|right><docZZ|right>
L’ordre d’affichage à l’écran est à l’inverse du code source.

Dans les 2 cas, si l’ensemble des images ne contient pas dans la ligne, il y aura un passage à la ligne suivante dans le respect du positionnement.

Parcourir des galeries d’images

Sans utiliser des plugins additionnels :
Voir fiche 11

Avec des plugins additionnels :
On peut recourir à NivoSlider, AnythingSlider ou tout plugin équivalent et compatible avec SPIP V4.2 .
NivoSlider permet d’insérer un diaporama dans une page en utilisant un article comme "réservoir d’images".