2

I am registering the stylesheet and scripts but It is not working please help me. What I am doing wrong

function theme_styles_and_scripts() {

   wp_enqueue_style('bootstrap', get_template_directory_uri() . '/css/bootstrap.min.css', array(), '3.3.6', 'all' );

}

add_action( 'wp_enqueue_scripts', 'theme_styles_and_scripts' );
4
  • Hi, can you please specify what do you mean by 'Not working'? Aren't they outputted? Don't they take effect or ...? – Jack Johansson Feb 16 '17 at 9:45
  • yes they are not outputted – Owaiz Yusufi Feb 16 '17 at 9:46
  • I have checked them by clicking ctrl + u – Owaiz Yusufi Feb 16 '17 at 9:47
  • have you call wp_head() function in header.php file? – Kanon Chowdhury Feb 16 '17 at 10:02
0

There can be multiple reasons why it may not be working.

Possibility-1: You are adding the CSS file in a child theme. In that case, use the following CODE instead:

    function theme_styles_and_scripts() {
        wp_enqueue_style( 'bootstrap', get_stylesheet_directory_uri() . '/css/bootstrap.min.css', array(), '3.3.6', 'all' );
    }
    add_action( 'wp_enqueue_scripts', 'theme_styles_and_scripts' );

get_stylesheet_directory_uri() returns the URL of your current theme (whether it is a child theme or not). On the other hand, get_template_directory_uri() returns the parent theme URL if you are using a child theme & the current theme URL only if the active theme is not a child theme of another theme.

Possibility-2: You are not calling wp_head() anywhere in your theme's template files (usually header.php). However, if you are modifying any standard theme, then this is not the likely case, as any standard theme will not make this mistake.

Other Possibilities:

However, if you view HTML source & see that you are finding bootstrap in it, then perhaps another call to wp_enqueue_style with the same name is overriding it (as suggested by this answer) or perhaps your CSS is being added, but some other CSS is overriding your CSS rules.

How to Debug:

An easy way to debug this issue is to create a simple CSS file with the following CSS CODE:

    body {
        background-color: red !important;
    }

Then save the CSS file in your theme's css folder with the name wpse256672-style.css.

Then use the following CODE in your theme's functions.php file:

    function wpse256672_css_enqueue() {
        wp_enqueue_style( 'wpse256672_css', get_stylesheet_directory_uri() . '/css/wpse256672-style.css', array(), '1.0.0', 'all' );
    }
    add_action( 'wp_enqueue_scripts', 'wpse256672_css_enqueue' );

Now if you reload the page after saving the above, you should see red background in your page. That means you don't have Possibility-2 above, but perhaps Possibility-1 or something else. Change CSS file name, $handle from bootstrap to something else, change version number, check if the file exists etc.

Note: If you have cache plugin activated, clear cache first & then clear browser cache before doing the above tests.

0
0

There is a third possibility, because, as wp_enqueue_style documentation says, the $handleparam must be unique as it will not override an existing handle. You should try and change the $handle param to something more specific.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

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