Why don't these wp_enqueue_style() functions work when they are hooked to the wp_head() hook via add_action()

Question

I'm watching the video on "linking CSS" in "How to Build a wordpress website". We created a custom function called theme_styles(), and in the function we use wp_enqueue_style() to load our css sheets. We then use add_action() to attach our custom theme_styles() function to the wp_enqueue_srcipts() hook. It worked fine, but it seemed to make more sense to me to attach the theme_styles() function to the wp_head() hook. I tried this, and my files didn't load, and so I am wondering why the wp_head() hook doesn't work in this case and the wp_enqueue_scripts() function does.

Answer 1 · 2014-07-26T01:42:14Z

July 26, 2014 1:42am

according to your code (feel free to share) it should technically work. Here's a simple explanation of why it matters where which one you use... where-is-the-right-place-to-register-enqueue-scripts-styles

Answer 2 · 2014-07-26T03:21:47Z

July 26, 2014 3:21am

Hmmm. Thanks for getting back to me so quick my friend. I'm totally stumped then, cause it just plain works with the 'wp_enqueue_srcipts' hook, and doesn't with the 'wp_head' hook. IF you're still curious and think you can conquer this little puzzle, I'll give you the code.

here's the functions.php file

function theme_styles() {

wp_enqueue_style('main', get_template_directory_uri() . '/style.css');
wp_enqueue_style('grid', get_template_directory_uri() . '/css/grid.css');
wp_enqueue_style('normalize', get_template_directory_uri() . '/css/normalize.css');
wp_enqueue_style('social', get_template_directory_uri() . '/css/webfonts/ss-social.css');
wp_register_style('flexslider', get_template_directory_uri() . '/css/flexslider.css');

if (is_page('home')){
    wp_enqueue_style('flexslider'); 
}

add_action('wp_head', 'theme_styles'); /* add_action('wp_enque_scripts', 'theme_styles'); <= This one works. The one above doesn't */

add_theme_support('menus');

============================

here's the header.php file

================================

<!DOCTYPE html> <head>

<?php wp_head();?>

</head> <?php $menu_array = array( 'menu' => 'main menu' ); wp_nav_menu($menu_array); ?>

<body>

Welcome to the Treehouse Community

Looking to learn something new?

Luke Travis

Luke Travis

Why don't these wp_enqueue_style() functions work when they are hooked to the wp_head() hook via add_action()

2 Answers

Andrew McCormick

Andrew McCormick

Luke Travis

Luke Travis

here's the functions.php file