J’ai toujours pensé qu’il serait intéressant de pouvoir changer la couleur de fond des lignes des posts selon différents critères dans l’administration WordPress. Donc, j’ai regardé autour de moi et j’ai 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 de plus, après quelques tests, j’ai vu que tous ces articles étaient incomplets. C’est pourquoi j’ai décidé d’aller un peu plus loin dans l’explication de la façon d’ajouter des couleurs d’arrière-plan spécifiques à la ligne des articles. Et pour ce faire, nous allons créer un nouveau plugin!

Étape 1: Le plugin

Ok, alors commençons, nous devons créer un plugin, comme nous l’avons vu dans mes précédents articles, 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» (s’il vous plaît 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
*/

Ce que cela fait, c’est simplement dire à WordPress qu’il y a un nouveau plugin appelé “Color My Posts” dans son dossier plugins. Maintenant, votre plugin, même s’il est vide, devrait être répertorié 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

Lorsque 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 le faire:

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 raccordons 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 articles

Comme je l’ai déjà dit, tous les didacticiels 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 articles en fonction de leur statut, mais pas seulement. Pour ceux qui sont intéressés, il existe une fonction appelée get_post_class () dans le /wp-includes/post-template.php fichier core. Juste 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 excellente car c’est elle qui est responsable de la détermination des classes de publication. 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, fondamentalement, pour styliser les lignes par:

  • Statut du message, utilisez .status-xxx où xxx est l’état 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 du message, 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 de publication, vous pouvez cibler autant de CPT que vous le souhaitez
  • Identifiant de publication, utilisez .post-xxx où xxx est l’ID de publication, vous pouvez cibler autant de publications que vous le souhaitez
  • Jour après, 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 articles collants?

Quand je travaillais sur ce petit plugin, j’ai remarqué qu’aucune classe n’avait été ajoutée aux posts collants. Eh bien, au moins dans l’administration. Donc je suis retourné dans le fichier post-template.php et j’ai vu qu’il y avait une classe .sticky ajoutée au post-it 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 être en mesure de styliser les articles collants dans l’administrateur, ajoutez simplement ce code à la fonction get_post_class () même si je recommande de ne jamais modifier les fichiers de base de WordPress:

// sticky for Sticky Posts in administration
if ( is_sticky($post->ID) && is_admin() )
$classes[] = 'post-sticky';

Téléchargez le plugin

Pour ceux qui veulent 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.

Share: