NB : Faire une sauvegarde de votre thème, de votre fichier et/ou votre base de données avant d’ajouter ces fonctions tutoriels.
Publié le : 05 février 2016 - Modifié le : 18 janvier 2022
Temps de lecture : 2 minutes, 6 seconds - 198 mots
Partager la publication "wp_register_style CSS Admin pour un Plugin WordPress"
Il est vraiment puissant par exemple de pouvoir styliser son contenu de Plugin WordPress et donner son meilleur dans le CSS pour rendre le plugin le plus attrayant et le plus visuel et pratique possible.
Il y a un manière dans votre fichier index ou settings.php de votre Plugin d’inclure le Path functions.php pour y inclure vos fonctions.
Le wp_register_style pour un plugin
// Include path functions include( plugin_dir_path( __FILE__ ) . 'functions.php');
Voici donc une petite fonction qui active wp_register_style et wp_enqueue_style.
Créer un dossier nommé css et créer un nouveau fichier du nom de admin.css.
Dans votre functions.php
// Load styles css for admin plugin
function via_custom_wp_admin_style() {
wp_register_style( 'custom_wp_admin_css', plugins_url('/css/admin.css', __FILE__), false, '1.0.0', 'all');
wp_enqueue_style( 'custom_wp_admin_css' );
}
add_action( 'admin_enqueue_scripts', 'via_custom_wp_admin_style' );Comme vous remarquez, le chemin est notifié pour trouver le dossier et est un peu différent de l’habituel. Cette fois ci c’est plugins_url au lieu de get_stylesheet_directory_uri() .
Maintenant prenons l’exemple d’intégrer du Javascript dans le plugin en utilisant le wp_enqueue_script. Il faut paramétrer un dossier js dans la racine du plugin et nommé un dossier js et un fichier PHP nommé shortcodes.php. Loader le dans cette manière avec cette fonction
Dans votre functions.php
// Load javascript for admin plugin
function via_shortcodes_script() {
wp_enqueue_script('shortcodes',plugins_url( '/js/shortcodes.js' , __FILE__ ),
array( 'scriptaculous' )
);
}
add_action( 'wp_enqueue_scripts', 'via_shortcodes_script' );Voilà il vous reste plus qu’à intégrer vos div ect… et de les styliser dans votre admin.css !
Consulter le codex wp_register_style