Un effet « Lightbox » pour les galeries d’images

Dorénavant, grâce à l’extension Featherlight, les galeries intégrées aux billets et pages des carnets Hypothèses sont dotées d’un effet Lightbox. Les images apparaissent selon la composition choisie lors de l’édition et s’ouvrent lors de la lecture, au clic, dans une fenêtre où elles sont affichées en taille réelle (dans les limites de la taille de l’écran d’affichage) en permettant une navigation entre les différentes images. Sur les appareils mobiles (téléphones et tablettes), passer d’une image à la suivante se fait facilement d’un geste du doigt sur l’écran.

Exemple d’une galerie :

Créer une galerie est très simple : à l’endroit souhaité d’un billet ou d’une page, cliquer sur Ajouter un média > Créer une galerie, sélectionner les images qui doivent en faire partie, et cliquer sur Créer une nouvelle galerie.
Afin que l’effet Lightbox fonctionne, il ne faut pas oublier de spécifier Lier à : Fichier média avant de cliquer sur Insérer la galerie.

C’est donc le même processus que celui précédemment utilisé pour créer une galerie dans un billet ou page : seuls l’affichage et la navigation entre les images sont améliorés.

Remarque : il est préférable d’éviter d’introduire des URL cliquables codées en html dans la légende des images intégrées au sein d’une galerie, l’extension ne supportant pas bien cet élément cliquable qui entre alors en conflit avec la navigation dans la galerie.

Toute image individuelle ajoutée à un billet ou page avec la spécification Lier à : Fichier média s’ouvre à présent avec l’effet Lightbox. Une juxtaposition d’images individuelles ajoutées dans le billet ne permettra pas, comme le fait une galerie, de naviguer entre les images ouvertes en taille réelle.

Exemple d’une image individuelle « liée au fichier média » :

La légende qui peut être ajoutée sous l’image s’adapte à la largeur de l’image dans le billet ou la page : veillez donc à ce qu’elle ne soit pas trop longue, pour un résultat esthétique.

Si vous souhaitez désactiver l’effet Lightbox à l’échelle d’un billet/page, il vous est possible de cocher la case « Désactiver Lightbox  » qui se trouve dans le bloc « Publier » en haut de la colonne à droite  du champ principal d’édition du billet/page.

En savoir plus sur le plugin Featherlight sur le Codex WordPress (en anglais)

Image à la Une : Summer lights par Patrick sous licence Creative Commons BY-NC

Citer ce billet : “Un effet « Lightbox » pour les galeries d’images”, par Marion Wesely. Publié sur La Maison des carnets le 8 septembre 2017. Lien : http://maisondescarnets.hypotheses.org/3054.

Marion Wesely

Chargée de l'accompagnement des communautés et de la valorisation des contenus d'Hypothèses / Community manager & communication officer for the Hypotheses platform (OpenEdition)

Vous aimerez aussi...