Adding Bootstrap to WordPress Using functions.php

2 Views

I have tried using the following code to embed Bootstrap to WordPress but it doesn’t work. Need help………. 

<?php  

 function resources() {

 wp_enqueue_style('style',get_stylesheet_uri());          
 wp_enqueue_style('bootstrap.min',get_template_directory_uri().'/css/bootstrap.min.css');
 wp_enqueue_style('bootstrap',get_template_directory_uri().'/css/bootstrap.css');
 wp_enqueue_style('bootstrap-theme.min',get_template_directory_uri().'/css/bootstrap-theme.min.css');
}     

add_action('wp_enqueue_scripts', 'resources');
Post Views: 2

Related posts

4 comments

  1. This may be helpful to you

    WordPress is to use wp_enqueue_style and wp_enqueue_script from within functions.php. In particular, we need to create a new function that adds (or enqueues) the css style and the js script and then allow WordPress to call it at the right moment by adding a wp_enqueue_scripts action.

    /* Add bootstrap support to the WordPress theme*/

function theme_add_bootstrap() {
wp_enqueue_style( 'bootstrap-css', get_template_directory_uri() . '/css/bootstrap.min.css' );
wp_enqueue_style( 'style-css', get_template_directory_uri() . '/style.css' );
wp_enqueue_script( 'bootstrap-js', get_template_directory_uri() . '/js/bootstrap.min.js', array(), '3.0.0', true );
}

add_action( 'wp_enqueue_scripts', 'theme_add_bootstrap' );

    For Reference: click here

  2. In order towp_enqueue_scripts in function.php work properly, <?php wp_head(); ?> needs to be placed before the closing </head> and <?php wp_footer(); ?> before closing </body> tag in your template file.

    Because you didn’t post your template file, so I think this can be a reason causes your problem.

    Hope this help

  3. Just use the bootstrap CDN – https://www.bootstrapcdn.com/

    In your child theme find the function theme_enqueue_styles() and add the two lines of extra code shown below.

    function theme_enqueue_styles() {
    // Add the following two lines //
    wp_enqueue_style( 'bootstrap-cdn-css', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css' );
    wp_enqueue_script( 'bootstrap-cdn-js', 'https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js' );
    // ------               -------//
    wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
    wp_enqueue_style( 'child-style', get_stylesheet_directory_uri() . '/style.css', array('parent-style') );
}

  4. Make sure your file location of downloaded bootstrap files. and put this code into functions.php

    1.stylesheet CSS file

    2.script js file

    <?php

function load_stylesheets()

{

// enqueue parent styles

wp_enqueue_style('bootstrap', get_stylesheet_directory_uri().' /css/bootstrap.min.css');

wp_enqueue_script('bootstrap', get_stylesheet_directory_uri().' /js/bootstrap.min.js');

}

add_action('wp_enqueue_scripts','load_stylesheets');

?>

Comments are closed.