I get some issue when putting .css file into the <head>
The function which I use works great but files added after all the <script> tag and I would like to add them before.
function custom_styles() {
echo"
<link rel='stylesheet' href='/css/custom.css' type='text/css' media='all'>
<link rel='stylesheet' href='/css/screen.css' type='text/css' media='all'>
";
}
add_action( 'wp_head', 'custom_styles' 10 );
Any help would be appreciated
It is because wp_head actions defined by user is triggered after the ones defined by wordpress, so your content will be added at the end of <head> tag. You can change the priority of action to value below default ( 10 ) , add_action( 'wp_head', 'custom_styles', 1 );, or you can use more appropriate action wp_enqueue_scripts and method wp_enqueue_style.
add_action( 'wp_enqueue_scripts', function() {
wp_enqueue_style( 'style-name', get_stylesheet_directory_uri() . '/css/custom.css' );
});
Try below code
function theme_name_scripts() {
wp_enqueue_style( 'style-name', get_stylesheet_uri() );
// add js file in html header
wp_enqueue_script( 'script-name', get_template_directory_uri() . '/js/example.js', array(), '1.0.0', true );
}
add_action( 'wp_enqueue_scripts', 'theme_name_scripts' );
see more example