How do I specify a stylesheet in child-theming WP twentyseventeen? What do I need to do to register my chosen child theme?

250 Views Asked by At

After some trial and error, it appears that I have created a child theme of twentyseventeen, as I earlier did of twentysixteen, but while the dashboard shows the name I chose for my theme, the stylesheet loaded is not displaying my changes because I modified the child theme style.css and it is loading the original twentyseventeen.css; the rendered pages include <link rel='stylesheet' id='twentyseventeen-style-css' href='https://cjshayward.com/wp-content/themes/twentyseventeen/style.css?ver=4.7' type='text/css' media='all' />.

How can I modify my child theme so it uses its own instead of the parent theme's stylesheet?

My functions.php reads:

<?php
update_option( 'siteurl', 'https://cjshayward.com' );
update_option( 'home', 'https://cjshayward.com' );
add_action( 'wp_enqueue_scripts', 'theme_enqueue_styles' );
function theme_enqueue_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );

}
?>

So far, every thing I've tried has failed to get it to load from its own stylesheet, /wp-content/themes/twentyseventeen-ux-tweaks-child/style.css. Editing functions.php hasn't worked. Editing header.php hasn't worked, **although I'm wondering if there's some secondary damage because I haven't told it canonically to use my child theme rather than the twentyseventeen original. Replacing get_template_directory_uri() with '/wp-content/themes/twentyseventeen-ux-tweaks-child hasn't worked. I could probably get what I want by an Apache URL rewrite, but I'd really like to know the right way to do this in Wordpress.

What do I need to register a child theme correctly so that it uses the provided child theme's style.css as its stylesheet?

Thanks,

--UPDATE--

My functions.php now reads:

<?php
update_option( 'siteurl', 'https://cjshayward.com' );
update_option( 'home', 'https://cjshayward.com' );

function my_theme_enqueue_styles() {
     $parent_style = 'twentyseventeen';
     wp_enqueue_style( $parent_style, get_template_directory_uri() .
       '/style.css' );
    wp_enqueue_style( 'twentyseventeen-ux-tweaks-child',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style )
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>

I am experiencing the same behavior as before. I have not yet seen https://cjshayward.com/wp-content/theme/twentyseventeen-ux-tweaks-child/style.css from inspecting elements and tracing the stylesheets.

1

There are 1 best solutions below

1
On

According to wordpress.org it's necessary to enqeue both the parent style and the child theme style, so that should be:

<?php
update_option( 'siteurl', 'https://cjshayward.com' );
update_option( 'home', 'https://cjshayward.com' );

function my_theme_enqueue_styles() {
    $parent_style = 'twentyseventeen'; 
    wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'twentyseventeen-ux-tweaks-child',
        get_stylesheet_directory_uri() . '/style.css',
        array( $parent_style )
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
?>