WordPress : des archives à la façon de ShaunInman.com

archives_shauninman.pngCela fait quelques temps que je suis en admiration devant la présentation des liens vers les pages d’archives mensuelles du blog de ShaunInman.com. Outre la sobriété et l’élégance certaines (à mes yeux du moins) de son thème, il a su présenter ces liens d’une manière à la fois fonctionnelle, compact et bien plus intéressante que la classique et bête liste à laquelle nous sommes généralement confrontés. De plus, je ne sais pas ce que les afficionados du HTML qui passeront dans le coin en penseront, mais je trouve l’usage d’un tableau au moins aussi valable et justifié dans ce cas que celui d’une liste. Je dirais même qu’une liste non-ordonnée n’est peut-être pas le choix le plus cohérent pour une succession d’années et de mois présentées (généralement) en ordre inverse, non ? (clin d’œil à Bruno inside)

Je voulais donc, pour le prochain thème de burninghat.net (actuellement en travaux et bientôt, j’espère, sur vos écrans), utiliser une présentation du même type pour mes archives. La tâche n’est pas des plus faciles vu que la fonction native de WordPress, wp_get_archives(), n’est pas du tout prévu pour permettre la moindre personnalisation un peu avancée. D’ailleurs, si l’exemple ci-dessous est parfaitement fonctionnel, je vais encore devoir faire évoluer le truc pour atteindre le résultat vraiment désiré.

Pour présenter nos archives en tableau à la façon de ShaunInman.com, nous allons devoir :

  1. récupérer les années durant lesquelles des articles ont été publiés
  2. récupérer les mois durant lesquels des articles ont été publiés
  3. générer un tableau en plaçant des liens sur les mois sus-cités et pas sur ceux où nous n’avons rien produit (est-ce possible ? Apparemment oui, j’y suis bien arrivé moi ! :D)

Pour récupérer les années puis les mois où nous avons publié des billets, nous allons utiliser la class wpdb et plus précisément sa méthode get_col() de WordPress. Celle-ci permettant de stocker dans un tableau le résultat d’une requête SQL sur une colonne dans la base de données de notre blog. Le principal problème étant que ce tableau est évidemment dimensionné selon le nombre de vos résultats. Ainsi, si sur une année vous n’avez publié que durant 8 mois non consécutifs, l’affichage de vos archives risque de ne pas être très cohérent. Pour le moment, j’ai contourné ce problème à l’aide de la fonction array_flip() de php.

Ce qui nous donne le code suivant :

<h3>Archives</h3> <table summary="liens vers les archives du blog">
<tbody>
<?php $years = $wpdb->get_col("SELECT DISTINCT YEAR(post_date) FROM $wpdb->posts WHERE post_status = 'publish' AND post_type = 'post' ORDER BY post_date DESC");
foreach ( $years as $year ) :
?>
<tr>
<th scope="row"><?php echo $year; ?></th>
<?php
$months = $wpdb->get_col("SELECT DISTINCT MONTH(post_date) FROM $wpdb->posts WHERE post_status = 'publish' AND post_type = 'post' AND YEAR(post_date) = '".$year."' ORDER BY post_date ASC");
$monthwithposts = array_flip($months);
for ( $x = 1 ; $x <= 12 ; $x++ ){
if ( array_key_exists($x, $monthwithposts) ){
?>
<td><a href="<?php echo get_month_link($year, $x); ?>"><?php echo $x; ?></a></td>
<?php
} else { echo "<td>$x</td>"; }
}
?>
</tr>
<?php endforeach; ?>
</tbody>
</table>

Afin d’obtenir ceci (résultat non-stylisé):

archives_shauninman_02.png

Ce code pouvant être placé à volonté dans :

  • un widget personnalisé, par exemple dans le fichier “functions.php” de votre thème afin de surcharger le widget “archives” d’origine par celui-ci
  • directement dans le fichier “sidebar.php” de votre thème. Si celui-ci n’est pas destiné à être widget-ready par exemple
  • voir même sous forme de ShortCode si vous en êtes tellement fan que vous voulez pouvoir les afficher un peu partout.

Plus qu’à y ajouter vos CSS et/ou le personnaliser à votre envie.

Reste à faire !

