Vous avez été nombreux à me demander comment réaliser la fonction d’articles liés utilisant des vignettes présent sur les articles du blog.

wordpress-articles-lies-miniatures

Ce mode de navigation pour les articles liés a été inspiré par LifeHacker qui l’utilisait il y a quelques temps. Pour copier ce type de navigation, j’ai rapidement modifié le plugin Related Entries que j’utilisais déjà pour la fonction classique d’articles liés. J’ai ensuite intégré un autre plugin pour la génération des vignettes : Post Thumb Revisited (qui est plutôt à l’abandon en ce moment).

Un peu de javascript dégueulasse et tout ça semble fonctionner plutôt pas mal. Depuis, le plugin a été utilisé par Henri de 2803, qui m’a fait faire quelques modifications pour pouvoir se passer de Post Thumb Revisited et utiliser les miniatures/attachments de WordPress directement.

image-related-posts-2803

Je n’avais pas encore proposé le plugin au téléchargement puisque je voulais rendre le code Javascript un peu moins intrusif (avec jQuery par exemple), mais finalement je n’ai jamais le temps donc je vais vous fournir le plugin tel quel.

Voici donc les fonctions disponibles avec ce plugin WordPress :

// Related Posts - Utilise Post Thumbs Revisited - http://www.alakhnor.com/post-thumb
 
function related_posts_thumbnails($limit=5, $len=10, $before_title = '', $after_title = '', $before_post = '', $after_post = '', $show_pass_post = false, $show_excerpt = false)

Cette fonction nécessite l’installation et l’activation du plugin Post Thumb Revisited (disponible plus bas dans la version légèrement modifiée que j’utilise.)

// Related Posts V2 - Utilise les vignettes intégrées de WordPress > 2.6 (Attachments)
 
function related_posts_thumbnails_v2($limit=5, $len=10, $before_title = '', $after_title = '', $before_post = '', $after_post = '', $show_pass_post = false, $show_excerpt = false)

Cette fonction ne nécessite pas de plugin particulier.

// Related Posts 404 -  Utilise Post Thumbs Revisited pour les pages d'erreur 404 - http://www.alakhnor.com/post-thumb
 
function related_posts_thumbnails_404($limit=5, $len=10, $before_title = '', $after_title = '', $before_post = '', $after_post = '', $show_pass_post = false, $show_excerpt = false)

Une fonction plutôt intéressante pour les visiteurs qui permet d’afficher des propositions d’articles sur les pages d’erreur 404 en fonction des mots clés de l’URL tapée (si vous utilisez des URL réécrites).

Un exemple pratique :
Si on cherche l’article http://www.papygeek.com/wordpress/les-meilleurs-plugins/ qui n’existe pas sur mon blog, on obtient alors la page d’erreur suivante :
erreur-sur-papy-geek

Ce qui est relativement visuel pour les âmes perdues…

// Related Posts Random -  Utilise Post Thumbs Revisited pour afficher des articles liés au hasard - http://www.alakhnor.com/post-thumb
 
function related_posts_thumbnails_random($limit=5, $len=10, $before_title = '', $after_title = '', $before_post = '', $after_post = '', $show_pass_post = false, $show_excerpt = false)

Cette fonction permet l’affichage d’articles au hasard. Ce n’est donc plus vraiment des articles liés, mais peut servir pour suggérer d’autres pages tout de même.

Voici maintenant comment intégrer la fonction related_posts_thumbnails dans le fichier single.php :

<?php if (is_single() && function_exists('related_posts_thumbnails') ) { ?>
	<div id="relatedarticles">
		<h3>Articles liés :</h3>
		<?php related_posts_thumbnails();	?>
	</div>
<?php } ?>

(Même chose avec related_posts_thumbnails_v2).

Et la fonction related_posts_thumbnails_404 dans 404.php :

<div id="relatedarticles">
	<h2><?php echo $terms;?>... ???</h2>
	<p>Vous n'avez pas trouvé votre bonheur ? Ce que vous recherchez est peut-être ici :<br />
		<?php if(function_exists('related_posts_thumbnails_404')) { related_posts_thumbnails_404('10');} ?>
	</p>
</div>

Pour ici afficher 10 vignettes sur la page d’erreur.

Et voici donc les liens de téléchargement :

