How to load a custom stylesheet for your Front Page
- Set up
front-page.php
(which you’ve done already). - Create a stylesheet for your front page (you can copy
style.css
, but more likely, you’ll just want to override a few things). Let’s call itfront-page-style.css
. - View the HTML source of one of your pages, and find the
id
of thestyle.css
file (probably something along the lines ofyour-theme-css
) Trimming the-css
part will tell us what we need to use as a dependency in the code. -
Add the following to your theme’s
functions.php
file:add_action( 'wp_enqueue_scripts', 'wpse102732_front_page_styles', 20 ); function wpse102732_front_page_styles() { if( is_front_page() ) { // Any dependencies go here: // if the style.css id in step 3 was 'your-theme-css', // then use 'your-theme' $deps = array( 'your-theme' ); $handle="your-theme-front-page"; $url = get_stylesheet_directory_uri() . '/front-page-style.css'; wp_enqueue_style( $handle, $url, $deps ); } }
You should now be able to modify styles in front-page-style.css
for just the front page.