How to use custom stylesheet only for a template in child theme

Question

I am using Themco's X theme. To modify the theme styles I used the Ethos child theme provided by Themeco. I have designed a custom template in the child theme. Now I want a stylesheet custom-style.css to be used only for that theme. But when I use this

    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_url'); ?>/custom-style.css">

the link that comes up is that of the parent theme rather than the child theme. What else can be done to use that stylesheet only for that template?

Please note I don't want that stylesheet to be used in any other template.

Answer 1

Try this:

add_action( 'wp_enqueue_scripts', 'my_custom_styles_function', 100 );

function my_custom_styles_function(){
  if (is_page_template('test-template.php')) {
    wp_enqueue_style( 'my-custom-css', get_stylesheet_directory_uri() . '/custom-style.css' );
  }
}

wp_enqueue_scripts hook is used for including new stylesheet. Here template is test-template.php. Change it with your template. Stylesheet will only be included in your page template.