Published on

Making Admin Panel using Codeigniter 3.0+

This tutorial will teach on how to create the Back-end and Front-end by creating two Controllers. The frontend controller is the Controller that will control the actions and logic seen in the Public whereas, the backend will be mainly used by the site author, administrator etc . The idea of this is to reduce too much load to files and load the page quickly.

Hitting www.mydomain.com/admin will let you navigate the backend by using a password protected mechanism. Similarly, www.mydomain.com will show you the frontend. The main face of our site.

In order to start this first you need to configure you .htaccess file. I am assuming that you have already installed your CI files to your server or local server. Create a .htaccess file in the root folder and copy the following.

Also, goto your config.php file inside application > config and remove index.php from

$config['index_page'] = 'index.php';

After doing this we should probably make a custom config file in order to pass metadata information. Make a cms_config.php file inside config folder. In the file cms_config.php

$config['site_name'] = "My Admin Panel";
$config['site_title'] = "My System";

Now we set up the MY_Controller.php inside the core folder. Make a file and name it MY_Controller.php inside core folder and paste the following code.

In the above code we are setting the global data value site_title so that we can call the site title anywhere we want and so on. You can add the values here whichever you want to access globally. I am also initializing the language helper here and so on. If i want errors messages i would pass them through associative arrays.

After setting up MY_Controller.php now lets set-up the Admin Controller inside the libraries folder. Create a file Admin_Controller.php inside libraries folder and paste the following inside it.

In this file we initialize the form helper. We have also initialized the form_validation library and ion_auth. I am assuming that you have knowledge on ion_auth because in this case we are using ion_auth library for the authentication procedure. Ion Auth is simple to you and has a beginner approach. You can get it from here.

Moving on. Earlier we had set-up the cms_config file but that file needs to be loaded so now open autoload.php from config folder and add ‘cms_helper’ in $autoload[‘helper’] array.

Also, open up the config.php file and add the following lines.

/**AUTOLOADING LIBRARIES**/
function __autoload($classname) {
 if(strpos($classname, 'CI_') !== 0) {
 $file = APPPATH . 'libraries/' . $classname . '.php';
 if(file_exists($file) && is_file($file)) {
 @include_once($file);
 }
 }
 }

The above line function loads the library classes that we have defined earlier. In our case for now it auto loads the Admin Controller class. In the same config.php file update the encryption_key to random digits and numbers.

Ok now we have completed the basic admin setup. Lets move on to making a usable system.

In order to proceed forward first you must install ion_auth into the system. Ion_auth adds several files inside application directory.


If you are reading this that means you have installed the ion_auth succesfully. Now, firstly we will set the route to act that when we hit the url as www.domain.com/admin it should direct to admin. We set up the route as follows.

$route['default_controller'] = 'welcome';
$route['404_override'] = '';
$route['admin'] = 'auth/index';

So, when we hit admin the system will identify and change the auth/index to admin.

Lets look at the Auth.php file from Controllers folder

At first the index function is loaded so if the user is not logged on it goes to login function on line 48. On line 94 i have replaced the render page function with the subview method. I have added variable subview and assigned the value auth/login to it as this happens to be my view file for this login. So i load the login layout on line 95 passing these values onto it.

Now, lets make view file. Goto views and create layouts folder, auth folder. Inside auth there is already files. You just need to edit them according to your styles. I will not be teaching on styling your panel because it would be a long post. After you have created files create a file inside layout folder ‘_layout_login.php’. 

Before adding any lines of code to it. Add header.php and footer.php inside a folder common. See below code.

Note: Using Bootstrap for my WireFrame design.

All done. Now when you do localhost/your-app/admin the login page should show up. Enter your credentials and login.

Similarly, make a Dashboard.php controller inside controller and assign the views to it. Using models will be posted in second version.

Note: This is only one way of doing this. Know that you are not bound to follow this approach as this approach is one in a million. 🙂