I am trying to include a CSS file using wp_enqueue_style conditionally on whether I am on the front page. I am testing for the home page with this code:

if ( is_front_page() ) wp_enqueue_style ('TBDhome', get_template_directory_uri() . '/css/TBDhome.css','all');

It worked find when I was testing in the header file and including the CSS file.

I am trying to include a CSS file using wp_enqueue_style conditionally on whether I am on the front page. I am testing for the home page with this code:

if ( is_front_page() ) wp_enqueue_style ('TBDhome', get_template_directory_uri() . '/css/TBDhome.css','all');

It worked find when I was testing in the header file and including the CSS file.

• functions
• conditional-tags
• wp-enqueue-style

• Do you have a style sheet with the all handle? You have that listed as a dependency. Can you post more code from your function? This isn't enough to help. – disinfor Commented Oct 10, 2017 at 18:06
• Where is this check happening? Is it happening inside an action/filter? Or are you straight up calling it right in the file outside any function? Keep in mind that when enquing styles and scripts it should be happening on the appropriate hook, don't just write random code in functions.php without using hooks/actions or it won't work as expected – Tom J Nowell ♦ Commented Oct 10, 2017 at 18:22
• Thanks. I don't have action/filter and I'm not sure how to create them. Where can I get information on these? – LindaH53 Commented Oct 10, 2017 at 20:01
• Google is your friend. developer.wordpress/reference/functions/wp_enqueue_style – disinfor Commented Oct 11, 2017 at 4:10

3 Answers 3

Even though this question may get down voted - because not enough information has been provided and it's fairly easy to find tutorials elsewhere, I'll help you out.

In your functions.php file in your theme, you need to do this:

add_action( 'wp_enqueue_scripts', 'wp5849_scripts' );
function wp5849_scripts() {
    if ( is_front_page() ) :
        wp_enqueue_style('TBDhome', get_stylesheet_directory_uri() . '/css/TBDhome.css');
    endif;
}

What this is doing: The first line add_action is the hook to run your function wp5849_scripts() at a certain point during WordPress's internal setup. You can read more about action hooks and filters in the WordPress codex.

The second part is the actual function to enqueue the stylesheet. Checks to see if it's the front page of the site, if it passes, it will load the stylesheet.

I updated the directory to be get_stylesheet_directory_uri() because if you are using a child theme, get_template_directory_uri() will return the PARENT theme directory. get_stylesheet_directory_uri() will work with whatever theme is currently active (parent or child).

You can read more on the arguments that are passed to wp_enqueue_style here

As a note: you may already have a function that is enqueuing scripts and styles in your functions.php (look for the add_action( 'wp_enqueue_scripts') hook). If that's the case, you simply need to add:

if ( is_front_page() ) :
        wp_enqueue_style('TBDhome', get_stylesheet_directory_uri() . '/css/TBDhome.css');
endif;

to the function that the add_action is calling. I wanted to add this as an option.

EDIT: It appears there may be a larger theme issue or setting issue, based on OP comments. Here is an option to place the stylesheet in the header.php

if ( is_front_page() ) {
    echo '<link rel="stylesheet" id="TBDHome-css"  href="' . get_stylesheet_directory_uri() . '/css/TBDhome.css" type='text/css' media='all' />
}

is_front_page() will return false before the wp hook because the wp object is not set up yet.

//* If placed directly in functions.php, this will work
add_action( 'wp', 'wpse_282498_wp' );
function wpse_282498_wp() {
  if( is_front_page() ) {
    do_something_useful();
  }
}

//* If placed directly in functions.php, this will *not* work
if( is_front_page() ) {
  //* Because this will never be run
  do_something_useful();
}

Check whether you have created front-page.php in root folder.