Comment résoudre le problème de l'image mise en avant qui ne s'affiche pas dans WordPress

Une image mise en avant qui ne s'affiche pas dans WordPress peut être un véritable casse-tête.

Ces images sont importantes pour attirer l'attention de vos visiteurs et augmenter vos taux de clics. Lorsqu'elles n'apparaissent pas, cela peut être frustrant et impacter les performances de votre site.

Nous avons rencontré ce problème sur notre blog de temps en temps, nous savons donc à quel point cela peut être agaçant. La bonne nouvelle, c'est que nous savons comment le résoudre.

Dans ce guide, nous vous présenterons quelques étapes simples pour résoudre le problème des images mises en avant qui ne s'affichent pas dans WordPress.

Que sont les images mises en avant et pourquoi ne s'affichent-elles pas dans WordPress ?

Les images mises en avant apparaissent sur la page de liste de vos articles de blog et parfois dans l'en-tête de l'article. Similaires aux miniatures YouTube, le but de l'image mise en avant est d'augmenter les vues de page et l'engagement des utilisateurs.

De plus, les images mises en avant sont également utilisées pour représenter des articles individuels dans les pages d'articles récents, d'archives et de recherche.

Au-delà de cela, le style de vos images mises en avant donne le ton pour le reste de votre article de blog.

Pratiquement tous les thèmes WordPress vous permettent de télécharger des images mises en avant et vous donnent la possibilité de les afficher dans différentes zones de votre site, telles que le menu de la barre latérale ou la zone de contenu principale.

Si vous dépannez ce problème, vous voudrez peut-être consulter notre tutoriel sur comment ajouter des images à la une ou des miniatures d'articles dans WordPress. Il est important que vous sachiez d'abord comment téléverser des images à la une.

Il peut être facile de téléverser par erreur une image de couverture au lieu d'une image à la une, ou vous pourriez même avoir un thème qui fait automatiquement apparaître la première image d'un article comme miniature d'article.

Dans cet esprit, nous vous montrerons comment résoudre les problèmes potentiels qui peuvent survenir. N'hésitez pas à utiliser nos liens pour accéder au problème que vous rencontrez actuellement :

1. Résoudre l'erreur HTTP lors du téléversement d'une image à la une
2. Corriger les plugins ou les thèmes
3. Désactiver le chargement différé
4. Autoriser les images à la une pour l'affichage
5. Résoudre le problème de l'image à la une qui n'apparaît pas sur la page de galerie du blog
6. Ajouter du code personnalisé pour résoudre les problèmes d'image mise en avant

Dites adieu aux maux de tête des images à la une manquantes – plongeons et résolvons ce problème ensemble !

1. Résoudre l'erreur HTTP lors du téléversement d'une image à la une

Si vous essayez de téléverser une image à la une avec une taille de fichier importante, vous pourriez recevoir le message vague « erreur HTTP ». Souvent, cela signifie que le fichier image est trop volumineux ou que vous devez augmenter la limite de mémoire de votre site pour permettre des téléversements plus importants sur votre site WordPress.

Il existe deux méthodes principales pour résoudre ce problème. Mais d'abord, assurez-vous de vous déconnecter de WordPress, puis de vous reconnecter. Souvent, cela vous permettra de téléverser à nouveau des images normalement.

Sinon, essayez l'une des deux méthodes suivantes :

1. Diminuez la taille du fichier image.
2. Augmentez la limite de mémoire de WordPress.

Commençons d'abord par la méthode la plus simple : réduire la taille de votre fichier image. Si la taille est un problème, vous voudrez peut-être passer au format d'image WebP, JPEG ou PNG. JPEG est un format de fichier compressé qui réduit légèrement la qualité de l'image pour la réduire considérablement à une taille de fichier plus petite, et les fichiers WebP sont très petits dès le départ.

Ensuite, vous voudrez compresser la taille du fichier à l'aide d'un outil de compression d'images tel que TinyPNG ou JPGmini.

Tout ce que vous avez à faire est de télécharger l'image dans l'outil, puis vous pouvez télécharger la version compressée du fichier.

Pour plus d'informations, consultez notre guide sur comment optimiser les images pour les performances web sans perdre en qualité.

Si vous avez déjà compressé la taille de l'image et que vous rencontrez toujours l'erreur HTTP, vous pourriez vouloir augmenter la limite de mémoire de votre WordPress. Vous pouvez simplement contacter votre fournisseur d'hébergement web actuel et demander à augmenter votre limite PHP ou à mettre à niveau votre plan d'hébergement.

