Site icon WP Smith

Add Custom CSS File Based on Page Type: Front Page, Home Page, Category Page, Archive Page, 404 Page, Author Page, and Page

So I found one question that I read that asked how to have a custom CSS file per page. Here's an easy way to add custom CSS files based on simple conditional logic in Genesis.

[php]
remove_action('genesis_meta', 'genesis_load_stylesheet'); //removes current stylesheet
add_action('genesis_meta','genesis_custom_css');
//get_bloginfo('stylesheet_url') is our normal style.css
function genesis_custom_css() {
if (is_category())
echo '<link rel="stylesheet" href="'.CHILD_DIR.'/css/cat_style.css" type="text/css" media="screen" />'."n";
if (is_home() || is_front_page())
echo '<link rel="stylesheet" href="'.get_bloginfo('stylesheet_url').'" type="text/css" media="screen" />'."n";
if (is_archive())
echo '<link rel="stylesheet" href="'.CHILD_DIR.'/css/arch_style.css" type="text/css" media="screen" />'."n";
if (is_author())
echo '<link rel="stylesheet" href="'.CHILD_DIR.'/css/auth_style.css" type="text/css" media="screen" />'."n";
if (is_page()) //also can take $pages=array(1,2,3); adding and elseif or else at the end.
echo '<link rel="stylesheet" href="'.CHILD_DIR.'/css/page_style.css" type="text/css" media="screen" />'."n";
if (is_404())
echo '<link rel="stylesheet" href="'.CHILD_DIR.'/css/page_style.css" type="text/css" media="screen" />'."n";
}
[/php]