Personnalisation des tables d'administration WordPress : modifications avancées

Dans notre premier article de notre série sur la personnalisation des tableaux d'administration WordPress, nous avons examiné comment appliquer une configuration de base à nos écrans d'administration de types de publication, notamment en ajoutant une colonne personnalisée et en la rendant triable.

Aujourd'hui, nous allons aller plus loin et examiner quelques modifications supplémentaires qui peuvent être appliquées à la table d'administration de la liste des publications. Allons-y!

Améliorer le tableau des messages d'administration WordPress

Fournir des informations supplémentaires dans votre écran de tableau d'administration pour vos utilisateurs backend améliorera certainement leur expérience de flux de travail. Dans ce didacticiel, nous viserons à améliorer les données affichées dans notre tableau Post Admin en ajoutant des informations, en modifiant le contenu existant, en réorganisant les colonnes et même en supprimant les colonnes de tableau inutiles.

Afficher les images en vedette

Il serait vraiment utile d'ajouter une vignette en vedette à la liste des publications de votre tableau d'administration. Cela accélérerait vraiment la capacité de voir si un message a la mauvaise image (ou peut-être n'a-t-il pas d'image du tout) sans avoir à ouvrir chaque message individuel.

Pour ce faire, nous allons créer une colonne d'images en vedette pour la page de notre article d'édition et la remplir avec une vignette d'image. Comme indiqué dans notre article précédent, nous utiliserons le manage_posts_columns . Si vous n'avez pas encore lu cet article, veuillez le faire car il comprend une partie du code requis pour ce didacticiel.

Si vous avez lu l'article et l'avez suivi, vous devriez avoir le code suivant dans le fichier functions.php de votre thème actif. Si ce n'est pas le cas, ajoutez-le !

 add_filter('manage_posts_columns','add_custom_columns'); function add_custom_columns( $columns ) { $columns['last_modified'] = 'Last modified'; return $columns; } add_action( 'manage_posts_custom_column','custom_columns_content', 10, 2 ); function custom_columns_content ( $column_id, $post_id ) { switch( $column_id ) { case 'last_modified': echo get_post_field('post_modified', $post_id); break; } }

Pour afficher l'image en vedette dans notre tableau d'administration, nous devons modifier ce code comme suit :

 add_filter('manage_posts_columns','add_custom_columns'); function add_custom_columns( $columns ) { $columns['last_modified'] = 'Last modified'; $columns['my_post_thumbs'] = 'Thumbs'; return $columns; } add_action( 'manage_posts_custom_column','custom_columns_content', 10, 2 ); function custom_columns_content ( $column_id, $post_id ) { switch( $column_id ) { case 'last_modified': echo get_post_field('post_modified', $post_id); break; case 'my_post_thumbs': echo the_post_thumbnail( 'thumbnail' ); break; } }

Les nombres, 10 et 2 dans les troisième et quatrième arguments, dictent la priorité dans laquelle les fonctions associées à cette action seront traitées. Ces arguments seront passés à notre fonction custom_columns_content .

La priorité par défaut est 10. Le nombre 2 indique la quantité d'arguments de la fonction. Donc, dans notre cas, il est important d'inclure ces chiffres car nous avons 2 arguments, à savoir $column_id et $post_id .

Maintenant, avec ce code enregistré, voyons ce que nous avons dans notre écran de messages d'administration.

Comme vous pouvez le voir, nous avons maintenant une colonne "Dernière modification" et notre nouvelle colonne "Thumbs".

Modifier les étiquettes de colonne

Supposons que nous souhaitions, pour une raison quelconque, modifier le libellé d'une colonne, par exemple, renommer la colonne 'Auteur' en 'Auteur'. Pour ce faire, nous pouvons simplement définir la nouvelle étiquette de la même manière que nous avons ajouté notre colonne personnalisée. Encore une fois, pour garder notre code plus distinctif, nous séparerons les extraits de code de renommage à l'aide d'une fonction différente.

 add_filter('manage_posts_columns','rename_columns'); function rename_columns( $columns ) { $columns['author'] = 'Writer'; return $columns; }

