Adding style sheet to specific page

Utilize the wordpress conditional tags to selectively enqueue / load your stylesheets. This is best practice so you can call any dependancies as well.

I’ve provided an example of this in practice. Often we only want to include styles for the front page and then style accordingly to your sub page:

<?php 
// Is this the front page or home page  ?
if (is_front_page() && is_home() )  {
// if so then lets enqueue this!
// for reference the function uses the following parameters:
// wp_enqueue_style( $handle, $src, $deps, $ver, $media ) ?
  wp_enqueue_style( 'mystyle', TEMPLATEPATH . 'foo.css', array('my-dependency-styles', 'reset-style'), '1.0.1', 'only screen and print' ); 
} else {  
  wp_enqueue_style( 'mystyle', TEMPLATEPATH . 'sub-page.css', array('my-dependency-styles', 'reset-style'), '1.0.1', 'only screen and print' ); ?>
  }

Leave a Comment