AFS
AFS

Reputation: 1443

Integrate Bootstrap on CodeIgniter

I'm trying to use bootstrap on a codeigniter web but it looks like the bootstrap files are not found

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <title>Bootstrap 101 Template</title>

    <!-- Bootstrap -->
    <link href="<?php echo base_url('application/bootstrap/css/bootstrap.min.css');?>" rel="stylesheet">
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <script src="<?php echo base_url('application/bootstrap/js/bootstrap.min.js');?>"></script>

I've checked the paths generated by base_url() and it are correct.

Upvotes: 14

Views: 62794

Answers (7)

ANDRIANIAINA
ANDRIANIAINA

Reputation: 51

If you use the Ci4 , add the folder 'bootstrap' in the default folder 'public'.

Thanks

Upvotes: 0

lightup
lightup

Reputation: 674

Don't forget to include the CodeIgniter URL helper in your controller

$this->load->helper('url');

Upvotes: 3

Senthoo
Senthoo

Reputation: 7

  1. Create a folder(assets) in Codeigniter root directly (Same level to application folder)

  2. Paste your bootstrap files into that folder

  3. add link code in your view file

    <link type="text/css" href="<?= base_url(); ?>assets/bootstrap.min.css" rel="stylesheet">
    
  4. add this line in your controller file application/cotrollers/test.php

    <?php
    class Test extends CI_Controller {
    
    public function index()
      {
       $this->load->helper('url'); // Load url links
       $this->load->view('index'); //Load view page
      }
    
    }
    ?>
    
  5. Now you can use bootstrap classes in your view

Upvotes: 1

sharif pilot
sharif pilot

Reputation: 1

  1. Download the Bootstrap file from the internet if you want to work offline
  2. Unzip and rename and copy to root folder. If you put it in application folder, .htaccess will not allow it to be accessed.
  3. Add the link like the following line of code:

    <link href="<?php echo base_url('assets/css/bootstrap.min.css');?> rel="stylesheet">
    

Upvotes: 0

ACV
ACV

Reputation: 10562

Here's the best guide I've found so far: How to include bootstrap in CI

In short:

  1. Download bootstrap

  2. Put it in an assets folder on same level as application folder

  3. Also put jquery

  4. Include css in header and jquery in footer of your templates:

<html>
  <head>
      <title>CodeIgniter Tutorial</title>
      <link rel="stylesheet" href="<?php echo base_url("assets/css/bootstrap.css"); ?>" />
  </head>
  <body>
      <h1>H_E_A_D_E_R</h1>

and :

<hr/>
<em>&copy; 2016</em>
<script type="text/javascript" src="<?php echo base_url("assets/js/jquery-3.1.1.js"); ?>"></script>
<script type="text/javascript" src="<?php echo base_url("assets/js/bootstrap.js"); ?>"></script>
</body>
</html>

Upvotes: 4

William Kheng
William Kheng

Reputation: 671

Just sharing over here so that you no need to combine folders manually. I used this package offered from github regularly to commit new projects. Of course you will have to modify the application/config/config.php to get things work !

https://github.com/sjlu/CodeIgniter-Bootstrap

Cheers !

Upvotes: 1

Girish
Girish

Reputation: 12127

move bootstrap folder on root location, because CI is understanding application folder as controller although application folder is restricted from client request by /application/.htaccess file

|-
   |-application
   |-bootstrap

//and use path as
<?php echo base_url('bootstrap/css/bootstrap.min.css');?>

Upvotes: 18

Related Questions