Take the 2-minute tour ×
WordPress Development Stack Exchange is a question and answer site for WordPress developers and administrators. It's 100% free, no registration required.

My theme's functions.php hooks into wp_enqueue_scripts to register a couple of stylesheets that are used by various site pages. Here's a simplified version of my configuration:

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

Every tutorial I've found so far enqueues every stylesheet from the callback itself, but I don't want to do this. I assume that this would cause all my stylesheets to be included on every page, which is not what I want. I only want to enqueue pagetype1.css if the underlying template for a certain page uses it.

Let's say that I want my front page to use the page type 1 stylesheet. My intuition would be to call wp_enqueue_style("pagetype1"); in front_page.php right before including the header, which contains the wp_head() call. This doesn't do anything. The sitewide CSS on the other hand was included like I expected. What am I doing wrong?

I know that there is a workaround out there, but I'd prefer that front-page.php retains control over which additional stylesheets are loaded.


Edit: This is what I ended up with after some discussion with toscho. I added this to 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.");
    }
}

Then I called mytheme_enqueueStyle("pagetype1") from front-page.php to enqueue the stylesheet. This way of doing things ended up being incompatible with WP Minify, though.

share|improve this question
    
I don't think that there is any way to use wp_enqueue_scripts inside a template. The workaround in your link or the solution from toscho is the way to go. If you really want to include the script logic inside the template files you'll need to just use a <script>/<style> tag. This would be ok, if this is a custom development (enqueue script is primarly used for dependency management & for plugins to hook into the added scripts to exchange/remove or minify/combine them). –  s1lv3r Apr 26 '13 at 15:20
add comment

1 Answer

up vote 2 down vote accepted

Check the current template in your callback. This is a post meta field named _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
});
share|improve this answer
    
This solution shifts control over which stylesheets are loaded from front-page.php to functions.php, which is why I didn't like the workaround I linked to from my original post. Isn't there a mechanism that lets front-page.php decide for itself? –  Pieter Apr 26 '13 at 15:19
    
@Pieter You could also check is_front_page() in the enqueue function, or add an action callback on top the front-page.php. I think there should be as little logic in a template as possible. –  toscho Apr 26 '13 at 15:32
    
Then I suggest a compromise: I add a function mytheme_enqueueStyle($arrayOfStyleHandles) to functions.php that creates the action callback for the template. front-page.php retains control and can enqueue additional stylesheets with a one-liner. Does this address your concerns? –  Pieter Apr 26 '13 at 15:48
    
Maybe I misunderstand you. You can use is_front_page() wherever you want. But if you use add_action() in a template file, the code will be hard to maintain, because that’s not the first place to search for these things. –  toscho Apr 26 '13 at 15:56
    
I was thinking about putting something along these lines in functions.php. I'd call this function from front-page.php to enqueue pagetype1 indirectly without using add_action in the template. Strangely this doesn't work, despite that calling add_action directly from the template file did work. –  Pieter Apr 26 '13 at 17:48
show 2 more comments

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.