Cannot print out theme child-style CSS version on browser

  • Resolved jmestrada

    (@jmestrada)


    10 months, 3 weeks ago

    Hello, word! I need some help / orientation to properly versioning CSS file for theme child styles. I have searched a lot about it and found pretty much same solution but I cannot make it work. This is the code I’m using in theme child’s functions.php:

    function my_theme_enqueue_styles() {
        $parent_style = 'parent-style';
        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 ),
            '[css_version_number]'
        );
    }
    add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

    And these are the CSS lines printed out by broswer – “4.24.2” is the version of “parent” theme CSS file:

    <link rel='stylesheet' id='child-style-css' href='https://[domain]/wp-content/themes/Divi-child/style.css?ver=4.24.2' type='text/css' media='all' />
    <link rel='stylesheet' id='divi-style-css' href='https://[domain]/wp-content/themes/Divi-child/style.css?ver=4.24.2' type='text/css' media='all' />

    In my opinion, WP is not doing what theme child’s functions.php is supposed to do – not even printing out the CSS lines in correct / proper order.

    I’m using Divi theme as “parent” and Total Cache plugin for caching. I already tried by changing version number in header for “child” CSS file without success – wp_get_theme()->get(‘Version’) does get the version number properly from header of CSS file but ‘add_action( ‘wp_enqueue_scripts’, ‘my_theme_enqueue_styles’ );’ doesn’t seem to print out correct child CSS file.

    It is important to mention that both “wp_enqueue_style()” functions result in NULL despite “get_template_directory_uri()” and “get_stylesheet_directory_uri()” shows valid data.

    I would appreciate some bright light on this issue. Thank you so very much in advance.

Viewing 2 replies - 1 through 2 (of 2 total)
  • Moderator bcworkz

    (@bcworkz)

    10 months, 3 weeks ago

    Replace 'parent-style' (first line within function) with 'divi-style' to have your link tag appear after the Divi style link. As you’ve presented your code here, the version in your link tag ought to be literally %5Bcss_version_number%5B. If you’re always getting the parent theme version instead, there’s apparently some other code somewhere enqueuing the file using the same handle.

    Consider using this as the $ver arg for wp_enqueue_style(): wp_get_theme()->get('Version')
    Be sure your style.css file’s header has a Version: line in it. This way you only need to update the version in one place to affect all references to it.

    The correct way to enqueue a child theme stylesheet depends on how the parent theme enqueues its stylesheet. See https://developer.ww.wp.xz.cn/themes/advanced-topics/child-themes/#loading-style-css

    wp_enqueue_style() never returns any value. If it fails for any reason, it fails silently.

    Thread Starter jmestrada

    (@jmestrada)

    10 months, 3 weeks ago

    Outstanding! Replacing “parent-style” with “divi-style” worked like a charm… Thank you so very much (;

Viewing 2 replies - 1 through 2 (of 2 total)

The topic ‘Cannot print out theme child-style CSS version on browser’ is closed to new replies.