web-dev-qa-db-ja.com

CSSスタイルをWordPressの管理領域のみに読み込むにはどうすればいいですか？

私は私のWordPressの投稿領域にCSSファイルをロードしようとしていますが、運が悪いです。 wp_enqueue_style関数を読み直して、以下のコードを思い付きましたが、ロードされません。私のコードに欠けているタグや文字がありますか。ユーザーがCSSファイルを使ってスタイルを設定したい場合は、カスタムの書き込みパネルがあります。どんな助けでも素晴らしいでしょう。

これが私のテーマの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

コールバックをadmin_print_stylesにフックするだけです。つまり：

add_action( 'admin_print_styles', 'mytheme_add_init' );

または、コールバック内にis_admin()条件付きラッパーを追加し、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' );

しかし、絶対的なbestアプローチは、テーマの管理ページにフックする、admin_print_styles-appearance_page_{pagename}経由です：

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

これは、add_theme_page()呼び出しを介して定義された外観ページ用のカスタムフック固有です。

6
Chip Bennett

遅れた答え：前の答えはどちらも古い、不完全な、または複雑な方法を示していたので、ここにv3.5 +の方法で動作する更新版を示します

何が違うの？

これがリストです

  • 最初にすることはadmin_enqueue_scriptsフックを使うことです。このフック
  • 最後の引数wp_enqueue_style()sはターゲットメディアで、デフォルトではすでにallに設定されています。追加する必要はありません。
  • get_template_directory_uri()関数を使ってスタイルシートのURlを取得します。ここでtemplate_directoryのオプション値を確認する必要はありません。
  • 次に、get_template_directory()の戻り値を使用してパスを取得し、それをfilemtime()呼び出しにラップして、スタイルシートが最後に編集された場所を取得します。このようにして、クエリ引数として新しいバージョン番号を追加し、新しいバージョンがあればブラウザにスタイルシートをリロードさせます。ハードリロードを強制する必要はありません Ctrl + F5。
  • 重要なことの1つは、wp-admin.css、ie（さらに悪いこと）、または配色によってあなたのスタイルをより高い指定で上書きさせたくないので、正しい依存関係を追加することです。このファイルは管理UIでスタイルされているもののほとんどを持っており、ユーザー設定であるため、本当に難しい部分は配色をチェックすることです。これを依存関係としても追加したいと思います。
  • 最後に行うことは、コンテキストadmin_head-*フックにフックされている別の関数にフックを追加するための呼び出しをラップすることです。ここで、*はpageslugです。新規および編集済みの投稿を考慮に入れるために、2回フックします。

これが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"
    );
}

選択肢は？

TinyMCE WYSIWYGエディタにスタイルを追加するだけの場合は、 add_editor_style() を使用して、テーマスタイルシートを管理エリアのテキストエディタに登録することもできます。引数として追加したパスは、テーマルートからの相対パスです。あなたのfunctions.phpファイルで：

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

それはそれと同じくらい簡単です。

7
kaiser

これはadminヘッドにスタイルを追加する簡単な方法です。お役に立てれば：

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