Vous êtes ici : Blog > Programmation > Ajouter une dashicon à un CPT sur le backoffice WordPress

Ajouter une dashicon à un CPT sur le backoffice WordPress

Pas de commentaire

WordPress devient très puissant (et malléable) si vous utilisez des "customs post types" (appelés CPT). Dans cet article, vous verrez même comment ajouter une icône devant vos nouveaux menus (les CPT). Vous obtiendrez alors une interface d'administration personnalisée pour vos utilisateurs du backoffice.

Voici par exemple le résultat final obtenu sur deux customs post types (Diaporama et Réalisations) :

Dashicons WordPress

La méthode à suivre pour ajouter une dashicon :

  1. Ajouter une feuille de style (.css) personnalisée pour le backoffice
  2.  Ajouter l'argument "menu_icon" (et sa valeur) dans la déclaration de votre CPT
  3. Ajouter les icônes souhaitées à vos CPT via le fichier .css

Ajouter une feuille de style pour le backoffice uniquement :

Personnellement, je vous conseille de créer un nouveau fichier CSS. Je l'ai nommé ici "wpc-admin.css" mais vous pouvez l'appeler bien sûr comme bon vous semble. On l'intègre ensuite uniquement dans l'interface d'administration en ajoutant les lignes de codes ci-dessous via le fichier functions.php de votre thème :

Ajouter l'argument "menu_icon" dans la création de votre "custom post type" :

Il suffit d'ajouter la ligne suivante lors de la création de votre CPT (située dans le fichier functions.php de votre thème ou dans un fichier spécifique séparé comme je vous le conseille).

Ajouter les icônes "dashicons" :

Depuis la version 3.8, WordPress intègre automatiquement une police d'icônes, appelée "dashicons". Vous pouvez alors facilement l'utiliser et mettre en place le CSS suivant (en ciblant le menu de votre CPT).

Astuce : si vous êtes sur Firefox, utilisez Firebug pour obtenir l'identifiant (ID) de votre CPT déjà en place dans votre menu.

Dashicons WordPress

Consultez ici la liste des icônes disponibles avec la police dashicons :

Listing icônes Dashicons disponibles

Pour info, si vous utilisez une version WP antérieure à 3.8, vous pouvez aussi mettre en place vos propres icônes (sous forme d'images cette fois-ci). Il suffira d'utiliser la déclaration suivante dans la création de votre CPT :

 

 
Article publié le 12/09/2016 avec 758 Vues

Laissez un commentaire :