Why are bootstrap classes not working after I import enqueue it in my functions.php file using WordPress?

In my child theme functions PHP file, I have the following code:

<?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’ );
}


//  IMPORT BOOTSTRAP CDN 

function my_scripts_enqueue() {
wp_register_script( 'bootstrap-js', '://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js', array('jquery'), NULL, true );
wp_register_style( 'bootstrap-css', '://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css', false, NULL, 'all' );

wp_enqueue_script( 'bootstrap-js' );
wp_enqueue_style( 'bootstrap-css' );
}

// END BOOTSTRAP IMPORT

?>

However, when I try to use a simple bootstarp class like col-sm-4 I do not get the column layout on my page. It seems, bootstrap is not being loaded. I’m using the optimizer theme, but I don’t think that matters.

Read More

In any event. I’ve scoured there many WP support forums and to no avail have I had success. Custom css is working in my child theme style file but this is not working in the functions file. Where am I going wrong?

Related posts

Leave a Reply

1 comment

  1. You are missing 2 things….

    1. You function my_scripts_enqueue doesn’t seem to be called anywhere, just call it inside your enqueue_child_theme_styles function or add another hook function call for it.
    2. In '://maxcdn.bootstrapcdn.com/boo... we don’t start with : just with // 😉

    Your code should look something like this…

    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' );
        my_scripts_enqueue();
    }
    
    //  IMPORT BOOTSTRAP CDN
    function my_scripts_enqueue() {
        wp_register_script( 'bootstrap-js', '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js', array('jquery'), NULL, true );
        wp_register_style( 'bootstrap-css', '//maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css', false, NULL, 'all' );
    
        wp_enqueue_script( 'bootstrap-js' );
        wp_enqueue_style( 'bootstrap-css' );
    }