Enqueue Styles and Scripts in Functions File for Child Theme

, , , ,

This is what you need to include in the functions file of your child theme to include the parents style without having to do a @import in the css file. This also checks the last modified time and uses that as a query variable to ensure you are loading the latest version in cache.

function enqueue_custom_child_theme_styles() {
   wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css', false, filemtime( get_template_directory() . '/style.css' ), 'all' ); //
   wp_enqueue_style( 'child-style', get_stylesheet_uri(), array('parent-style'), filemtime( get_stylesheet_directory() . '/style.css' ), 'all'  );
   wp_enqueue_style( 'additional-style', get_stylesheet_directory_uri() . '/additional_style.css', array(), filemtime( get_stylesheet_directory() . '/additional_style.css' ), 'all'  );
   wp_enqueue_script( 'theme-js' , get_stylesheet_directory_uri() . '/js/misc.js', array('jquery'), filemtime( get_stylesheet_directory() . '/js/misc.js' ), true );
}
add_action( 'wp_enqueue_scripts', 'enqueue_custom_child_theme_styles' );

You may also need to deregister the parent style if it is being included in the parent theme. If so then you need to make sure to update the name to its handle.

add_action( 'wp_print_styles', 'custom_deregister_styles', 20 );
function custom_deregister_styles() {
    wp_dequeue_style( 'divi-style' );
}

 

 

Skills

Posted on

June 21, 2016

Submit a Comment

Your email address will not be published.