How do I make header.php use different css for different pages?

Question

I register styles in function.php with

function my_scripts() {
    wp_deregister_style( 'header' );
    wp_register_style( 'header', get_template_directory_uri() . '/css/header.css' );
    wp_enqueue_style( 'header' );
}
add_action( 'wp_enqueue_scripts', 'my_style_sheets' );

I'd like to use different header style sheet for the same header.php file used on another page. How do I do that?

In general, how do I use styles differentiated by template instead of using a global setting like the one above?

SickHippie · Accepted Answer · 2012-06-04 22:51:45Z

0

Create a primary stylesheet and enqueue as normal. Then, make a series of conditional statements using WP core functions - is_home(), is_404(), is_page_template('template.php') and so on. In each of those conditionals, enqueue the stylesheet you want that overwrites your core stylesheet, using your primary (style.css) stylesheet as a dependency.

Untested code, but should work:

function my_styles() {
    wp_deregister_style( 'header' );
    wp_register_style( 'style', get_template_directory_uri() . '/css/style.css' );
    wp_enqueue_style( 'style' );
    if (is_home()) { wp_enqueue_style('homestyle', get_template_directory_uri(). '/css/homestyle.css', 'style'); }
}
add_action('wp_print_styles', 'my_styles');

answered Jun 4, 2012 at 22:51

SickHippie

3,0851 gold badge24 silver badges27 bronze badges

1

Thank you. I also found these pages useful: Function Reference/body class, Contextually changing your theme’s stylesheet

ivvi
– ivvi

2012-06-07 10:43:33 +00:00
Commented Jun 7, 2012 at 10:43

Add a comment |

Stack Exchange Network

How do I make header.php use different css for different pages?

1 Answer 1

Your Answer

Hot Network Questions

How do I make header.php use different css for different pages?

1 Answer 1

Your Answer

Sign up or log in

Post as a guest

Related

Hot Network Questions