Comment masquer les images mises en avant sur des articles individuels dans WordPress

Certaines personnes peuvent préférer ne pas afficher les images mises en avant sur les articles de blog individuels, que ce soit pour des raisons de performance, de choix de design ou de concentration sur le contenu. 

Par exemple, vous pourriez ne pas vouloir d'image mise en avant sur des articles riches en texte comme les tutoriels ou les annonces, car elle pourrait distraire les visiteurs du contenu lui-même. Masquer l'image mise en avant peut également améliorer la vitesse de chargement, en particulier pour les utilisateurs sur appareils mobiles.

Si vous visez le même objectif, nous vous guiderons sur la façon de masquer l'image mise en avant sur vos articles de blog individuels !

Comment masquer les images mises en avant individuellement

Il existe plusieurs façons de masquer les images mises en avant de vos articles de blog. Si vous n'avez pas d'expérience en codage, vous pouvez utiliser une simple extension pour accomplir cette tâche.

Mais si vous ne souhaitez installer aucun plugin, vous pouvez adopter une approche plus technique en modifiant les fichiers du thème ou en utilisant du CSS personnalisé. Ci-dessous, nous avons expliqué chaque méthode étape par étape :

Méthode 1 : Utiliser une extension

Vous pouvez utiliser l'extension Conditionally Display Featured Image pour masquer rapidement l'image mise en avant. Cette extension populaire est disponible gratuitement dans le répertoire des extensions WordPress.

Avec cette extension, vous pouvez choisir de masquer l'image mise en avant sur des articles individuels ou sur la page du blog qui affiche la liste de tous les articles publiés.

Si vous souhaitez essayer cette méthode simple, commençons par l'installer :

1. Installer et activer l'extension

Si vous savez déjà comment installer et activer une extension dans WordPress, vous pouvez passer à l'étape suivante. Mais si c'est votre première fois, poursuivons en suivant les étapes ci-dessous :

• Ouvrez votre tableau de bord d'administration WordPress.
• Cliquez sur le menu Extensions dans la barre latérale.

• Cliquez sur Ajouter une extension pour ouvrir le Répertoire des extensions.
• Saisissez Conditionally Display Featured Image dans la barre de recherche. L'extension devrait apparaître comme premier résultat.

• Cliquez sur Installer maintenant pour télécharger l'extension.
• Une fois installée, cliquez sur Activer pour l'activer sur votre site.

2. Modifiez l'article souhaité

Une fois l'extension activée, vous pouvez vous rendre directement sur l'article où vous souhaitez masquer l'image mise en avant. Ensuite, suivez les étapes ci-dessous pour localiser la case à cocher qui vous permet de masquer l'image :

• Ouvrez l'article de blog que vous souhaitez modifier.
• Cliquez sur Réglages pour accéder à l'éditeur.

• Dans la barre latérale, allez dans l'onglet Article .
• Tout en haut, vous devriez voir votre image mise en avant. En dessous, vous trouverez l'option : Afficher l'image mise en avant uniquement dans les listes d'articles, mais la masquer dans la vue d'un article individuel.

• Cochez la case pour masquer l'image mise en avant dans cet article particulier.
• Ensuite, enregistrez les modifications en cliquant sur le bouton Mettre à jour/Enregistrer (si l'article est déjà publié) ou sur le bouton Publier (s'il s'agit encore d'un brouillon).

3. Mettez à jour l'article pour appliquer les modifications

Cette étape est terminée une fois que vous cliquez sur le bouton Enregistrer ou Mettre à jour . Toutefois, assurez-vous de vérifier la partie publique de votre site pour confirmer que l'image mise en avant est réellement masquée.

Il existe deux façons de procéder :

• Vérifiez la version en ligne de l'article publié
• Ou prévisualisez votre brouillon d'article avant de le publier

Voici un aperçu du résultat avant et après :

Méthode 2 : Utilisation de CSS personnalisé

Si l'image mise en avant apparaît toujours sur vos articles, ne vous inquiétez pas, car nous avons une autre méthode pour vous aider à résoudre le problème.

Vous pouvez utiliser du code CSS personnalisé pour la masquer aux yeux de l'utilisateur. Toutefois, gardez à l'esprit que cette méthode peut légèrement affecter les performances, car l'image mise en avant sera tout de même chargée même si elle n'est pas visible.

Si cela ne vous pose pas de problème, suivez le tutoriel ci-dessous :

1. Identifiez l'ID de l'article spécifique

Pour vous assurer que le code CSS n'affecte qu'un article individuel, vous devez trouver son ID d'article. L'ID d'article est un nombre qui identifie de manière unique chaque article dans WordPress.

Par exemple, l'URL peut inclure post=111, où 111 est l'ID de l'article.

Toutefois, si votre site utilise des permaliens optimisés pour le référencement, vous ne verrez pas l'ID de l'article directement dans l'URL.

Voici comment le trouver à la place :

• Accédez au tableau de bord de votre administration WordPress.
• Cliquez sur l'article que vous souhaitez modifier.
• Regardez la barre d'URL dans votre navigateur.
• Vous devriez voir une URL qui inclut l'ID de l'article comme indiqué ci-dessous.

2. Ajoutez du CSS personnalisé pour masquer l'image mise en avant de cet article

Après avoir identifié l'ID de la publication, l'étape suivante consiste à l'ajouter à votre code CSS personnalisé. WordPress dispose d'une fonctionnalité intégrée pour ajouter du CSS, vous n'aurez donc pas besoin d'installer de plugins tiers.

