Hi, as a nice addition to our codeigniter tutorials series, I'm back with another article which discusses about CodeIgniter and Bootstrap integration. This will teach you the technique of combining the power of two robust frameworks, PHP CodeIgniter and Twitter Bootstrap. You should properly integrate twitter bootstrap 3 with code igniter framework for it to work. I'm going to assume you are individually acquainted with CodeIgniter and Bootstrap frameworks, so in this tutorial will just show you how to integrate Bootstrap with CodeIgniter by which you can enhance the appearance of your CodeIgniter application.
In case you don't have, download the latest versions of the frameworks from the links given below.
Step-by-Step Instruction for CodeIgniter Bootstrap Integration
STEP-1: First download and extract the PHP CodeIgniter framework zip file to your working folder. Then create a folder named "assets" to keep all your bootstrap files. Just make sure your CodeIgniter folder structure is similar to the below image.
Recommended Read: How to Create Login Form in CodeIgniter, MySQL and Twitter Bootstrap
Recommended Read: How to Create User Registration Form in CodeIgniter, MySQL & Bootstrap
STEP-2: Next extract and move the css, js and fonts folder of Twitter bootstrap 3 to the "assets" folder we have created in STEP-1.
STEP-3: We need jQuery library for the Bootstrap's js plugins to work. So move the jQuery file to the "assests/js" folder.
Now the setup is over. To start using bootstrap in CodeIgniter, we have to include the bootstrap ".css" and ".js" files to CodeIgniter views.
To include the bootstrap css file, add this line above the
</head> tag in the CodeIgniter view file.
<link rel="stylesheet" href="<?php echo base_url("assets/css/bootstrap.css"); ?>" />
Next we have to include js files for which you should add the below code just before the
Note: Make sure you always add the jQuery library before "bootstrap.js".
Having setup the environment to use Twitter Bootstrap with CodeIgniter, our app is ready for development.
I hope you have enjoyed this CodeIgniter Bootstrap Tutorial.