Bien sûr, vous pouvez modifier l'étiquette de plusieurs colonnes dans le même extrait de code en ajoutant simplement $columns['COLUMN_ID'] = 'NEW_LABEL'; juste avant return $columns;

Améliorer le tableau des pages d'administration WordPress

Vous ne le savez peut-être pas, mais les pages WordPress sont un type de publication hiérarchique, ce qui signifie que chaque page peut avoir une page parente.

Il peut être très utile de voir d'un coup d'œil quelle page est la page parent de n'importe quelle page enfant. Voyons comment procéder.

Ajouter une colonne personnalisée qui affiche le message parent

Tout d'abord, créé des pages parent et enfant avec des images en vedette associées.

Ensuite, nous allons mettre du code dans notre fichier functions.php . Nous allons suivre le même processus que nous avons fait avec le type Posts concernant l'ajout de ce que nous appellerons la colonne "Ancêtre".

 add_filter('manage_pages_columns','add_ancestor_column'); function add_ancestor_column( $columns ) { $columns['ancestor'] = 'Ancestor'; return $columns; }

Il en va de même pour placer la colonne à l'endroit souhaité dans le tableau. Nous allons réorganiser les colonnes du tableau afin que la colonne "Ancêtre" vienne avant la colonne Auteur.

 add_filter('manage_pages_columns', 'change_ancestor_column_position'); function change_ancestor_column_position($columns) { $n_columns = array(); foreach($columns as $key => $value) { if ($key=='author'){ $n_columns['ancestor'] = 'ancestor'; } $n_columns[$key] = $value; } return $n_columns; }

À ce stade, dans l'écran d'administration de votre page, vous devriez voir quelque chose comme ceci :

La dernière chose que nous devons faire est de remplir la colonne 'Ancêtre' avec le bon contenu. Parce que nous travaillons cette fois avec un type de publication hiérarchique, nous utiliserons un crochet différent pour obtenir le contenu de la colonne. Essayez d'insérer ce morceau de code et vérifiez le résultat.

 add_action( 'manage_pages_custom_column','ancestor_column_content', 10, 2 ); function ancestor_column_content ( $column_id, $post_id ) { switch( $column_id ) { case 'ancestor': $ancestors = get_ancestors($post_id, 'subject', 'post_type'); $post_ancestor = end($ancestors); if ($post_ancestor != 0) { echo '<a href="' . get_edit_post_link($post_ancestor) . '">' . get_the_title($post_ancestor) . '</a>'; } else { echo '-'; } break; } }

Vous devriez maintenant voir la page parent associée à côté de leurs pages enfants répertoriées dans la colonne "Ancêtre".

