vendredi 25 septembre 2026

À propos

Contact

Tips

Ajouter des colonnes personnalisées et triables à la liste des articles

La liste d'administration des articles peut afficher bien plus que le titre et la date. Voici comment y ajouter des colonnes utiles et triables.

Par Clément Hadrot • 18 octobre 2022 • 4 min de lecture • Aucun commentaire
Ajouter des colonnes personnalisées et triables à la liste des articles

La liste d’administration des articles (Articles > Tous les articles) affiche par défaut le titre, l’auteur, les catégories, les étiquettes, le nombre de commentaires et la date. Pour beaucoup de projets, cette liste gagnerait à afficher une information métier plus utile : une référence produit, un statut de validation interne, une date d’expiration. WordPress permet d’ajouter ces colonnes facilement, et de les rendre triables, sans passer par une extension.

Cet article détaille les trois hooks nécessaires pour une colonne complète et fonctionnelle : son ajout, son contenu, et son tri.

Ajouter une colonne

Le filtre manage_{post_type}_posts_columns permet d’ajouter, retirer ou réorganiser les colonnes de la liste. Pour un type de contenu produit, par exemple :

add_filter( 'manage_produit_posts_columns', function( $colonnes ) {
    $colonnes['reference'] = 'Référence';
    return $colonnes;
} );

Pour positionner la nouvelle colonne à un endroit précis plutôt qu’à la fin (juste après le titre, par exemple), il faut reconstruire le tableau dans l’ordre souhaité :

add_filter( 'manage_produit_posts_columns', function( $colonnes ) {
    $nouvelles_colonnes = array();
    foreach ( $colonnes as $cle => $libelle ) {
        $nouvelles_colonnes[ $cle ] = $libelle;
        if ( 'title' === $cle ) {
            $nouvelles_colonnes['reference'] = 'Référence';
        }
    }
    return $nouvelles_colonnes;
} );

Afficher le contenu de la colonne

L’action manage_{post_type}_posts_custom_column se charge d’afficher la valeur pour chaque ligne, en fonction de la colonne concernée :

add_action( 'manage_produit_posts_custom_column', function( $colonne, $post_id ) {
    if ( 'reference' === $colonne ) {
        $reference = get_post_meta( $post_id, 'reference', true );
        echo $reference ? esc_html( $reference ) : '—';
    }
}, 10, 2 );
L'essentiel à retenir : manage_{post_type}_posts_columns ajoute une colonne ; manage_{post_type}_posts_custom_column affiche son contenu ; pre_get_posts rend la colonne réellement triable

Rendre la colonne triable

Déclarer une colonne comme triable se fait en deux temps. D’abord, l’enregistrer comme triable via le filtre manage_edit-{post_type}_sortable_columns :

add_filter( 'manage_edit-produit_sortable_columns', function( $colonnes ) {
    $colonnes['reference'] = 'reference';
    return $colonnes;
} );

Ensuite, indiquer à WordPress comment interpréter ce critère de tri dans la requête réelle, via pre_get_posts :

add_action( 'pre_get_posts', function( $query ) {
    if ( ! is_admin() || ! $query->is_main_query() ) {
        return;
    }
    if ( 'reference' === $query->get( 'orderby' ) ) {
        $query->set( 'meta_key', 'reference' );
        $query->set( 'orderby', 'meta_value' );
    }
} );

Sans cette seconde étape, cliquer sur l’en-tête de colonne fait bien apparaître les flèches de tri dans l’interface, mais n’a strictement aucun effet sur l’ordre affiché : c’est l’erreur la plus fréquente lors de la mise en place de ce type de colonne.

Gérer un tri numérique correctement

Pour une valeur numérique (un prix, une quantité), orderby doit être réglé sur meta_value_num plutôt que meta_value, sous peine d’un tri alphabétique qui placerait « 100 » avant « 20 » :

add_action( 'pre_get_posts', function( $query ) {
    if ( ! is_admin() || ! $query->is_main_query() ) {
        return;
    }
    if ( 'prix' === $query->get( 'orderby' ) ) {
        $query->set( 'meta_key', 'prix' );
        $query->set( 'orderby', 'meta_value_num' );
    }
} );

Ajouter une colonne avec une taxonomie

Pour afficher les termes d’une taxonomie personnalisée dans une colonne, la fonction utilitaire native est plus directe :

add_action( 'manage_produit_posts_custom_column', function( $colonne, $post_id ) {
    if ( 'categorie_produit' === $colonne ) {
        the_terms( $post_id, 'categorie_produit', '', ', ' );
    }
}, 10, 2 );

Rendre une colonne cliquable vers une action

Un cas fréquent : afficher un lien direct vers une page front, ou déclencher une action rapide (dupliquer, archiver) depuis la liste, sans devoir ouvrir chaque contenu individuellement.

add_action( 'manage_produit_posts_custom_column', function( $colonne, $post_id ) {
    if ( 'voir_fiche' === $colonne ) {
        printf(
            '<a href="%s" target="_blank">Voir la fiche</a>',
            esc_url( get_permalink( $post_id ) )
        );
    }
}, 10, 2 );

Bonnes pratiques

  • Toujours échapper la sortie avec esc_html() ou esc_url() selon le contexte
  • Limiter le nombre de colonnes ajoutées à ce qui apporte réellement de la valeur au quotidien
  • Vérifier la largeur des colonnes sur un écran réduit, la liste d’administration restant peu adaptée au responsive
  • Tester le tri avec un jeu de données réaliste, en particulier quand la métadonnée est absente sur certains contenus

Une colonne triable mal configurée reste le piège classique : les flèches de tri apparaissent, mais sans pre_get_posts correctement branché, elles ne font strictement rien.

En résumé

Trois hooks suffisent pour transformer la liste d’administration en un vrai outil de travail adapté au métier du site : manage_{post_type}_posts_columns pour l’ajout, manage_{post_type}_posts_custom_column pour l’affichage, et la combinaison manage_edit-{post_type}_sortable_columns avec pre_get_posts pour le tri. Un détail technique à ne jamais oublier : sans ce dernier couple de hooks, une colonne « triable » en apparence ne trie strictement rien.

Partager :

À propos de l'auteur

Clément Hadrot

Développeur WordPress, passionné par Elementor, le FSE et l’automatisation par IA.

Voir tous ses articles

Dans la même veine

À lire aussi