Why is child theme’s style.css loaded twice?

On the page kalvarka.sk, that I am the admin of, the child theme’s style.css is loaded twice:

<link rel="stylesheet" id="child-style-css" href="https://kalvarka.sk/wp-content/themes/idyllic-child/style.css?ver=1.0.0" type="text/css" media="all">

<link rel="stylesheet" id="idyllic-style-css" href="https://kalvarka.sk/wp-content/themes/idyllic-child/style.css?ver=61eb87ceb07e28a0e01ea94ef625322c" type="text/css" media="all">

According to wordpress.org’s support the problem is that in the file “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 ),
        wp_get_theme()->get('Version')
    );
}
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );

In the support, Howdy_McGee suggests:

WordPress uses the first parameter ($handle) of wp_enqueue_style to determine if it needs to load a specific asset. This is why the documentation suggests that the handle be unique. For example, if you renamed your parent handle to twentytwenty-style then it shouldn’t load twice. Once it see’s there is a duplicate handle, it will skip any future iterations.

by Howdy_McGee

So let us try that and change 

    $parent_style = 'parent-style';

To the name of the parent theme idyllic:

    $parent_style = 'idyllic-style';

And voila, it works, style.css is loaded only once this time.

Featured image by Image by pch.vector on Freepik

Tags

Related Posts