When working with a WordPress theme, one of the first things you’ll want to do in your functions.php file is enqueue your styles and scripts properly. This ensures your CSS and JavaScript files are loaded efficiently and in the correct order.

  • To enqueue styles, you'll use the wp_enqueue_style() function. This function requires a few parameters:
  • Name – A unique handle for your style.
  • Direction – The path to your CSS file, often built using get_template_directory_uri().
  • Dependencies – Any other styles that need to be loaded before this one.
  • Caching – A version number to help with browser cache control (we can use filemtime() to automatically version the file based on its last modification time).
  • Media – Specifies which media types the styles apply to (e.g., 'all', 'screen').
function enqueue_styles() {
    wp_enqueue_style(
        'theme-style', 
        get_template_directory_uri() . '/style.css',
        array(),
        filemtime(get_template_directory() . '/style.css'),
        'all'
    );
}
add_action('wp_enqueue_scripts', 'enqueue_styles');