J’ai toujours pensé qu’il serait intéressant de pouvoir changer la couleur de fond des lignes des publications en fonction de différents critères dans l’administration WordPress. J’ai donc cherché et trouvé des tutoriels pour le faire. Mais la mauvaise chose est que chaque tutoriel avait le même code, probablement un simple copier-coller. Et en plus, après quelques tests, j’ai vu que tous ces messages étaient incomplets. C’est pourquoi j’ai décidé d’approfondir un peu l’explication de la façon d’ajouter des couleurs d’arrière-plan spécifiques à la ligne des messages. Et pour ce faire, nous allons créer un nouveau plugin !
Étape 1 : Le plugin
Ok, alors commencez, nous devons créer un plugin, comme nous l’avons vu dans mes précédents messages, c’est la partie la plus simple. Créez un nouveau dossier dans wp-content/plugins et nommez-le « color-my-posts ». À l’intérieur, créez un nouveau fichier et appelez-le…. « color-my-posts.php » (ne pensez pas que je n’ai pas d’imagination !). Ouvrez ce fichier et ajoutez ce code :
<?php
/*
Plugin Name: Color My Posts
Plugin URL: http://remicorson.com/color-my-posts
Description: A little plugin to color post rows depending on the posts' status in the administration
Version: 0.1
Author: Remi Corson
Author URI: http://remicorson.com
Contributors: corsonr
tags: color, customization, administration, corsonr, remi corson
*/
Cela dit simplement à WordPress qu’il y a un nouveau plugin appelé « Color My Posts » dans son dossier de plugins. Maintenant, votre plugin, même s’il est vide, devrait être listé dans la liste des plugins sous le menu « Plugins ». Dans l’étape suivante, nous allons créer une classe simple pour instancier le plugin.
Étape 2 : La classe principale
Comme nous avons créé une classe dans mon tutoriel sur l’ajout d’attributs personnalisés aux menus WordPress, nous devons faire de même et créer une classe, voici comment procéder :
class rc_color_my_posts {
/*--------------------------------------------*
* Constructor
*--------------------------------------------*/
/**
* Initializes the plugin
*/
function __construct() {
add_action('admin_footer', array( &$this,'rc_color_my_admin_posts') );
} // end constructor
function rc_color_my_admin_posts(){
/* Be patient ! */
}
}
// instantiate plugin's class
$GLOBALS['color_my_posts'] = new rc_color_my_posts();
Ici, nous créons une classe appelée « rc_color_my_posts qui contient un constructeur et une fonction appelée rc_color_my_admin_posts(). Dans le constructeur, nous accrochons la fonction rc_color_my_admin_posts() à admin_footer. Cela signifie que notre fonction sera prise en compte lors du chargement du pied de page d’administration. Il ne nous reste plus qu’à ajouter du code CSS à notre fonction. Ce code sera imprimé directement dans le code source des pages d’administration WordPress.
Étape 3 : Styliser les messages
Comme je l’ai déjà dit, tous les tutoriels sur le style de la ligne de publication dans l’administration WordPress que j’ai vus, nous traitons uniquement du statut de la publication. C’est vrai, vous pouvez styliser les messages ligne par statut, mais pas seulement. Pour ceux que ça intéresse, il y a une fonction appelée get_post_class() dans le /wp-includes/post-template.php fichier de base. Au cas où – Ne modifiez pas le code de ce fichier (du moins ni pour l’instant) !
Eh bien, cette fonction get_post_class() est géniale car c’est elle qui détermine les classes d’un article. Cette fonction est utilisée dans l’administration et dans le frontend. Voici comment ajouter du code CSS personnalisé pour chaque classe générée par get_post_class :
function rc_color_my_admin_posts(){
?>
<style>
/* Color by post Status */
.status-draft { background: #ffffe0 !important;}
.status-future { background: #E9F2D3 !important;}
.status-publish {}
.status-pending { background: #D3E4ED !important;}
.status-private { background: #FFECE6 !important;}
.post-password-required { background: #ff9894 !important;}
/* Color by author data */
.author-self {}
.author-other {}
/* Color by post format */
.format-aside {}
.format-gallery {}
.format-link {}
.format-image {}
.format-quote {}
.format-status {}
.format-video {}
.format-audio {}
.format-chat {}
.format-standard {}
/* Color by post category (change blog by the category slug) */
.category-blog {}
/* Color by custom post type (change xxxxx by the custom post type slug) */
.xxxxx {}
.type-xxxxx {}
/* Color by post ID (change xxxxx by the post ID) */
.post-xxxxx {}
/* Color by post tag (change xxxxx by the tag slug) */
.tag-xxxxx {}
/* Color hAtom compliance */
.hentry {}
</style>
<?php
}
Comme ce code n’est pas compliqué, j’ai ajouté des commentaires dans le code lui-même. Donc, en gros, pour styliser les lignes par :
- Statut de la publication, utilisez .status-xxx où xxx est le statut de la publication
- Auteur, utilisez .author-self pour cibler les articles que vous avez écrits et .author-other pour les articles écrits par d’autres auteurs
- Format de publication, utilisez .format-xxx où xxx est le format de publication
- Catégorie de poste, utilisez .category-xxx où xxx est le slug de catégorie, vous pouvez cibler autant de catégories que vous le souhaitez
- Type de poste, utilisez .xxx ou .type-xxx où xxx est le slug de type post, vous pouvez cibler autant de CPT que vous le souhaitez
- Identifiant de la publication, utilisez .post-xxx où xxx est l’ID de la publication, vous pouvez cibler autant de publications que vous le souhaitez
- Étiquette de publication, utilisez .tag-xxx, où xxx est le slug de balise, vous pouvez cibler autant de balises que vous le souhaitez
- .hentry est utilisé pour cibler hAtom conformité
Je n’ai pas défini de couleurs pour toutes les classes, mais vous pouvez le faire vous-même et personnaliser le plugin pour qu’il ressemble à ce que vous voulez vraiment.
Qu’en est-il des messages collants ?
Lorsque je travaillais sur ce petit plugin, j’ai remarqué qu’il n’y avait pas de classe ajoutée aux messages collants. Enfin, au moins dans l’administration. Je suis donc allé à nouveau dans le fichier post-template.php et j’ai vu qu’il y avait une classe .sticky ajoutée au post collant mais seulement si is_home() && !is_paged()… pourquoi ? C’est vraiment étrange. C’est la raison pour laquelle j’ai créé un billet sur la piste principale de WordPress pour le mentionner. Pour ceux qui veulent vraiment pouvoir styliser les messages collants dans l’administrateur, ajoutez simplement ce code à la fonction get_post_class() même si je recommande de ne jamais modifier les fichiers principaux de WordPress :
// sticky for Sticky Posts in administration
if ( is_sticky($post->ID) && is_admin() )
$classes[] = 'post-sticky';
Télécharger le plugin
Pour ceux qui souhaitent utiliser le plugin directement hors de la boîte sans avoir à le créer vous-même, j’ai ajouté le plugin au référentiel, simplement Cliquez ici pour le télécharger.