I've googled and googled but I can't seem to find out anything that's understandable to me...

I want to have a static front page for my website, to this end I have created a front-page.php file in the active theme's folder in my FTP server. I notice any edits I do in style.css are not reflected in front-page.php. I want to have a separate stylesheet for my front page anyway, so how do I go about linking front-page.php to a custom .css file, let's say, front-style.css, so I can just edit the .css file to style the .php file? Or isn't this the right approach?

  • Edits to style.css should be reflected in your front page, unless you're already loading a custom stylesheet. – Pat J Jun 12 '13 at 13:27

How to load a custom stylesheet for your Front Page

  1. Set up front-page.php (which you've done already).
  2. 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 it front-page-style.css.
  3. View the HTML source of one of your pages, and find the id of the style.css file (probably something along the lines of your-theme-css) Trimming the -css part will tell us what we need to use as a dependency in the code.
  4. 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.


| improve this answer | |

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.