Applying two stylesheets for WordPress Theme

Question

I would like to add two stylesheets to my WordPress theme. I would like to have one style sheet for my home page and another for my about page. The reason for this is I would like to apply different styles to my header and footer for these pages.

I tried the code below within function.php but of course it did not work.

wp_register_script ('add-about-css', get_stylesheet_directory_uri('about'). '/about.css' );

wp_enqueue_script('add-about-css');

add_action('wp_enqueue_scripts');

Answer 1

First of all get_stylesheet_directory_uri does not accept any parameter.

Next

<?php if (is_page('$your_page_name/id/slug')) { ?>
<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/about.css" type="text/css">
<?php }; ?>

Put this code in your header after linking to your default stylesheet. This will overwrite default styles with your new-style (for header, footer or whatever you defined). This is the case when you have same header with different style.

Alternately, if you are having two separate headers, then you can use

<?php get_header('custom') ?>

to load header-custom.php (if found else load default header.php) and custom styles for this can either be placed in style.css or can be included separately like

add_action('wp_enqueue_scripts','my_function');
function my_function(){
wp_enqueue_style('my-custom-style', get_template_directory_uri() . '/my-custom-style.css');   
}