WORDPRESS - include CSS in functions.php doesnt work

Question

I need to include some external css files, i use this snippet in functions.php but neither of them works.. Why..?

    add_action( 'wp_enqueue_scripts', 'add_css' );

function add_css() {
    wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
    wp_enqueue_style( 'style', get_template_directory_uri().'/assets/css/bootstrap.css' );
}

I'm using Twenty-Twenty-One child theme This is my style.css

/*Theme Name: Twenty Twenty-One Child
    Theme URI: https://wordpress.org/themes/twentytwentyone/
    Template: twentytwentyone
    Author: the WordPress team
    Author URI: https://wordpress.org/
    */
h2{
    color:red!important;
} */

h2 is to see if it works.

Howard E · Accepted Answer · 2021-01-04 11:15:09Z

2

If you're using a child theme, you want to use get_stylesheet_directory_uri() instead of get_template_directory_uri - Unless the stylesheets are part of the parent theme.

function add_css() {
    wp_enqueue_style( 'parent-style', get_stylesheet_directory_uri().'/style.css' );
    wp_enqueue_style( 'style', get_stylesheet_directory_uri().'/assets/css/bootstrap.css' );
}

answered Jan 4, 2021 at 11:15

Howard E

5,6893 gold badges17 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

8 Comments

Fedoro Over a year ago

It dosnt work, i appreciate this, maybe I will use it in the future

Howard E Over a year ago

Where are you putting the files, with respect to your directory structure? Also, is style.css the Child Style or the parent style? Please clarify.

Fedoro Over a year ago

In wp-content/themes/ i have: twentytwentyone (original theme) and my child theme - twentytwentyone-child. i create style css following the instruction of wordpress.org that you can see up. Then i focus on functions.php but it doesnt work. " is style.css the Child Style or the parent style?" ... Sincerely i dont know.

Howard E Over a year ago

Is the bootstrap.css getting added?

Fedoro Over a year ago

No.. I really don't uderstand. I try also with a plug-in to automatize it but nothing...

|

RustyBadRobot · Accepted Answer · 2021-01-04 13:24:05Z

0

Depending on how your parent theme loads it's styles your function will vary. You can check the Enqueue stylesheet section in the Theme handbook for more clarification. Below is their example if the parent theme loads its style using a function starting with get_stylesheet

Make sure you are using the correct parent handle, 'parent-style' is used for TwentyFifteen theme for example.

add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
    $parenthandle = 'parent-style'; // This is 'twentyfifteen-style' for the Twenty Fifteen theme.
    $theme = wp_get_theme();
    wp_enqueue_style( $parenthandle, get_template_directory_uri() . '/style.css', 
        array(),  // if the parent theme code has a dependency, copy it to here
        $theme->parent()->get('Version')
    );
    wp_enqueue_style( 'child-style', get_stylesheet_uri(),
        array( $parenthandle ),
        $theme->get('Version') // this only works if you have Version in the style header
    );
}

You should also look at the wp_enqueue_style code reference as the handle for your bootstrap style should probably not be style as it needs to be unique e.g. bootstrap-style

answered Jan 4, 2021 at 13:24

RustyBadRobot

5764 silver badges16 bronze badges

1 Comment

Fedoro Over a year ago

I try it with $parenthandle = ' twenty-twenty-one-style ' but doesnt work. I add in the question my style.css maybe there is something wrong in..

Collectives™ on Stack Overflow

WORDPRESS - include CSS in functions.php doesnt work

2 Answers 2

8 Comments

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

8 Comments

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related