web-dev-qa-db-fra.com

Comment charger un style CSS dans la zone d'administration de WordPress uniquement?

J'essaie de charger un fichier CSS pour ma zone de publication WordPress, mais sans succès. J'ai lu la fonction wp_enqueue_style et suis venu avec le code ci-dessous, mais il ne se charge pas. Y a-t-il une étiquette ou un caractère manquant dans mon code? J'ai un panneau d'écriture personnalisé lorsqu'un utilisateur poste que je veux styler avec le fichier CSS. Toute aide est la bienvenue.

Voici ce que j'ai dans mon fichier de thèmes functions.php:

function mytheme_add_init() {
    $file_dir=get_bloginfo('template_directory');
    wp_enqueue_style("functions", $file_dir."/scripts/custom.css", false, "1.0", "all");
    wp_enqueue_script("rm_script", $file_dir."/scripts/custom.js", false, "1.0");
}
admincss
7
Kurt Bunch

Décrochez simplement votre rappel dans admin_print_styles, c'est-à-dire:

add_action( 'admin_print_styles', 'mytheme_add_init' );

Vous pouvez également ajouter un wrapper conditionnel is_admin() dans votre rappel et le connecter à wp_enqueue_scripts:

function mytheme_add_init() {
    if ( is_admin() ) {
        $file_dir=get_bloginfo('template_directory');
        wp_enqueue_style("functions", $file_dir."/scripts/custom.css", false, "1.0", "all");
        wp_enqueue_script("rm_script", $file_dir."/scripts/custom.js", false, "1.0");
    }
}
add_action( 'wp_enqueue_scripts', 'mytheme_add_init' );

Mais l'approche absolue best consiste à vous connecter à la page d'administration de votre thème , via admin_print_styles-appearance_page_{pagename}:

add_action( 'admin_print_styles-appearance_page_{pagename}', 'mytheme_add_init', 11 );

Ceci est un crochet personnalisé spécifiquement pour votre page de présentation, telle que définie via votre appel add_theme_page().

6
Chip Bennett

Réponse tardive: Comme les deux réponses précédentes montraient des méthodes anciennes, incomplètes ou compliquées, voici une version mise à jour qui fonctionne de manière v3.5 +.

Qu'est ce qui est different?

Voici la liste

  • La première chose à faire consiste à utiliser le hook admin_enqueue_scripts. Ce crochet
  • Le dernier argument de wp_enqueue_style()s est le support ciblé et il est déjà défini sur all par défaut. Pas besoin de l'ajouter.
  • Nous utilisons la fonction get_template_directory_uri() pour récupérer l'URL de notre feuille de style. Inutile de vérifier la valeur de l'option template_directory ici.
  • Nous utilisons ensuite la valeur de retour get_template_directory() pour extraire le chemin et le renvoyer dans un appel filemtime() pour obtenir la dernière fois où la feuille de style a été modifiée. De cette manière, nous ajoutons un nouveau numéro de version en tant qu'argument de requête et forçons le navigateur à recharger la feuille de style s'il existe une nouvelle version. Pas besoin de forcer les rechargements durs avec Ctrl + F5.
  • Une chose importante est d’ajouter les bonnes dépendances, car vous ne voulez pas que vos styles soient écrasés avec une spécifité supérieure par wp-admin.css, ie (encore pire) ou le schéma de couleurs. La partie la plus difficile consiste à vérifier le jeu de couleurs, car ce fichier contient la plupart des styles de l'interface utilisateur et constitue un paramètre utilisateur. Nous voulons également ajouter cela à la dépendance.
  • La dernière chose que nous faisons est d'encapsuler l'appel pour ajouter le point d'ancrage à une autre fonction liée au point d'ancrage contextuel admin_head-*, où * est le pageslug. Nous l’accrochons deux fois pour prendre en considération les nouveaux messages ainsi que les messages édités.

Voici le code de votre fichier functions.php.

add_action( 'admin_head-post.php', 'wpse44135AttachAdminStyle' );
add_action( 'admin_head-post-new.php', 'wpse44135AttachAdminStyle' );
function wpse44135AttachAdminStyle()
{
    add_action( 'admin_enqueue_scripts', 'wpse44135EnqueueAdminStyle' );
}
function wpse44135EnqueueAdminStyle()
{
    $scheme = get_user_meta(
        get_current_user_id(),
        'admin_color',
        true
    );

    wp_enqueue_style(
        "admin_style",
        get_template_directory_uri()."/scripts/custom.css",
        array( 'wp-admin', 'ie', "colors-{$scheme}" ),
        filemtime( get_template_directory()."/scripts/custom.css" ),
        "all"
    );
}

Des alternatives?

Si vous souhaitez simplement ajouter des styles à l’éditeur TinyMCE WYSIWYG, vous pouvez également utiliser add_editor_style() pour enregistrer votre feuille de style de thèmes dans l’éditeur de texte des zones d’administration. Le chemin que vous ajoutez en tant qu'argument est relatif à la racine de vos thèmes. Dans votre fichier functions.php:

add_editor_style( '/scripts/custom.css' );

C'est aussi simple que ça.

7
kaiser

Voici un moyen rapide d'ajouter du style dans admin head. J'espère que cela t'aides:

add_action('admin_head', 'my_custom_fonts');
function my_custom_fonts() {
  echo '<style>
    body, td, textarea, input, select {
    font-family: "Lucida Grande";
    font-size: 12px;
  } 
</style>';
}
0
Chandan Kumar Thakur