• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
Newbie: Howto Use CSS and Images folder?

Using CI 1.6.1

I'm not getting how to use a css file and any style related images in an images folder.

I put the following lines in the /system/application/config/config.php
| CSS - stylesheets
| Set some stylesheet
$config['css'] = "default.css";

Then created a controller Home like:

class Home extends Controller {
   var    $base;
   var    $css;
   function Home()
       $this->base = $this->config->item('base_url');
       $this->css = $this->config->item('css');

    Function:    index()
    Purpose:    Provide the website entry home page
    Output:        Display home page view
     function index()
   $data['css'] = $this->css;
   $data['base'] = $this->base;

   // load the header view
   $data['header'] = $this->load->view('header', '', true);
   // load the menu view
   $data['menu'] = $this->load->view('menu', '', true);
   // Load the page content
   $data['content'] = $this->load->view('content','', true);
   // load the header view
   $data['footer'] = $this->load->view('footer', '', true);

   $this->load->view('layout', $data);


My /views/layout.php page looks like:

<?php echo $header; ?>

<?php echo $menu; ?>

<?php echo $content; ?>

<?php echo $footer;  ?>
The page loads but is not styled and no images appear. All i see is my page text and links. The CSS and images folder are currently located at the top level of my web-application folder: in the same folder as the system folder, user_guide folder, license file, index file.

It is probably a simple concept i am not understanding so could somebody with more CI experience and patience tell me what i am doing wrong?

[eluser]Michael Wales[/eluser]
You would use them the exact same way as always... assuming your $data['css'] variable is correct, do the following in the view:
<link rel="stylesheet" href="<?= $css; ?>" type="text/css" media="screen, projection" charset="utf-8" />

Personally, I make a helper that takes care of it all:
<?= css_asset('/assets/css/style.css', 'screen, projection'); ?>

I think you may just be missing the folder name:
$config['css'] = "/css/default.css";

Thanks for the replys to help. However, i seem to have more than that messed-up because in my original header.php file i tried using the variables i set for $css and $base in my header.php file like you suggested:
<base href="<?php echo $base; ?>"/>
<link href="<?php echo $css; ?>" rel="stylesheet" type="text/css" />
but it would always throw a undefined variable errors on both the $css and $base variables, but when i changed the code to the following segment $this->base and $this->css then it would find my stylesheet and images and work as expected:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
&lt;html xmlns="http://www.w3.org/1999/xhtml"&gt;

&lt;meta http-equiv="content-type" content="text/html; charset=utf-8" /&gt;
&lt;title&gt;Website Home Page&lt;/title&gt;
&lt;meta name="keywords" content="" /&gt;
&lt;meta name="description" content="" /&gt;
&lt;base href="&lt;?php echo $this-&gt;base; ?&gt;"/>
&lt;link href="&lt;?php echo $this-&gt;css; ?&gt;" rel="stylesheet" type="text/css" />


<div id="header">
    <h2>to the Scoring System</h2>

Doing it like $this->css in the header view file does not seem quite right to me, but it works. The $css and $base variable i set in the controller are not available to me in the view but everything else is. It's probably my mis-understanding of how things get passed between controllers and views, but i don't get it?

Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  

  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2019 MyBB Group.