J’aimerais encore pouvoir afficher en infobulle le nombre de billets et de commentaires de chaque mois contenant des archives, comme sur ShaunInman.com et évidemment mettre en place les CSS qui-vont-bien pour donner une allure présentable à ce tableau.

Toutes vos suggestions d’améliorations, optimisations, modifications sont vraiment les bienvenues ! De même que vos avis sur cette façon de présenter ses archives, etc.

Bref, ce n’est plus vraiment une ébauche (ça fonctionne comme attendu) mais pas tout à fait un produit fini, j’en suis parfaitement conscient. Mais j’espère que ça vous aura donner des idées et que nous pourrons faire avancer

Articles relatifs

Related posts brought to you by Yet Another Related Posts Plugin.



23 commentaires

  1. papoo a dit le 12 août 2008 à 22:11 | Permalien

    Idée intéressante, Merci. Personnellement je préférerais les années en colonnes pour afiner le tableau afin qu’il ne déforme pas trop la sidebar et des CSS tout prêt.
    Tu as réalisé 90% du travail dommage que tu ne le concrétise pas par un widget tout fait qui t’apporterai gloire et reconnaissance éternelles de fainéants de wordpress dans mon genre (non non j’en rajoute pas) ;o)

  2. Bruno Bichet a dit le 12 août 2008 à 22:24 | Permalien

    Cette fonction est carrément susceptible de me faire changer d’avis sur les archives disponibles normalement sous la forme du calendrier traditionnel. Très beau travail ! et merci pour le lien ;)
    Je vais copier-coller cette fonction pour la mettre dans mon template le temps de trouver de la place :D

  3. burningHat a dit le 12 août 2008 à 22:26 | Permalien

    Merci ! Pour l’avoir en colonne, suffit d’inverser un peu l’HTML et c’est fait ;)

    Yop, je ferais peut-être le widget clé en main quand j’aurais implémenté tout ce que je veux dedans. Ceci dit, avec le tuto sur comment modifier les widgets donné en lien à la fin, c’est fait en quelques minutes (le temps de faire les bons copié/collé quoi ;)).

  4. burningHat a dit le 12 août 2008 à 22:28 | Permalien

    @Bruno De rien ! Content que ça te plaise et j’espère que ça te sera utile ! Je tiendrais évidemment au courant ici de l’avancée des travaux (pour l’info-bulle, tout ça) ;) Ayant bien remarqué l’absence d’archives sur tes différents thèmes, je me doutais que tu doutais (hum) de l’utilité de la chose.

    Perso, j’en doute aussi mais j’arrive pas à m’en séparer quand même (j’aime à croire que ça peut servir parfois) du coup cette présentation me parait le compromis idéal :p

  5. Bruno Bichet a dit le 12 août 2008 à 22:46 | Permalien

    @Manu > ouais tout à fait , le côté calendrier par mois, ne donne pas vraiment d’indications précises et oblige à cliquer sur les mois pour faire défiler les archives… alors quand il faut cliquer 24 fois ;))

    Ca y est je viens de le placer en bas des la sidebar sur la plupart des pages du blog ;)

  6. burningHat a dit le 12 août 2008 à 22:49 | Permalien

    Yeah excellent ! très joli et merci bien pour la vraiment très chouette dédicace ! :D

  7. Wolfman a dit le 12 août 2008 à 22:56 | Permalien

    Ca c’est de la super bonne idée, et plutôt simple à mettre en place (sur un wordpress non-widgetisé en tout cas). :-)

  8. Michel a dit le 13 août 2008 à 2:30 | Permalien

    Salut Manu
    je me suis permis d’utiliser ton code sur mon site.Vraiment génial en tout cas et comme je ne suis pas trop “plugins” - le rêve pour moi quoi !

    PS : j’ai aussi mis un lien vers ton site (noblesse oblige) .

  9. burningHat a dit le 13 août 2008 à 8:37 | Permalien

    Merci Michel et Wolfman! J’aime bien comme vous l’avez intégré dans vos blogs respectifs. À le voir en situation, je suis vraiment content parce que ça rend bien.

    Merci aussi pour le lien Michel ! :D

  10. Mika a dit le 13 août 2008 à 18:23 | Permalien

    Adopté aussi sur ma page d’archives

  11. Bruno Bichet a dit le 13 août 2008 à 18:28 | Permalien

    Pour revenir sur l’utilisation des tables dans ce contexte, j’y suis bien évidemment favorable vu la nature du contenu. Et seule l’envie de faire des fantaisies en stylant des listes ordonnées ou non pourrait nous faire préférer une autre solution ;) (pas facile, ces discussions à cheval sur plusieurs blogs)

  12. burningHat a dit le 13 août 2008 à 20:29 | Permalien

    @Mika > très intéressant cette idée de l’utiliser dans la page d’archives, j’aime bien

    @Bruno > Yop, ça serait vraiment “just for fun” alors ! Sinon c’est clair que les discussions multi-blogs, c’est un peu sport ;)

  13. Mika a dit le 14 août 2008 à 10:16 | Permalien

    Je me demandais s’il n’était pas possible de remplacer les numéros des mois par les initiales (JFMAMJJASOND)… Mais ça me paraît compliqué… Peut-être déjà récupérer Jan, Fév, Mar… ?
    Je vais voir si je peux fouiller dans ce sens

  14. burningHat a dit le 14 août 2008 à 10:53 | Permalien

    Pas très difficile à vue de nez, il suffit d’avoir un tableau avec les initiales avant les boucles (début du code), genre :
    $initiales = array(1 => 'J', 2 => 'F', 3 => 'M', 4 => 'A', etc. )

    et de remplacer l’affichage du numéro $x par $initiales[$x] dans la boucle à priori.

    J’écris ça de tête, je n’ai pas testé maisça devrait fonctionner assez facilement !

  15. Mika a dit le 14 août 2008 à 11:59 | Permalien

    Cela fonctionne impeccablement merci !

  16. burningHat a dit le 14 août 2008 à 13:06 | Permalien

    De rien Mika ! :D

  17. Sophie a dit le 14 août 2008 à 13:26 | Permalien

    Généralement je trouve les archives tellement moches que je les efface de mon template.
    Sympa de partager ton code, malheureusement pour moi je suis sous dotclear mais je pense que cela est adaptable facilement.

  18. burningHat a dit le 14 août 2008 à 14:39 | Permalien

    Ça fait bien longtemps que je n’ai pas tripatouiller sérieusement avec Dotclear donc je ne saurais te répondre Sophie. Cependant j’imagine que ça ne doit pas être bien compliqué à transposer en effet.

  19. bruno bichet a dit le 18 août 2008 à 12:45 | Permalien

    Salut, j’ai essayé de changer les chiffres par $initiales, mais je n’y arrive pas :/

  20. burningHat a dit le 18 août 2008 à 12:58 | Permalien

    le tableau $initiales doit être défini au début (donc même avant $year par exemple) puis, dans la boucle qui affiche les mois, faut remplacer les $x par $initiales[$x]. Exemple : <td;><a href="<?php echo get_month_link($year, $x); ?>"><?php echo $x; ?></a></td> par <td><a href="<?php echo get_month_link($year, $x); ?>"><?php echo $initiales[$x]; ?></a></td>.

    Mais sinon, pas d’inquiétude, ça devrait être la prochaine fonctionnalité du plugin ces jours je pense.

  21. bruno bichet a dit le 18 août 2008 à 14:02 | Permalien

    @burnin’ > oki, donc, je peux annoncer cette fonctionnalité prochaine dans mon billets à venir ? ;)

  22. bruno bichet a dit le 18 août 2008 à 14:25 | Permalien

    Cool, ça marche maintenant, j’avais fait un bête chercher-remplacer sur toutes les occurrences de $x ^_^v

  23. burningHat a dit le 18 août 2008 à 15:49 | Permalien

    héhé, le rechercher/remplacer, redoutable outil, peut parfois se transformer en terrible ennemi source de bien des migraines ;) (proverbe geek)

    Yop, même que tu l’as déjà fait, je te dis quand même que tu peux l’annoncer ;)

2 trackbacks

  1. [...] Contenu | Menu | Recherche « WordPress : des archives à la façon de ShaunInman.com [...]

  2. [...] à mon article sur les archives à la façon de ShaunInman.com puis la publication de mon plugin WordPress bhCalendarchives, j’ai enregistré une remontée [...]

Laisser un commentaire

Votre adresse email ne sera jamais publiée ou revendue à des tiers. Les champs requis sont marqués d'un *.

*
*