Vous pouvez ajouter le code CSS via le menu Personnalisateur . Cette méthode ne nécessite que des connaissances de base en codage, il n'y a donc pas lieu de s'inquiéter.

Nous allons vous guider à travers les étapes ci-dessous :

• Cliquez sur le menu Apparence depuis la barre latérale, puis sélectionnez Personnaliser. 

• Vous serez redirigé vers le menu Personnalisateur . 

• Faites défiler vers le bas et cliquez sur la section CSS additionnel .
• Collez le code ci-dessous dans la zone de l'éditeur. N'oubliez pas de remplacer l'ID de l'article par votre ID d'article réel.

.postid-51442 .post-thumbnail { display: none; } 

• Enfin, cliquez sur Publier pour appliquer les modifications. Votre image mise en avant devrait désormais être masquée pour cet article. 

Méthode 3 : Modifier les fichiers du thème

Si les méthodes ci-dessus ne donnent pas le résultat souhaité, vous pouvez essayer de modifier les fichiers du thème.

Mais cela doit être considéré comme un dernier recours, car la modification des fichiers de thème peut provoquer des erreurs ou perturber certaines fonctionnalités.

Assurez-vous de conserver une sauvegarde, juste au cas où. Après cette mise en garde, commençons :

1. Ouvrez le fichier functions.php du thème

Il existe de nombreux fichiers .php au sein d'un thème, tels que single.php, content.php et functions.php. Cela dépend de la structure de votre thème.

Pour cette méthode, vous devez localiser le fichier functions.php. Voici comment le trouver :

• Ouvrez le menu Apparence depuis la barre latérale.
• Cliquez sur l'éditeur de fichiers de thème.

• Cela ouvrira l'éditeur de thème comme indiqué ci-dessous. 

• Faites défiler le menu Fichiers du thème et trouvez le fichier functions.php. 

• Cliquez pour ouvrir le fichier. 

2. Ajouter des instructions conditionnelles pour exclure l'image mise en avant pour des articles spécifiques

Maintenant que vous avez ouvert le fichier functions.php , ajoutez le code suivant pour masquer l'image mise en avant sur les pages d'articles individuels. 

function wordpress_hide_feature_image( $html, $post_id, $post_image_id ) { return is_single() ? '' : $html; } // add the filter add_filter( 'post_thumbnail_html', 'wordpress_hide_feature_image', 10, 3 ); 

Pour que le code ne masque l'image mise en avant que pour un article spécifique, remplacez is_single() par is_single(123), où 123 est l'ID de l'article que vous souhaitez cibler.

Ensuite, enregistrez les modifications en cliquant sur le bouton Mettre à jour le fichier . 

Comment masquer les images mises en avant dans tous les articles individuels

Si vous souhaitez masquer les images mises en avant sur tous vos articles individuels, le thème Neve vous facilite la tâche. 

En quelques clics seulement, cette méthode garantira que les images mises en avant restent masquées sur les pages de vos articles.

Si vous avez déjà installé le thème Neve, vous pouvez passer aux étapes ci-dessous :

• Dans votre tableau de bord d'administration WordPress, allez dans Apparence et cliquez sur Personnaliser.
• Accédez à la section Blog .

• Vous verrez deux styles de mise en page : Normal et Cover. Les étapes pour masquer les images mises en avant diffèrent selon chaque mise en page :

Pour la mise en page Normal :

1. Faites défiler vers le bas et localisez la section Miniature .
2. Cliquez sur l' icône en forme d'œil à côté de la miniature pour la désactiver.
3. Appliquez cette modification en cliquant sur le bouton Publier.
4. Les images mises en avant seront désormais masquées sur les publications utilisant la mise en page d'en-tête Normale.

Pour la mise en page de couverture :

1. Faites défiler vers le bas pour trouver l'option Masquer l'image mise en avant .
2. Activez cette option on.
3. Cliquez sur Publier pour enregistrer les paramètres.

• Après avoir enregistré les paramètres, attendez quelques secondes que les modifications prennent effet.
• Ensuite, vérifiez en visitant l'un de vos articles individuels pour voir si les images mises en avant sont masquées.

Gardez à l'esprit que vous devez avoir le thème Neve installé pour utiliser cette méthode. Si vous ne l'avez pas encore installé, essayez de l'installer et de l'activer depuis le Répertoire des thèmes. Tapez simplement Neve dans le champ de recherche et vous le trouverez. 

Pourquoi la modification des fichiers du thème n'est-elle pas recommandée ?

Nous vous avons rappelé de ne pas modifier les fichiers du thème si ce n'est pas nécessaire. La raison simple : cela peut casser votre site.

Nous avons donc rassemblé quelques alternatives plus sûres pour masquer les images mises en avant sans avoir besoin de modifier le fichier du thème :

• Utilisation du plugin Code Snippets : Code Snippet est un plugin gratuit qui vous permet d'ajouter du PHP personnalisé à vos articles individuels. Il fonctionne à merveille sans risquer de casser votre site.
• Extension Custom Functionality : Cette extension vous permet d'accrocher un PHP personnalisé, au lieu de le saisir directement dans le fichier du thème.

Conclusion

Vous n'avez pas besoin d'essayer toutes les méthodes ci-dessus pour masquer l'image mise en avant dans WordPress. Trouvez simplement celle qui correspond à vos besoins.

Gérer un grand nombre d'images mises en avant peut prendre du temps, surtout lorsque votre bibliothèque de médias devient encombrée.