23

I created a child theme according the WP docs and added the requisite function

<?php
add_action( 'wp_enqueue_scripts', 'enqueue_child_theme_styles', PHP_INT_MAX);
function enqueue_child_theme_styles() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(), array('parent-style')  );
}

Somehow I end up with 2 references to my child theme stylesheet:

<link rel='stylesheet' id='twentythirteen-style-css'  href='http://DOMAIN.COM/wp-content/themes/twentythirteen-child/style.css?ver=2013-07-18' type='text/css' media='all' />

<link rel='stylesheet' id='child-style-css'  href='http://DOMAIN.COM/wp-content/themes/twentythirteen-child/style.css?ver=4.0' type='text/css' media='all' />

Why is that?

1
  • Can you post the header information of the style.css file in the child theme?
    – cybmeta
    Commented Nov 6, 2014 at 16:24

1 Answer 1

20

This post is linked from this post which I have now updated with the changes in this post

Thank you for bringing up this issue. I have quickly tested the scenario and the child style is actually loaded twice.

When I updated the codex a while ago I made sure that the child style would be loaded after the parent style, never actually taking into account that this is actually done by default and the code given would actually load the child stylesheet twice.

This can be easily rectified by simply removing the $priority from the function and removing the enqueue part for the child theme. I have retested everything, and it works. It would be nice if a couple of people can collaborate this.

In the mean time, I will update the codex and link to this post.

Here is the working code

add_action( 'wp_enqueue_scripts', 'enqueue_parent_theme_style');
function enqueue_parent_theme_style() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}

EDIT

For anyone that this post is not working for, please see this post. You will need to go and look on how the parent theme is adding the styles. The code in this question strictly believes that the styles in the parent are loaded in the correct way that they should be. If not, look at the alternatives in the linked answer and try those out

5
  • 1
    Will test. It seems possible that WP doesn't care of the stylesheet gets loaded twice or that there is some rationale that we are missing.
    – mmcglynn
    Commented Nov 6, 2014 at 16:50
  • As it's on topic, I encountered a couple issues using this method, detailed here. Commented Nov 9, 2014 at 15:22
  • The stylesheet wont get loaded twice if you use the same 'id'. But this creates another issue - I want to enequeue the child stylesheet so it loads after the other css so I can override it... But this only duplicates the style (or ignores if using the same 'id') Commented Oct 27, 2015 at 6:39
  • 1
    The main issue with this method, that I can tell, is that the child style doesn't pull in the version number of the child theme. It seems to pull in the version number of the parent theme, which isn't always ideal.
    – Garconis
    Commented Sep 28, 2018 at 17:08
  • @pieter-goosen I followed the example at Child Themes which uses the version number of the child theme: wp_get_theme()->get('Version'). However I end up having duplicated CSS for the WP version and the child theme version: <link rel="stylesheet" id="bushwick-style-css" href="/wp-content/themes/bushwick-child/style.css?ver=4.9.8"...> and <link rel="stylesheet" id="bushwick-child-css" href="/wp-content/themes/bushwick-child/style.css?ver=1.3.6"...>. What would be the solution in these cases?
    – IvanRF
    Commented Oct 4, 2018 at 23:30

Not the answer you're looking for? Browse other questions tagged or ask your own question.