Remarque : cette page fait référence à WordPress utilisant l’extension Classic Editor permettant d’activer l’ancien éditeur.
Dans les versions récentes de WordPress, pour disposer de cet éditeur, il vous faudra installer l’extension Classic Editor.
Vue d’ensemble
Les galeries d’images sont un excellent moyen de partager des groupes d’images sur votre site WordPress. La fonction Ajouter un média dans Classic Editor vous permet d’ajouter une simple galerie d’images aux pages ou aux articles de votre site.
Cet article explique comment ajouter une galerie d’images à l’aide de la médiathèque et explique le code court de la galerie qui sera généré et intégré dans la publication que vous pouvez visualiser dans l’onglet Texte de Classic Editor (extension que vous aurez téléchargée et installée au préalable).
Ajout d’une galerie d’image via la médiathèque
Voici comment ajouter une galerie d’images étape par étape, à l’aide du téléverseur de médias :
Remarque : avant d’ajouter une galerie, vous devez être à l’aise avec l’onglet Média et le téléversement des médias pour l’insertion d’image dans votre médiathèque dans les articles et les pages.
Étape 1 – Placez votre curseur
Une galerie peut être insérée sur une page ou un article, seule sur une page vierge, au-dessus, en dessous ou au milieu d’un texte. Commencez par placer votre curseur là où vous voulez que la galerie apparaisse. Votre curseur dois être placé avec de l’espace au-dessus et au-dessous comme dans l’exemple ci-dessous.
Étape 2 – Cliquez sur le bouton Ajouter un média
Une fois que vous avez placé votre curseur à l’endroit où vous souhaitez que votre galerie d’images apparaisse, cliquez sur le bouton Ajouter un média (situé à gauche au-dessus de la fenêtre d’édition).
Dans la fenêtre qui vient de s’ouvrir, sélectionnez l’option Créer une galerie dans la liste des actions sur la gauche.
Étape 3 – Ajoutez et/ou sélectionnez les images que vous souhaitez insérer
Vous pouvez ajouter ou sélectionner les images que vous souhaitez inclure dans votre galerie d’images en choisissant parmi l’une des options suivantes dans la fenêtre de téléchargement de médias :
- Téléverser des médias : téléversez les images que vous souhaitez utiliser depuis votre ordinateur en les faisant glisser dans la zone de téléversement ou avec le bouton Sélectionner les fichiers. Vous pouvez ajouter plusieurs images et elles seront automatiquement regroupées dans une galerie d’images.
- Médiathèque : sélectionnez parmi les images précédemment téléversées dans la médiathèque en cliquant sur celles que vous souhaitez ajouter à la galerie.
Remarque : vous pouvez créer une galerie d’images en utilisant n’importe quelle combinaison de nouvelles images et d’images précédemment téléchargées simplement en basculant entre les onglets Téléverser des fichiers et Médiathèque.
Au fur et à mesure que vous téléversez et/ou sélectionnez des images, vous verrez votre sélection confirmée sur l’écran Médiathèque par des cases à cocher dans le coin supérieur droit de chaque miniature.
De plus, une rangée de miniatures apparaît au bas de la fenêtre pour vous aider à garder une trace de toutes les images que vous avez sélectionnées.
Lorsque vous êtes satisfait de votre sélection, cliquez sur le bouton Créer une nouvelle galerie.
Étape 4 – Modifiez votre galerie
Sur la page Modifier la galerie, vous pouvez effectuer les actions suivantes avant d’insérer la galerie que vous avez créée dans votre page ou publication :
- Réorganisez vos images : glissez-déposez les miniatures des images pour réorganiser l’ordre des images dans votre galerie.
- Inversez l’ordre des images dans votre galerie via le bouton Inverser l’ordre.
- Ajoutez des descriptions d’image : ajoutez des descriptions à vos images (facultatif) qui apparaissent sous forme de légendes d’image sous chaque miniature dans la galerie, en positionnant votre curseur sur la zone d’insertion Légende….
- Supprimez des images : survolez une miniature et cliquez sur la croix X pour supprimer une des images que vous avez précédemment sélectionnées.
- Ajoutez plus d’images : cliquez sur le lien Ajouter à la galerie dans la barre latérale gauche et ajoutez ou sélectionnez les images que vous souhaitez inclure dans votre galerie d’images en choisissant l’un des deux onglets Téléverser des fichiers ou Médiathèque, une fois la sélection effectuée, cliquez sur le bouton Ajouter à la galerie (en bas à droite).
- Annulez la galerie : cliquez sur le lien Annuler la galerie parmi les actions à gauche pour quitter la page Modifier la galerie et annuler votre galerie d’images.
Avant d’insérer votre galerie, vous pouvez modifier la galerie dans la section Réglages de la galerie (à droite) pour contrôler les éléments suivants :
- Lier à : contrôle si les miniatures de la galerie (sur la publication) sont liées à la Page de fichier joint de l’image ou directement au Fichier média lui-même, ou à rien (option Aucun).
- Colonnes : définissez le nombre de colonnes que vous souhaitez avoir dans votre galerie. 3 colonnes est le réglage par défaut, ce qui est idéal pour la plupart des sites.
- Ordre aléatoire : permet à votre galerie d’afficher les vignettes de vos images dans un ordre aléatoire à chaque fois qu’elles sont consultées sur le site.
- Taille : modifie la taille de chaque image dans la galerie. Les options disponibles sont Miniature, Moyenne, Grande et Taille originale.
Modification de galeries existantes
Dans l’éditeur visuel, la galerie d’images est affichée sous la forme d’une série d’images miniatures.
Lorsque vous cliquez sur n’importe quelle zone de la galerie d’images, des boutons d’icônes apparaissent en haut de la zone. A tout moment, vous pouvez modifier les images ou les réglages de votre galerie en cliquant sur le bouton Modifier. Vous pouvez supprimer la galerie d’images à tout moment en cliquant sur le bouton Retirer.
Code court de la galerie
Les étapes ci-dessus génèrent un code abrégé de la galerie avec des identifiants d’image et d’autres options, qui est intégré dans la publication, comme ceci dans l’onglet Texte de l’éditeur.
[gallery ids="729,732,731,720"]
Vous pouvez spécifier des options directement dans ce code court.
Usage
Plusieurs options peuvent être spécifiées à l’aide de cette syntaxe :
[gallery option1="value1" option2="value2"]
Options
Les options de base suivantes sont prises en charge :
orderby
Spécifie comment trier les miniatures affichées. La valeur par défaut est « menu_order ».
Options :
- menu_order : vous pouvez réorganiser les images dans l’onglet Galerie de la fenêtre contextuelle Ajouter un média.
- title : classer les médias par leur titre.
- post_date : classer les médias par date.
- rand : classer les médias au hasard.
- ID : classer par ID.
order
Spécifie l’ordre de tri utilisé pour afficher les miniatures. ASC ou DESC. Par exemple, pour trier par ID descendant, utilisez DESC :
[gallery order="DESC" orderby="ID"]
columns
Spécifie le nombre de colonnes. La galerie inclura une balise de rupture à la fin de chaque ligne et calculera la largeur de la colonne, le cas échéant. La valeur par défaut est 3. Si les colonnes sont définies sur 0, aucun saut de ligne ne sera inclus.
Par exemple, pour afficher une galerie à 4 colonnes :
[gallery columns="4"]
id
Spécifie l’ID de publication. La galerie affichera les images qui sont attachées à cette publication. Le comportement par défaut, si aucun ID n’est spécifié, est d’afficher les images jointes à la publication actuelle.
Par exemple, pour afficher les images attachées à l’article ayant l’identifiant 123 :
[gallery id="123"]
size
Spécifie la taille d’image à utiliser pour l’affichage des miniatures. Les valeurs valides incluent thumbnail, medium, large, full ou toute autre taille d’image supplémentaire qui a été enregistrée avec la fonction add_image_size(). La valeur par défaut est thumbnail. La taille (en pixels) des images pour Miniature, Moyenne et Grande peut être configurée dans l’écran Réglages des médias accessible depuis le tableau de bord via le menu Réglages, puis Médias. Par exemple, pour afficher une galerie d’images de taille moyenne :
[gallery size="medium"]
Certaines options avancées incluent :
itemtag
Nom de la balise XHTML utilisée pour entourer chaque élément de la galerie. La valeur par défaut est dl.
icontag
Le nom de la balise XHTML utilisée pour encadrer chaque icône de miniature dans la galerie. La valeur par défaut est dt.
captiontag
Le nom de la balise XHTML utilisée pour encadrer chaque légende. La valeur par défaut est dd.
Par exemple, pour modifier le balisage de la galerie afin d’utiliser les balises HTML div, span et p :
[gallery itemtag="div" icontag="span" captiontag="p"]
link
Spécifiez à quoi vous souhaitez que l’image soit liée. La valeur par défaut renvoie au permalien du fichier joint. Options :
- file – lien direct vers le fichier image.
- none – pas de lien.
[gallery link="file"]
include
ID de fichier joint séparés par des virgules qui incluent uniquement les images de ces fichiers joints.
[gallery include="23,39,45"]
exclude
ID de fichier joint séparés par des virgules qui excluent uniquement les images de ces fichiers joints.
[gallery exclude="21,32,43"]
Ressources et extensions de galerie
Traduit par Gabrielle Fouix
Relu par Jenny Dupuy & Thomas Piron
Dernière mise à jour le 12 juillet 2023