Child theme installed & working, but custom css not working

3 Views

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.

Read More

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.

Post Views: 3

Related posts

Leave a Reply

5 comments

  1. 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.

  2. 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);

  3. 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.