Support » Developing with WordPress » Enqueue child theme css

  • Resolved creekdweller

    (@creekdweller)


    I’ve set up a child theme for Twenty Sixteen and it works fine except I can’t get it to recognize css that I put in the child theme’s styles.css file. To make any changes in css I have to use the customizer’s Additional CSS function. I’ve researched many articles and watched tutorial videos and pretty much everything I find contradicts what I find elsewhere. Some places say that in Twenty Sixteen it isn’t necessary to enqueue the child’s styles.css and others give an endless variety of ways to do it.

    Here are the relevant lines from my functions file as currently in place:

    // BEGIN ENQUEUE PARENT ACTION
    // AUTO GENERATED - Do not modify or remove comment markers above or below:
    
    if ( !function_exists( 'chld_thm_cfg_parent_css' ) ):
        function chld_thm_cfg_parent_css() {
            wp_enqueue_style( 'chld_thm_cfg_parent', trailingslashit( get_template_directory_uri() ) . 'style.css', array( 'genericons' ) );
        }
    endif;
    add_action( 'wp_enqueue_scripts', 'chld_thm_cfg_parent_css', 10 );
    
    // END ENQUEUE PARENT ACTION

    I can’t remember where I obtained that code. I’ve tried replacing it with the following, which is recommended in the Codex:

    <?php
    add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
    function my_theme_enqueue_styles() {
     
        $parent_style = 'parent-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.
     
        wp_enqueue_style( $parent_style, get_template_directory_uri() . '/style.css' );
        wp_enqueue_style( 'child-style',
            get_stylesheet_directory_uri() . '/style.css',
            array( $parent_style ),
            wp_get_theme()->get('Version')
        );
    }
    ?>

    That doesn’t work either. Where am I going wrong?

Viewing 5 replies - 1 through 5 (of 5 total)
  • Hi @creekdweller,

    You should not have to explicitly enqueue the CSS in the child’s theme style.css. Did you review the docs here: https://developer.wordpress.org/themes/advanced-topics/child-themes/#2-create-a-stylesheet-style-css ?

    Yes, but that page says I DO have to enqueue the parent and child theme stylesheets.

    If your child theme style.css contains actual CSS code (as it normally does), you will need to enqueue it as well.

    This is the page from which I copied the second block of code in my original post.

    It now appears that code added to the child theme’s styles.css does get recognized, but the changes don’t show up immediately. Merely reloading pages won’t do the trick, but coming back hours later I see the changes take effect. Any ideas how to eliminate this delay?

    Moderator bcworkz

    (@bcworkz)

    The file is cached somewhere, you have to flush which ever cache it’s in. It could be just your browser’s cache. Flushing the browser cache is the first thing to do anytime you don’t get expected results from a change.

    There are caching plugins for WP which could be involved, there will be a way to flush through their admin settings screen. Your hosting plan could have caching, in which case there ought to be a way to flush through your hosting panel.

    In some cases, altering the version argument when the file is enqueued will cause caching engines to refresh the file.

    Thanks, I appreciate the info.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Enqueue child theme css’ is closed to new replies.