Tuesday, August 21, 2007

CodeIgniter Tutorial #2

my friends ask me, how he could add a css file to the view.
such an easy question for you guys but not for me and my friend
the codeigniter file structure didnt mention where to put your css, image, or javascript file.
hei, dont get me wrong... i just a newbie

then i remember, i've codeigniter application (BambooInvoice by Derek Allard)
this is how BambooInvoice file structure like

+ codeigniter_system
+ img
+ css
+ js

let demonstrate
Here my css file that i store in css/style.css

css/style.css

* {
margin:0;
padding:0;
}

#message {
margin:10px;
padding:10px;
border:1px solid #e1e1e1;
}

.info {
margin-top:15px;
color:#fff;
background: #237295;
padding:4px;
}


and here my controller

codeigniter/system/application/controller/blog.php (controller)

<?php

class Blog extends Controller {

function index() {
$data['title'] = "Yet another blog tutorial";
$data['blogs'] = array();
$this->load->helper('url');
$this->load->view('blog/index', $data);
}
}
?>


and here is my view

codeigniter/system/application/view/blog/index.php (view)


<html>
<head>
<title><?= $title ?></title>
<link rel='stylesheet' type='text/css' media='all'
href='<?php echo base_url()."css/style.css"?>' />
</head>
<body>
<div id="message">
<h1>Welcome to CSS layout!</h1>
This style from style.css
<div class="info">Page rendered in {elapsed_time}
seconds</div>
</div>
</body>
</html>


Note that before you can use base_url function, you have to add url helper by add $this->load->helper('url') to your controller

5 comments:

Anonymous said...

"darrekalar" == "Derek Allard"

Anonymous said...

Sorry, typo...
i'll double check my post next time.
Thanks

Anonymous said...

This works as well.

"link rel='stylesheet' type='text/css' media='all' href='../../../css/style.css' "

Unknown said...

ref='../../../css/style.css

That is a very, very dirty method. I really suggest using base_url();

sozo33 said...

Finally!!! An easy and working way to add css! Thank you so much!