related-posts-thumbnails.zip
» 4,7 KiB - 1 434 téléchargements - 20 janvier 2009
Plugin WordPress pour afficher les articles liés sous forme de vignettes.

Post Thumbs Revisited
» 691,9 KiB - 1 294 téléchargements - 20 janvier 2009
Plugin WordPress Post Thumbs Revisited pour la création des vignettes des articles liés (fonction related_posts_thumbnails). A configurer dans les options de WordPress. (Inutile pour related_posts_thumbnails_v2).

Allez, bidouillez bien maintenant!

Le plugin a été développé pour fonctionner sur ma configuration seulement, il n’est donc pas garanti qu’il fonctionne sur votre installation de WordPress. Si vous faites des modifications, n’hésitez pas à me les transmettre.

 


 

23 réponses pour "WordPress : Plugin Articles liés + miniatures"

  1. henri  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.5 avec Windows Windows XP
    20 janvier 2009 @ 13:26
    1

    Je confirme cela fonctionne parfaitement depuis quelques mois sur 2803.fr. Merci à toi pour ce petit dev qui m’est fort utile…

  2. YohanGk  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.5 avec Windows Windows Vista
    20 janvier 2009 @ 14:23
    2

    Je te remercie. Tu fais en quelque sorte allusion à moi. Je t’avais envoyé un mail il y’a qq semaines :)

    C’est très classe de ta part de fournir ton code.

  3. Pakito  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.5 avec Windows Windows XP
    20 janvier 2009 @ 15:13
    3

    Superbe ce plugin ! Je le mettrai sur mon blog dès que j’aurai mon nouveau thème, j’avoue que ça rend super bien comme navigation qui incite le visiteur à rester un peu plus.

    Merci Papy ! :lol:

  4. Theo  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.5 avec Windows Windows XP
    20 janvier 2009 @ 20:05
    4

    Faudrait que tu créer un plugin entier pour cela PapyGeek. Ce serait mortel ! :woot:

  5. pGx  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.5 avec Windows Windows XP
    21 janvier 2009 @ 10:32
    5

    Super article pour wordpress, et très utile, sa assure un maximum de cliques sur les images !

  6. Buzz  Surfe sur Safari Safari 525.27.1 avec Mac OS X Mac OS X 10.5.6
    21 janvier 2009 @ 13:56
    6

    Super plugin Papy !
    Mais je me demandais si il existait la même fonction pour les blogs contenants beaucoup de videos, est-ce possible d’avoir automatiquement une vignette ?

    Peux-tu nous donner les changements de stats en Page Vue/Visiteurs après l’installation de celui-ci ?

  7. Buzz  Surfe sur Opera Opera 9.27 avec Mac OS Mac OS
    24 janvier 2009 @ 14:26
    7

    Oui, je recommente avant que quelqu’un m’ai répondu mais je désirai savoir si les thumbails marchaient aussi pour les videos ??

  8. Papy  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.5 avec Windows Windows Vista
    24 janvier 2009 @ 17:21
    8

    @Buzz – Avec Post Thumbs Revisited on voit juste le logo YouTube ou Dailymotion quand il y a une vidéo dans l’article. Par contre, on n’a pas la miniature de la vidéo. Ca doit pouvoir se faire mais il faut sûrement mettre les mains dans le cambouis.

  9. Buzz  Surfe sur Mozilla Firefox Mozilla Firefox 2.0.0.20 avec Mac OS Mac OS
    25 janvier 2009 @ 19:28
    9

    Merci beaucoup ! Ca fait des mois et des mois que je cherche un plugin capable de le faire automatiquement car je n’ai pas le temps en ce moment de le coder moi même, si tu trouves un plugin capable de réaliser cette prouesse un de ces jours, dit le moi =)

  10. Roger  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.5 avec Windows Windows Vista
    29 janvier 2009 @ 19:16
    10

    Merci pour ce plugin Papy :thumbsup:

    Est-il possible d’exclure une catégorie des résuultats générés par related_posts_thumbnails_v2 ?

  11. 34 tutoriels sur WordPress (astuces, hacks...) | Jean-Baptiste - Blog perso, Actualités, High-Tech, WordPress, Webdesign  Surfe sur WordPress WordPress 2.7.1
    20 février 2009 @ 18:25
    11

    […] On le voit dur de plus en plus de blogs quand on lit un article principalement, la possibilité de se rendre sur les autres articles relatifs à l’article que l’on est en train de lire. Alors c’est bien joli de vouloir faire pareil, mais avec des vignettes c’est encore plus agréable. Mais bon quand on ne s’y connait pas trop, et bien c’est assez dur à coder. Alors voici comment ajouter une liste d’articles relatifs avec en plus leur miniature. […]

  12. kapsteur  Surfe sur Mozilla Firefox Mozilla Firefox 3.1b2 avec Mac OS X Mac OS X 10
    25 février 2009 @ 0:00
    12

    Salut
    Je viens de tester ton plugin, mais j’ai un soucis les images s’affiche les unes en dessous des autres et non à côté.
    Tu sais d’où cela peut venir ?

  13. Sergio  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.6 avec Windows Windows XP
    01 mars 2009 @ 13:54
    13

    Bonjour,
    Moi c’est particulier, j’ai un site ou j’effectue un thumbnail pour chaque article que je rajoute avec la fonction « Champs personalisés » de WordPress et je le nomme THUMBS. La seule chose est que le Thumbs je ne l’heberge pas sur mon blog. Comment puis-je faire appel à chaque Thumbs déja crée par moi meme sur les articles liés.

    Merci bcp !

  14. Buzz  Surfe sur Mozilla Firefox Mozilla Firefox 3.0.8 avec Mac OS X Mac OS X 10
    06 avril 2009 @ 18:54
    14

    Papy, je suis en train d’installer Post Thumb Revisted aka PTR sur mon blog mais je recontre quelques problèmes celui-ci ne gère pas les vidéos Wat et Dailymotion, et autres… Et il n’est pas possible avec ce plugin de faire des miniatures d’images n’étant pas présentent dans le fichier WP-CONTENT.

    Pourrais tu m’aider ?

  15. Toy666  Surfe sur Internet Explorer Internet Explorer 7.0 avec Windows Windows XP
    15 avril 2009 @ 16:11
    15

    Un grand merci à papy, son plug in tue !! :zorro:

  16. nlx  Surfe sur Safari Safari 528.16 avec Mac OS X Mac OS X 10.5.6
    05 mai 2009 @ 22:51
    16

    Comment faire pour afficher la liste de thumbs quand on veut afficher la liste de posts d’une catégorie et pas des posts en relation avec… ?

    NB. PostThumbR est abandonné, il faut mieux pas compter sur lui ! J’ai pas bien compris si le plugin le nécessite ou pas

  17. abds69  Surfe sur Mozilla Firefox Mozilla Firefox 3.5.3 avec Windows Windows 7
    20 septembre 2009 @ 9:57
    17

    quand ça marche ce truc fait la même chose que votre bousin

    http://www.linkwithin.com/learn?ref=widget

  18. Cam  Surfe sur Google Chrome Google Chrome 4.0.266.0 avec Windows Windows 7
    18 février 2010 @ 20:10
    18

    http://www.linkwithin.com/learn?ref=widget ne marche pas :( (erreur du serveur quand on valide le formulaire)

  19. Heilios  Surfe sur Mozilla Firefox Mozilla Firefox 3.6.3 avec Windows Windows 7
    27 avril 2010 @ 11:51
    19

    Hum très pratique ! par contre mes images s’affichent les une en dessous des autres ya moyen de changer ça ? :)

  20. gfx  Surfe sur Mozilla Firefox Mozilla Firefox 3.6.10 avec Windows Windows XP
    24 août 2011 @ 12:57
    20

    merci pour linfo .. :)

  21. ring insurance  Surfe sur PHP PHP
    27 août 2014 @ 8:51
    21

    ring insurance

    WORDPRESS : PLUGIN ARTICLES LIÉS + MINIATURES

  22. hotel murah di jakarta  Surfe sur PHP PHP
    12 septembre 2014 @ 4:13
    22

    hotel murah di jakarta

    WORDPRESS : PLUGIN ARTICLES LIÉS + MINIATURES

  23. Mesothelioma Symptoms Near Death  Surfe sur PHP PHP
    20 septembre 2014 @ 21:15
    23

    Mesothelioma Symptoms Near Death

    WORDPRESS : PLUGIN ARTICLES LIÉS + MINIATURES

PapyGeek a un sexe tellement développé qu'il peut dormir debout en s'en servant comme trépied. +