Search code examples
phpcodeignitercodeigniter-3

Why does the browser show the 404 view instead of loading a stylesheet in this Codeigniter 3 app?

I am working on a CMS with CodeIgniter 3.1.8 and Bootstrap 4. I have decided to add themes to it. The application is not HMVC, only MVC.

The themes directory is outside application as can be see in the image below:

enter image description here

Inside themes I have the theme directory (of course) which contains the "master view", layout.php:

enter image description here

How I use the theme views

In application/core I have added a MY_Loader.php file with the following contents:

<?php defined('BASEPATH') OR exit('No direct script access allowed');

  class MY_Loader extends CI_Loader {

    function theme_view($folder, $view, $vars = array(), $return = FALSE) {
      $this->_ci_view_paths = array_merge($this->_ci_view_paths, array(FCPATH . $folder . '/' => TRUE));
      return $this->_ci_load(array(
              '_ci_view' => $view,
              '_ci_vars' => $this->_ci_prepare_view_vars($vars),
              '_ci_return' => $return
          ));
    }

}

In my Posts controller's index() method, I load the view passing it the data:

public function index() {
   //more code here
   $data['posts'] = $this->Posts_model->get_posts($config['limit'], $config['offset']);
    $this->load->theme_view('/themes/caminar/', 'layout', $data);
}

The problem

In layout.php I have included the theme's stylesheet:

<link rel="stylesheet" href="<?php echo site_url('themes/caminar/assets/css/main.css')?>">

The file main.css is indeed at http://example.com/themes/caminar/assets/css/main.css yet, the browser, insted of loading the CSS file, loads the 404 view.

What am I doing wrong?

Solution

  • You are using site_url instead of base_url while loading your assets.

    Site url is for links on your application, normally controller functions.

    base_url is used for assets.

    So change your paths to:

    <link rel="stylesheet" href="<?php echo base_url('themes/caminar/assets/css/main.css')?>">

    If that doesn't solve the problem then you might have something in your server preventing that. In that case show us your .htaccess if you're using apache Or your config for said virtual host if you're using nginx.

    If its apache you can try and add this to your .htaccess.

    RewriteCond $1 !^(index\.php|assets|themes|images|js|css|uploads|favicon.png)