September 11, 2012

How To Apply CSS In CodeIgniter


1. Open "config.php" within directory CodeIgniter\system\application\config.
2. Add following code. At last line before '?>'
$config['css'] = 'mystyles.css';
3. Create a file named mystyles.css within root.
4. Enter example code like this:
h1{
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:30px;
}
p{
font-family:Georgia, "Times New Roman", Times, serif;
font-size:12px;
}
#menu{
height:50px;
}
.....etc
5. Open model file named "your_filename.php" within CodeIgniter\system\application\models.
6. Add following two lines.
<?php
class Blog extends CI_Controller {
function index()
{
$data['title']="This is my blog";
$data['heading']="Testing of blog page";
$data['base']= $this->config->item('base_url');
$data['css']= $this->config->item('css');

$this->load->view("blog_view",$data);
}
}
?>
7. Then, update "your_viewfile.php" within CodeIgniter\system\application\views.
8. Update <head></head>, like this:
<html>
<head>
<link rel="stylesheet" type="text/css" href="<?php echo "$base/$css"?>">
<title><?php echo $title;?></title>
</head>
<body>
<h1><?php echo $heading;?></h1>
</body>
</html>
Enjoy It.

12 comments:

  1. adding css to codeigniter is hell

    ReplyDelete
  2. If CSS referes to images, how to i use them? CI suggests helper class. However how to use helper with CSS?

    ReplyDelete
  3. hi!...i'm new to codeigniter...i have tried many options to include my css file to codeigniter project i have started...please have how can i include a css file, images folder and js folder???


    subrata

    ReplyDelete
  4. hi...
    i also a same problem css is not working after embedding....plz help

    ReplyDelete
  5. thanks for shared wonderful information of giving best information.its more useful and more helpful. great doing keep sharing
    School Signs UK

    ReplyDelete
  6. I'm new to codeigniter. How can i add css and js to a page in codeigniter. Please help. THanks

    ReplyDelete
    Replies
    1. @King: You can include css and js in application/view/pages/header.php file and put css and js files in assets folder

      Thanks.

      Delete
  7. Really In-Depth Information & Detailed Knowledge oriented Blog that I've Found. Amazing Blogs which is Well-Written.
    top software development companies
    custom software development company

    ReplyDelete

Integrating Google reCAPTCHA v3 in HTML Form with PHP

  What is Google reCAPTCHA v3? Google reCAPTCHA is a free service that helps protect websites from spam and abuse. reCAPTCHA v3 is the lates...