Ceci est particulièrement utile si et quand l'ordre de vos pages dans le tableau d'administration est perturbé (par exemple parce qu'elles sont triées par date de publication, etc.) et que les pages enfants n'apparaissent donc plus correctement sous leurs pages parentes respectives.

Modification des colonnes par défaut

Il y a plusieurs choses qui peuvent être faites pour améliorer les colonnes du tableau Admin par défaut. Jetons un coup d'œil à certains d'entre eux.

Réorganiser les colonnes

Dans notre précédent article sur la personnalisation des tableaux d'administration, nous avons ajouté une nouvelle colonne qui affiche la date à laquelle la publication a été modifiée pour la dernière fois. Mais que se passe-t-il si nous voulons changer sa position dans l'ordre des colonnes ?

C'est heureusement assez simple et peut être implémenté en utilisant le crochet manage_posts_columns .

Ce qui doit être défini, c'est la colonne qui doit être déplacée et la colonne immédiatement avant l'endroit où nous voulons placer notre colonne. Donc, si, par exemple, nous voulons l'image caractéristique comme première colonne de tableau, nous devrons la déplacer avant la colonne de titre. Le code pièce correspondant devrait ressembler à ceci :

 add_filter('manage_posts_columns', 'change_column_order'); function change_column_order($columns) { $n_columns = array(); $move = 'author'; // what to move $before = 'title'; // move before this foreach($columns as $key => $value) { if ($key==$before){ $n_columns[$move] = $move; } $n_columns[$key] = $value; } return $n_columns; }

Et voila !

Suppression d'une colonne

Parfois, certaines colonnes du tableau de la liste des articles ne sont pas particulièrement utiles et il serait préférable de les supprimer afin de libérer de l'espace. Un candidat courant pour cela est la colonne des commentaires.

Heureusement, il est très facile de supprimer une colonne de notre table. Il suffit d'ajouter unset($columns['comments']); dans la fonction du crochet manage_posts_columns . Bien que cela puisse être ajouté à notre code existant, il est plus simple de le séparer dans son propre extrait de code car il a un objectif différent et introduit une nouvelle fonction dans le crochet.

 add_filter('manage_posts_columns' , 'remove_columns'); function remove_columns($columns) { unset($columns['comments']); return $columns; }

Et c'est tout. Actualisez votre écran d'administration et vous devriez voir que la colonne Commentaires a disparu.

Remarque : Si vous n'êtes pas sûr de l'ID d'une colonne, vous pouvez le détecter en utilisant la console d'inspection de votre navigateur.

Le plugin des colonnes d'administration

Si vous ne voulez pas coder les modifications apportées à vos tableaux d'administration WordPress, n'ayez crainte… comme il s'agit de WordPress, il existe un plugin qui vous permettra de faire un certain nombre de mises à jour sans avoir à toucher à une ligne de code. C'est ce qu'on appelle les colonnes d'administration.

Remarque : Avant de procéder à l'installation/l'activation du plug-in, il est préférable d'annuler toutes les personnalisations du tableau de la liste des messages (si vous en avez fait) et de commencer à utiliser le plug-in avec le tableau des messages d'administration dans son état initial.

Une fois que vous avez téléchargé et installé le plug-in, accédez à l'élément de menu Paramètres> Colonnes d'administration. À partir de là, vous pouvez sélectionner le tableau de la liste des publications (ou tout autre type de publication pour lequel vous souhaitez pouvoir modifier sa table d'administration) dans la liste déroulante. Vous verrez alors la structure actuelle de la table.

Maintenant, en utilisant une interface glisser-déposer, vous pouvez facilement réorganiser les colonnes. Vous pouvez également modifier l'étiquette de type et la largeur en utilisant l'icône de flèche pour afficher leur configuration.

Et, oui, vous pouvez même ajouter vos propres colonnes en utilisant le bouton "Ajouter une colonne" en bas à droite !

Ce que le plugin fait réellement ici, c'est rassembler toutes les options disponibles dans les tables de base de données qui se rapportent au type de publication et les fournit dans le menu déroulant Type. Ainsi, si, par exemple, vous souhaitez ajouter une colonne "Dernière modification" comme nous l'avons fait auparavant, recherchez-la et sélectionnez-la dans la liste Type, puis attribuez-lui l'étiquette et la largeur souhaitée.

Après cela, vous pouvez modifier les options de format de date qui apparaîtront si vous le souhaitez.

Conclusion

Avoir les bonnes informations sur vos tableaux d'administration WordPress peut vraiment accélérer votre flux de travail et aider à prévenir les erreurs sur votre site Web. Par exemple, il est beaucoup moins probable que vous publiiez sciemment un article sans image en vedette lorsque vous pouvez voir tous vos articles et leurs images en vedette associées en un coup d'œil dans le tableau Post Admin. Jouez et configurez vos tables d'administration en fonction de vous et de votre flux de travail.