Cependant, vous pouvez également modifier la limite de mémoire PHP, ce qui nécessite de modifier les fichiers wp-config.php ou .htaccess. Dans les deux cas, vous aurez besoin d'un client FTP ou d'un gestionnaire de fichiers.

Pour cette méthode, il est conseillé d'utiliser un plugin comme WPCode, qui vous permet d'ajouter des personnalisations sans casser votre site web. WPCode est le meilleur plugin d'extraits de code du marché, avec plus de 2 000 000 de sites web qui l'utilisent pour pérenniser leurs personnalisations de site web avec des extraits de code.

Si vous souhaitez modifier le fichier .htacess, vous devrez vous rendre dans le dossier racine du site web WordPress. Ensuite, avant la ligne qui dit « #END WORDPRESS », vous pouvez coller le code suivant :

define( 'WP_MEMORY_LIMIT', '256M' );

Pour plus de détails sur la façon d'augmenter votre limite de mémoire, consultez notre tutoriel sur comment corriger les erreurs WordPress de mémoire épuisée pour augmenter la mémoire PHP.

2. Corriger les plugins ou les thèmes

Certains thèmes et plugins WordPress pourraient empêcher l'affichage de l'image.

Bien que la plupart des thèmes WordPress affichent automatiquement vos images mises en avant, certains nécessitent une configuration manuelle par l'administrateur. Dans ce cas, vous devrez peut-être vérifier les paramètres de votre thème WordPress ou contacter le support de votre thème pour obtenir de l'aide.

Pour plus d'informations, consultez notre guide ultime sur l'utilisation du personnalisateur de thème WordPress.

Si le thème n'est pas la cause du problème, vous pouvez également vérifier si vos plugins sont le principal coupable.

Vous pouvez commencer par mettre à jour tous vos plugins. Si cela ne résout pas le problème, désactivez tous vos plugins, puis réactivez-les un par un.

Après chaque installation, vous pouvez vérifier si les images mises en avant s'affichent correctement. Si l'image mise en avant échoue, vous saurez quel plugin cause le problème.

Vous pouvez également utiliser le plugin Health Check & Troubleshooting. Ce plugin gratuit effectue une série de vérifications pour détecter les erreurs de configuration et les erreurs connues dans vos plugins et thèmes.

Si vous avez besoin d'aide pour l'installation, lisez notre guide sur comment installer un plugin WordPress.

Après activation, rendez-vous sur Outils » Santé du site. À partir de là, vous obtiendrez une liste de recommandations pour vous aider à améliorer la sécurité et les performances de votre WordPress.

Vous pouvez voir ici qu'il y a un certain nombre de plugins et de thèmes obsolètes et inactifs installés qui doivent être résolus. Cliquez simplement sur les liens donnés pour gérer ou mettre à jour vos plugins.

3. Désactiver le chargement différé

Le chargement différé est une fonctionnalité qui aide à améliorer la vitesse de votre page et les performances de WordPress en ajoutant rapidement le contenu et la zone visible en premier.

Un site web plus rapide améliore le classement du site car les moteurs de recherche comme Google considèrent la vitesse comme un facteur de classement important.

Essentiellement, le chargement différé arrête le chargement des images sur une page jusqu'à ce qu'elles apparaissent à l'écran. Par exemple, la dernière image d'un long article de blog n'aura pas à se charger tant que l'utilisateur n'aura pas fait défiler la page vers le bas et atteint cette image.

Cela dit, le chargement différé peut causer des problèmes avec les images mises en avant car certains plugins de chargement différé pourraient traiter les images mises en avant comme des photos normales. Cela pourrait entraîner un chargement lent de l'image mise en avant ou l'empêcher complètement d'apparaître dans la liste des articles récents.

De plus, certains plugins d'optimisation d'images auront la fonctionnalité de chargement différé comme module complémentaire. Ainsi, vous voudrez vérifier chaque plugin installé pour voir si cette fonctionnalité est activée.

Vous pourriez vouloir désactiver la fonctionnalité de chargement différé dans vos plugins et vider le cache pour voir si cela résout le problème de l'image mise en avant.

Certains plugins vous permettent d'exclure certaines photos du chargement différé. Si c'est le cas, vous pouvez désactiver cette fonctionnalité uniquement pour la première image de vos articles de blog afin de continuer à bénéficier du chargement différé sans affecter vos images mises en avant.

Vous pouvez facilement désactiver le code en personnalisant l'extrait de code avec WPCode. Tout d'abord, vous devrez vous rendre sur la page Extraits de code » + Ajouter un extrait depuis le tableau de bord WordPress.

