it-swarm-ja.com

どのスタイルシートをエンキューするかをテンプレートに選択させるにはどうすればよいですか。

私のテーマのfunctions.phpwp_enqueue_scriptsにフックしてさまざまなサイトページで使用されるいくつかのスタイルシートを登録します。これが私の設定の簡略版です。

add_action("wp_enqueue_scripts", function() {       
    // This stylesheet is used on *every* page
    wp_register_style("sitewide", get_template_directory_uri() . "/assets/sitewide.css");
    wp_enqueue_style("sitewide");

    // These stylesheets are used by *some* pages
    wp_register_style("pagetype1", get_template_directory_uri() . "/assets/pagetype1.css", array("sitewide"));
    wp_register_style("pagetype2", get_template_directory_uri() . "/assets/pagetype2.css", array("sitewide"));
});

これまでに見つけたチュートリアルはすべて、コールバック自体からすべてのスタイルシートをエンキューしていますが、これはしたくありません。私はこれがすべての私のスタイルシートがすべてのページに含まれることを引き起こすと思いますが、これは私が望むことではありません。特定のページの基礎となるテンプレートがそれを使用している場合にのみ、pagetype1.cssをエンキューしたいです。

フロントページにページタイプ1スタイルシートを使用したいとしましょう。私の直感は、wp_enqueue_style("pagetype1");呼び出しを含むヘッダーをインクルードする直前にfront_page.phpwp_head()を呼び出すことです。これは何もしません。一方、サイト全体のCSSは予想どおりに含まれていました。何がおかしいのですか?

私はそこに 回避策 があることを知っています、しかし私はfront-page.phpがどの追加スタイルシートがロードされるかについて制御を保持することを好むでしょう。


編集:これは、toschoでの議論の後で終わったものです。これをfunctions.phpに追加しました:

// Enqueues a stylesheet handle or an array of stylesheet handles.
function mytheme_enqueueStyle($handles) {
    if (is_array($handles)) {
        add_action("wp_enqueue_scripts", function() use ($handles) {
            foreach ($handles as $handle) {
                wp_enqueue_style($handle);
            }
        });
    } else if (is_string($handles)) {
        add_action("wp_enqueue_scripts", function() use ($handles) {
            wp_enqueue_style($handles);
        });
    } else {
        wp_die("Unsupported parameter type.");
    }
}

それから私はfront-page.phpからmytheme_enqueueStyle("pagetype1")を呼び出してスタイルシートをエンキューしました。しかし、このやり方では、WP Minifyとの互換性がなくなりました。

1
Pieter

コールバックで現在のテンプレートを確認してください。これは_wp_page_templateという名前の投稿メタフィールドです。

add_action("wp_enqueue_scripts", function() 
{
    // This stylesheet is used on *every* page
    wp_register_style("sitewide", get_template_directory_uri() . "/assets/sitewide.css");
    wp_enqueue_style("sitewide");

    if ( ! is_singular() )
        return;

    $template = get_post_meta( get_the_ID(), '_wp_page_template', TRUE );

    // now enqueue further stylesheets depending on the current template
});
2
fuxia