Galerie photos

Les galeries photos ci-dessous ont été réalisées avec ce plugin en rédigeant ce billet. Dans la barre d'outils de l'éditeur, un bouton a été ajouté à l'activation du plugin, permettant de créer ces galeries selon différentes options choisies.

Une galerie de vignettes sans lien vers les images

Une galerie d'images carrées avec lien vers l'image en taille réelle

Une galerie avec une sélection d'images

Insérer une galerie dans un billet

Si les photos sélectionnées s'affichent correctement sur le site, il n'en est pas de même lors de la rédaction. Pour ces galeries, nous avons l'insertion du code suivant exécuté lors de l'affichage de la page.

Galerie de vignettes sans lien vers les images

:: gallery dir='Galerie' thumb='t' linkto='none' ::

Galerie d'images carrées avec lien vers l'image en taille réelle

:: gallery dir='Galerie' ::

Galerie avec une sélection d'images

:: gallery imgurl='Galerie;atlas-maroc.jpg;ballons.jpg;desert.jpg;matterhorn.jpg;pole.jpg;tulipes.jpg' thumb='s' showmeta ::

Modifier l'affichage sur le blog

Les rédacteurs de billets peuvent insérer des galeries s'ils ont la permission d'accéder à la médiathèque. Ils ne peuvent pas modifier les caractéristiques d'affichage, fonctionnalité réservée aux administrateurs. Voici quelques astuces que l'on peut appliquer pour changer l'affichage.

Taille des vignettes

  1. Vous pouvez changer la taille de toutes les vignettes du blog dans les paramètres du blog. La modification de la taille ne prend effet que sur les futures images et photos qui seront téléversées sur le serveur. Pour appliquer les changements sur les images déjà téléversées, il faut utiliser le plugin Thumbnails Generator qui permet de supprimer et créer des vignettes.
  2. Vous pouvez modifier la taille modifier la taille d'une vignette en particulier. On change comme précédemment la taille de la vignette dans les paramètres du blog, ensuite on se rend dans la médiathèque sur la photo à traiter et on met à jour la vignette. Pour finir on restaure la taille de vignette dans les paramètres du blog. Cette pratique est à réalisée dans des cas très particuliers.

Centrer l'affichage

L'affichage de la galerie est aligné à gauche, comme les paragraphes de texte. Pour les administrateurs, un peu habitué aux feuilles de style CSS, il est possible de modifier l'affichage en centrant la galerie. Vous devez vous rendre sur la page de paramétrage du plugin GalleryInsert et compléter le champ "style string" contenant les balises CSS suivantes:

.galleryinsert li {list-style: none; display: inline;}
.galleryinsert li img {border: 1px solid black; margin: 2px 2px 2px 2px; vertical-align: middle;}
.galleryinsert li.private img {border: 1px dotted black;}

Il suffit d'ajouter (au début ou à la fin) la balise suivante:

ul.galleryinsert {padding:0px auto;text-align:center}

Pour en constater les effets, il sera nécessaire d'actualiser la page du blog sur votre navigateur.

Le tutoriel vidéo