Ensuite, tout ce que vous aurez à faire est de copier et coller ce code PHP dans la boîte « Aperçu du code » :

add_filter( 'wp_lazy_loading_enabled', '__return_false' );

Voici à quoi cela devrait ressembler une fois collé.

Assurez-vous également de sélectionner « Extrait PHP » comme « Type de code ».

Enfin, vous activerez le plugin pour qu'il soit actif et cliquerez sur le bouton « Enregistrer l'extrait ».

Pour plus de détails, consultez notre tutoriel étape par étape sur la façon de désactiver correctement le chargement différé dans WordPress.

4. Modifier les autorisations de rôle utilisateur pour permettre le téléchargement d'images mises en avant

WordPress propose six rôles d'utilisateur par défaut pour gérer l'accès et les actions de tous les utilisateurs sur un site.

Si vous n'êtes pas le propriétaire du site Web, il y a de fortes chances que vous n'ayez pas le rôle utilisateur requis pour télécharger ou afficher les images mises en avant.

Tout ce que vous avez à faire est de vous assurer que vos rôles et autorisations d'utilisateur sont correctement configurés.

Un moyen simple de résoudre ce problème est d'utiliser un plugin comme User Role Editor afin de pouvoir modifier les rôles et les capacités en un seul endroit.

Rendez-vous simplement dans Utilisateurs » Éditeur de rôles utilisateur dans votre tableau de bord WordPress.

À partir d'ici, vous sélectionnerez le rôle que vous souhaitez modifier sous « Sélectionner le rôle » et modifierez ses capacités. Dans ce cas, nous choisirons « Auteur ».

Ensuite, en utilisant l'option « Filtre rapide », vous rechercherez « upload_files ».

Enfin, cliquez simplement sur le bouton « Mettre à jour » pour appliquer ces modifications.

Ce plugin vous permet également de créer de nouveaux rôles personnalisés et de leur donner accès aux autorisations de votre choix.

5. L'image mise en avant n'apparaît pas sur la page de galerie des articles de blog

L'une des meilleures façons d'utiliser les images mises en avant est de présenter vos articles de blog sur la page d'accueil de votre site Web.

Mais que faire si les images mises en avant n'apparaissent pas sur la page du blog ?

Pour résoudre ce problème, vous pouvez modifier votre page d'accueil ou toute page sur laquelle vous souhaitez que les images mises en avant apparaissent.

Ensuite, cliquons sur l’icône « + » et ajoutons le bloc « Derniers articles » à l’article sur la page. À partir de là, vous verrez apparaître des liens vers vos articles récents.

Cliquez simplement sur le bloc et activez l’option « Afficher l’image mise en avant ».

Ensuite, vous pourrez ajuster les autres paramètres, tels que l’alignement et la taille de l’image mise en avant, pour qu’ils correspondent à votre page.

À partir de là, vos images mises en avant devraient apparaître dans la galerie de vos articles de blog.

Voici à quoi cela ressemblera une fois que les images mises en avant s'afficheront.

6. Ajouter du code personnalisé pour corriger les problèmes d'images mises en avant

Parfois, les miniatures des articles ne sont pas cliquables en raison de votre thème WordPress actuel, qui peut ne pas prendre en charge cette fonctionnalité spécifique.

Peut-être souhaitez-vous ajouter vos images mises en avant aux flux RSS ou afficher l'image mise en avant dans la liste des articles dans la zone d'administration.

Toutes ces choses peuvent être faites avec WPCode.

Après activation, rendez-vous sur Code Snippets » + Ajouter un Snippet. Vous serez dirigé vers une bibliothèque d'options de code personnalisé pré-faites.

Tapez « image mise en avant » dans la barre de recherche afin de voir toutes les options de code personnalisé disponibles pour ajouter des images mises en avant à votre site web.

À partir de là, sélectionnez simplement l'option souhaitée.

Par exemple, disons que nous voulons ajouter des colonnes d'images mises en avant à notre tableau de bord d'administration WordPress. Survolez simplement l'option et sélectionnez « Utiliser le Snippet ».

Vous serez alors dirigé vers une page où vous pourrez modifier le snippet. Heureusement, le code est déjà pré-configuré, vous n'avez donc pas à toucher au code ou aux paramètres.

Mais si vous devez entrer le code manuellement, vous pouvez copier et coller depuis ci-dessous :

