2

I've tried everything I can think of to fix this issue, but I am totally stuck.

I have created a child theme, and installed it on Wordpress. I know that my style.css is working, because during some testing to see what the issue was, I was able to change the name of the child theme and have that show up on my site. I believe that the issue is with the @import, but can't figure out how to fix.

Here's what my css looks like:

    /*
     Theme Name:     Accio Child 
     Theme URI:      http://jowerstraining.com
     Description:    Accio Child Theme
     Template:       accio
    */

    @import url('../accio/style.css');
    @import url('../accio/css/animation.css');
    @import url('../accio/css/custom1.css');
    @import url('../accio/css/custom2.css');

The theme I'm using has several stylesheets, and that's where I think my problem is coming from. Any ideas on how to resolve this?

Building the site with MAMP so can't post link, sorry.

1
  • I think it has something to do with the template dir/stylesheet dir functions in your theme (pointing to the parent location). On my phone so not able to check but have a google. Commented May 18, 2014 at 21:50

5 Answers 5

2

We had this same problem when a client wanted to use this theme. We decided to add this to our functions.php file and kickstart the child theme CSS that way:

/**
 * Add's custom styles
 *
 */

function theme_styles() {
    wp_enqueue_style( 'child-theme-styles', get_stylesheet_uri() );
}

add_action('wp_enqueue_scripts', 'theme_styles');

Note, we did have trouble at first because we were using get_stylesheet_directory_uri() which was returing the path to the accio theme folder, and not our child theme folder. We found that get_stylesheet_uri() gave us the correct path to our style.css file.

1

what jhoffmcd said worked for me as well, however I had to add ", 99" so my stylesheet loaded last. Thanks jhoffmcd.

function theme_styles() {
    wp_enqueue_style( 'child-theme-styles', get_stylesheet_uri() );
}

add_action('wp_enqueue_scripts', 'theme_styles', 99);
0

Sometimes, the main style.css file located at the root of template directory is not enqueued for loading (but just used for the comments to give information about the theme).

You should check wether this file is actually loaded or check if the parent theme is using an another css file such as css/app.css for instance.

If it still not working, you have to check how the css file is enqueued by the parent theme. It should be something like this :

wp_enqueue_style( 'style-name', get_stylesheet_directory_uri() . 'css/app.css' );

Note that get_stylesheet_directory_uri() will return the child theme URI if it exists, but get_template_directory_uri() will always return the current theme directory URI and will never be overridden.

5
  • The parent theme appears to be using another css file in a css folder. I looked in the functions.php for the piece of code that you mentioned, and couldn't find it anywhere. I'm a bit lost on how to resolve this. I've worked on about a dozen custom Wordpress sites and have never had an issue like this where the child theme style.css doesn't work. Could you point me in the right direction? Thanks.
    – leahne
    Commented May 20, 2014 at 4:46
  • the wp_enqueue_style() function may be located in another php file. Look at the include or require directives in functions.php. Could you provide me the parent theme name or url ?
    – Strategio
    Commented May 20, 2014 at 12:12
  • I'm building the site locally, so don't have a url. But the parent theme is called accio. Link to theme
    – leahne
    Commented May 23, 2014 at 3:32
  • As it's a commercial theme, I can't see the source, but I checked that the main style.css file is actually enqueued. So you really have to check how this stylesheet is enqueued.
    – Strategio
    Commented May 23, 2014 at 11:51
  • You have to scan the themes files searching for wp_enqueue_style( with your favorite text editor. For instance, in sublime text, you can use Ctrl+Maj+F.
    – Strategio
    Commented May 25, 2014 at 18:48
0

You can try to use wp_enqueue_style function http://codex.wordpress.org/Function_Reference/wp_enqueue_style

0

just add the code

@import url("../../yourtheme-child/css/custom.css"); 

to your custom.css inside you main theme.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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