Bloc Image mise en avant de la publication

Retour à la liste des blocs

Ce type de bloc est prévu pour être utilisé lorsque vous personnalisez vos modèles de page dans l’éditeur de modèles.

Ajoutez le bloc Image mise en avant de la publication afin d’afficher l’image qui a été définie pour illustrer la publication. Ce bloc est normalement imbriqué dans un bloc Boucle de requête et aide à personnaliser l’apparence des publications affichées par la boucle de requête.

Pour connaître la procédure à suivre pour ajouter un bloc, veuillez consulter l’article Ajouter un nouveau bloc.

Barre d’outils du bloc

Capture d’écran de la barre d’outils du bloc Image mise en avant de la publication

Chaque bloc dispose d’une barre d’outils vous permettant de manipuler le bloc directement dans l’éditeur. L’article Barre d’outils des blocs vous présente les outils communs à tous les blocs et leur fonctionnement. Les outils spécifiques à ce bloc, s’il en existe, sont décrits ci-dessous.

Haut ↑

Appliquer un filtre duotone

Vous pouvez créer un filtre duotone qui sera appliqué à l’image mise en avant sans changer l’image originale. L’effet duotone fonctionne très bien pour les images ayant de forts contrastes.

Vous pouvez choisir les deux couleurs pour l’effet duotone parmi les 6 pré-sélections proposées, basées sur la palette des couleurs du thème (avant-plan, arrière plan, primaire, secondaire et ternaire) :

  • avant-plan et arrière-plan ;
  • avant plan et secondaire ;
  • avant plan et ternaire ;
  • primaire et arrière-plan ;
  • primaire et secondaire ;
  • primaire et ternaire.

Vous pouvez aussi sélectionner deux couleurs pour les ombres et les mises en évidence en cliquant sur chacune des options et en choisissant une couleur dans la palette. Enfin, vous pouvez choisir deux couleurs via le sélecteur en cliquant sur les ronds blancs présents à gauche et à droite dans les aplats de couleur.

Pour effacer le filtre duotone, il suffit de cliquer sur le bouton Effacer.

Haut ↑

Remplacer

L’outil Remplacer permet de sélectionner une nouvelle image, soit déjà présente dans la médiathèque (cliquez alors sur Ouvrir la médiathèque), soit à téléverser (cliquez alors sur Téléverser).

Haut ↑

Créer une partie de modèle

Dans le menu Options, l’option Créer une partie de modèle vous permet de convertir le bloc sélectionné en une partie de modèle. Lorsque vous cliquez sur cette option, une boîte de dialogue s’affiche dans laquelle vous devez saisir un Nom pour la partie de modèle, sélectionner un type de Zone, puis finalement cliquez sur le bouton Créer.

Notez que l’option Créer une partie de modèle n’est disponible que lorsque vous éditez ou créez un modèle dans l’éditeur de site.

Haut ↑

Réglages du bloc

Selon les blocs, divers réglages sont disponibles dans la colonne latérale des réglages. Parmi ceux-ci, on distingue les réglages communs (à une majorité de blocs) des réglages spécifiques, décrits ci-dessous.

Haut ↑

Réglages du lien

Activez l’option Lien vers l’article dans les Réglages du lien pour placer un lien vers l’article sur l’image mise en avant. Ceci permettra aux internautes d’afficher l’article complet en cliquant sur l’image mise en avant.

Haut ↑

Dimensions

Vous avez la possibilité de modifier la Hauteur et la Largeur de l’image dans la section Dimensions en saisissant des valeurs dans les champs correspondants.
Différentes unités de mesure sont disponibles dans la liste déroulante qui s’affiche lorsque vous cliquez sur l’unité dans le champ de saisie, telles que : px, %, em, rem, vw et vh. Choisissez celle qui vous convient.

Enfin, lorsque vous avez spécifié une largeur et une hauteur, vous disposez de différentes options de redimensionnement :

  • Recouvrir (option par défaut) : l’image est mise à l’échelle et recadrée pour remplir tout l’espace sans être déformée.
  • Contenir : l’image est mise à l’échelle pour remplir l’espace sans être rognée ni déformée.
  • Remplir : l’image sera étirée et déformée pour remplir complètement l’espace.

Voici une illustration permettant de comprendre les différentes options de redimensionnement :

Capture d’écran montrant les différentes options de redimensionnement de l’image
Source : OpenVerse – Par JmGpHoToS

En cliquant sur le bouton Voir et ajouter des options (+) dans la section Dimensions, vous pouvez accéder à d’autres options affichées dans le menu déroulant. Ici, vous pouvez ainsi ajouter les options concernant les marges internes (propriété css : padding) et externes (propriété css : margin). Par défaut, la valeur saisie est appliquée aux quatre côtés, cliquez sur le bouton Détacher les côtés pour saisir des valeurs différentes pour chaque côté.

Enfin, si vous souhaitez réinitialiser les réglages appliqués en termes de dimensions, il vous suffit de cliquer sur l’option Tout réinitialiser dans le menu déroulant de la section Dimensions.

Haut ↑

Avancé

L’onglet Avancé vous permet d’accéder aux réglages avancés des blocs.

Traduit par Jenny Dupuy
Relu par Patrick Olivaud & Bruno Tritsch
Dernière mise à jour le 15 avril 2022

Contribuer à la documentation en français de WordPress