add_filter( 'manage_posts_columns', function ( $columns ) {
	// You can change this to any other position by changing 'title' to the name of the column you want to put it after.
	$move_after     = 'title';
	$move_after_key = array_search( $move_after, array_keys( $columns ), true );

	$first_columns = array_slice( $columns, 0, $move_after_key + 1 );
	$last_columns  = array_slice( $columns, $move_after_key + 1 );

	return array_merge(
		$first_columns,
		array(
			'featured_image' => __( 'Featured Image' ),
		),
		$last_columns
	);
} );

add_action( 'manage_posts_custom_column', function ( $column ) {
	if ( 'featured_image' === $column ) {
		the_post_thumbnail( array( 300, 80 ) );
	}
} );

Ensuite, activez simplement le bouton pour activer le snippet de code personnalisé et cliquez sur « Mettre à jour ».

Cela devrait enregistrer toutes les modifications que vous venez d'apporter.

Ensuite, vous pouvez vous rendre sur la page Articles » Tous les articles dans votre administration.

Sur cette page, vous pouvez voir que les miniatures des articles apparaissent dans une colonne dédiée.

Ensuite, vous voudrez peut-être aussi lire notre article sur comment lier automatiquement les images mises en avant aux articles dans WordPress ou notre tutoriel sur comment ajouter des miniatures d'articles à vos flux RSS WordPress.

Correction de l'image mise en avant WordPress qui ne s'affiche pas dans la bonne taille

Parfois, votre image mise en avant WordPress peut ne pas s'afficher dans la bonne taille. Il est préférable de comprendre les meilleures pratiques pour les images mises en avant afin d'éviter les problèmes dès le départ.

Choisir les bons graphiques pour les images mises en avant

La taille optimale pour les images mises en avant rectangulaires est de 1200 x 687 pixels. Cependant, pour les thèmes qui utilisent des images mises en avant carrées, la meilleure taille est de 600 x 600 pixels.

Pour plus de détails, lisez notre guide sur comment faire des retouches d'image de base dans WordPress.

Modifier les tailles d'image par défaut dans WordPress

Si les miniatures de votre blog apparaissent trop petites ou trop grandes, vous pouvez modifier manuellement les tailles d'image par défaut.

WordPress créera automatiquement des copies de vos images mises en avant pour les ajouter à différentes zones de votre site Web, telles que la page de blog, les pages d'archives et la page d'accueil.

Les thèmes WordPress sont livrés avec leurs propres dimensions d'image, mais parfois, vous voudrez peut-être quand même ajuster la taille de votre image mise en avant.

Pour ce faire, vous pouvez aller dans Réglages » Médias depuis votre zone d'administration WordPress. Ensuite, dans les champs de taille des miniatures, entrez les nouvelles dimensions pour votre image mise en avant.

Pour des instructions plus détaillées, vous pouvez consulter notre guide pour débutants sur les tailles d'images WordPress.

Les images à la une n'apparaissent pas sur Facebook

Les images à la une sont extraites de WordPress et sont populaires sur les plateformes de médias sociaux grâce à Open Graph, une technologie qui permet aux sites de médias sociaux comme Facebook de comprendre et d'afficher le contenu d'un site web.

Les balises méta Open Graph peuvent être ajoutées à des articles et des pages individuels pour contrôler leur apparence lors du partage. Ces balises incluent des informations telles que le titre du contenu, la description et l'image à la une.

La manière la plus simple de s'assurer que toutes les images mises en avant apparaissent sur Facebook est d'utiliser All in One SEO. C'est le meilleur plugin SEO WordPress pour améliorer et optimiser votre site web afin d'obtenir des classements de recherche plus élevés.

Une fois activé, vous pouvez vous rendre sur All in One SEO » Réseaux sociaux. Ensuite, sous l'onglet « Facebook », assurez-vous d'activer l'option « Activer le balisage Open Graph ».

Cela affiche automatiquement un aperçu de vos articles de blog avec une image mise en avant et un court extrait de texte.

Pour plus de détails, consultez notre guide sur comment ajouter des métadonnées Facebook Open Graph dans les thèmes WordPress.

Nous espérons que cet article vous a aidé à résoudre le problème de l'image mise en avant qui ne s'affiche pas sur WordPress. Vous voudrez peut-être aussi consulter notre liste des erreurs WordPress les plus courantes et comment les corriger, ainsi que notre guide sur comment récupérer et restaurer des pages supprimées.

Si cet article vous a plu, abonnez-vous à notre chaîne YouTube pour des tutoriels vidéo WordPress. Vous pouvez également nous retrouver sur Twitter et Facebook.