Afficher une image miniature à côté d’un article WordPress
Comme vous l’aurez constaté sous cette rubrique, j’affiche la liste des derniers articles publiés avec une image miniature à côté. Pour ce faire, il suffit d’utiliser un champ personnalisé de WordPress lors de la saisie de votre article.
Créer un champ personnalisé
Ouvrir l’article de votre choix puis cliquez sur Saisissez-en un nouveau dans le module Champ personnalisé. Entrez comme Nom, Image puis comme Valeur, l’URL de votre champ personnalisé. Validez en cliquant sur Ajouter un champ personnalisé.

Comment afficher l’image ?
Ouvrir le fichier index.php via l’administration WordPress – passez par l’onglet Apparence puis Editeur. Recherchez la ligne correspondante au titre de l’article. Elle doit en général se présenter de la manière suivante :
1 | <h1><a href="<?php the_permalink() ?>" title="<?php the_title(); ?>"><?php the_title() ?></a></h1> |
Coller juste avant le code suivant :
1 | <img src="<?php $key="Image"; echo get_post_meta($post->ID, $key, true); ?>" alt="<?php the_title(); ?>" /> |
Comment définir un style ?
Pour définir un style d’affichage de votre image, éditer en premier lieu votre feuille de style et créer un style suivant :
1 2 | .thumbnail-div{border:0px; margin-right:20px; float:left; display:inline} |
Dans votre page index.php, modifier le code de la manière suivante :
1 | <div class="thumbnail-div"><img src="<?php $key="Image"; echo get_post_meta($post->ID, $key, true); ?>" alt="<?php the_title(); ?>" /></div> |
Tags: image
