Where do I put image files, css, js, etc. in Codeigniter?

Question

Where is it acceptable to put css folders and image file folders? I was thinking inside the view folder? However the controller always reroutes the path to the base url so I have to specify the path in the .html file to where it sits, which is redundant.

score 205 · Answer 1 · edited May 09 '17 at 03:54

205

I have a setup like this:

application
system
assets
- js
- imgs
- css

I then have a helper function that simply returns the full path to this depending on my setup, something similar to:

application/helpers/utility_helper.php:

function asset_url(){
   return base_url().'assets/';
}

I will usually keep common routines similar to this in the same file and autoload it with codeigniter's autoload configuration.

Note: autoload URL helper for base_url() access.

application/config/autoload.php:

$autoload['helper'] = array('url','utility');

You will then have access to asset_url() throughout your code.

edited May 09 '17 at 03:54

Raptor

48,613
43
209
344

answered Jul 08 '11 at 21:43

Eddie

12,021
3
23
30

1

hi eddie , I wonder where do you put your function code.. should I put it in file_helper.php ? – kebyang Mar 13 '13 at 07:57
3

Hi @KebyangBlabla I've updated my answer with a bit more information that should help you. – Eddie Mar 14 '13 at 13:32
10

To get access to 'baseurl()' you'll also need to include the 'url' helper, like this: ``$autoload['helper'] = array('url', 'utility');`` – Jeffrey Aug 08 '13 at 19:34
One better might be to have a your assets folder in the web root (mine is public_html) folder and then CI in a directory above the web root. – Nate Nolting Aug 07 '14 at 21:39
3

In case others are like me, to clarify, you access it like this = asset_url();?>css/css.css – JonYork Nov 27 '14 at 18:48
I dont think assets is a good name for the document root folder, usually its called, public_html, public, htdocs, www, etc, And it will make no sense to have an index.php file that will get all he requests inside a folder named assets. – Juan Jo Dec 02 '14 at 19:37
@JuanJo the *assets* folder is not in the public_html folder. It does not contain index.php either. It's only the little 'extras' like css files, javascript files and images. – itsols Feb 28 '15 at 13:15

Juan Jo · Answer 2 · 2015-01-16T16:11:34.473

50

No, inside the views folder is not good.

Look: You must have 3 basic folders on your project:

system // This is CI framework there are not much reasons to touch this files

application //this is where your logic goes, the files that makes the application,

public // this must be your documentroot

For security reasons its better to keep your framework and the application outside your documentroot,(public_html, htdocs, public, www... etc)

Inside your public folder, you should put your public info, what the browsers can see, its common to find the folders: images, js, css; so your structure will be:

|- system/
|- application/
|---- models/
|---- views/
|---- controllers/
|- public/
|---- images/
|---- js/
|---- css/
|---- index.php
|---- .htaccess

edited Jan 16 '15 at 16:11

answered Jul 09 '11 at 04:40

Juan Jo

853
1
8
17

1

what is the index.php in public folder? is that 404 file? thanks – DeLe Aug 18 '13 at 05:20
Sorry for the delay, but for the lo: T The index.php file will be the file that will catch the request and will call the rest of the framework. – Juan Jo Jun 18 '14 at 17:55
@Juan Jo ..I am using CodeIgniter-3.0.6.I cant find any folder named `public`.Is there any problem to add a folder with same name. – Akhil Vijay Jun 18 '16 at 15:18
@AkhilVijay you wont find it in your codeigniter folder, folder will be when you deploy it in any server – Anwar Hossain Jul 07 '16 at 21:52
the best way to work with codeigniter it's making the `.htaccess` for remove `/index.php?` and call the public folder with `base_url().'public/yourfolder';` – Robert Blasco Villarroya Sep 30 '16 at 07:09
Best suggestion among answers, codeigniter's index.php can specify `system` and `application` folder paths and those file and folders won't need write permission. For an advanced structure, `logs` , `vendor` (from composer) , `.git` , `cache` folders can put outside of Docroot as well. A asset helper is good to unify methods of include img/css/js files. – RaymondM Mar 22 '18 at 03:32

score 16 · Answer 3 · answered Mar 14 '14 at 17:56

This is how I handle the public assets. Here I use Phalcon PHP's Bootstrap method.

Folder Structure

|-.htaccess*
|-application/
|-public/
  |-.htaccess**
  |-index.php***
  |-css/
  |-js/
  |-img/
  |-font/
  |-upload/
|-system

Files to edit

.htaccess*

All requests to the project will be rewritten to the public/ directory making it the document root. This step ensures that the internal project folders remain hidden from public viewing and thus eliminates security threats of this kind. - Phalconphp Doc
```
<IfModule mod_rewrite.c>
    RewriteEngine on
    RewriteRule  ^$ public/    [L]
    RewriteRule  (.*) public/$1 [L]
</IfModule>
```

.htaccess**

Rules will check if the requested file exists and, if it does, it doesn’t have to be rewritten by the web server module. - Phalconphp Doc

<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteRule ^(.*)$ index.php/$1 [QSA,L]
</IfModule>

index.php***

Modify the application path and the system path as,

$system_path = '../system';
$application_folder = '../application';

Now you use the public folder as base_url()."public/[YOUR ASSET FOLDER]"

Hope this helps :)

Did you test the above code, I think there's an error on the last line, you redirect all requests to `/public` so why `base_url ()."public/[...`! It should be just `base_url ()."/[YOUR ASSET FOLDER]"`. — Kerkouch, Nov 17 '17 at 04:10

score 12 · Answer 4 · edited Jun 10 '13 at 05:50

12

I usually put all my files like that into an "assets" folder in the application root, and then I make sure to use an Asset_Helper to point to those files for me. This is what CodeIgniter suggests.

edited Jun 10 '13 at 05:50

Philippe Signoret

11,004
1
36
54

answered Jul 08 '11 at 21:38

citizen conn

15,011
3
54
78

score 7 · Answer 5 · answered Feb 04 '13 at 16:04

7

No one says that you need to modify the .htacces and add the directory in the rewrite condition. I've created a directory "public" in the root directory alongside with "system", "application", "index.php". and edited the .htaccess file like this:

RewriteCond $1 !^(index\.php|public|robots\.txt)

Now you have to just call <?php echo base_url()."/public/yourdirectory/yuorfile";?> You can add subdirectory inside "public" dir as you like.

answered Feb 04 '13 at 16:04

Kreker

2,272
3
21
25

I'm a bazillion years late, but if anyone is reading this, this answer was my initial solution, but if you are managing the access through virtual hosts, i think is a better idea to point the virtual host to the public folder and keep the .htaccess config. Upvote anyway because this answer point me to the solution – Vertig0 Apr 09 '15 at 01:52

Cheesus Toast · Answer 6 · 2013-05-18T10:24:31.160

Regardless of where you put the CSS file you can simply use the CodeIgniter "html" helper called link_tag(). You would apply this helper something like this:

echo link_tag('folder/subfolder/stylesheet.css');

It is up to you to locate the CSS file in the most appropriate place (in your opinion). You would have to either autoload the "html" helper or separately load it in to use it.

People keep suggesting the usage of base_url() to achieve this but it is actually not really the "CodeIgniter" way to do it (I think this question has a few duplicates). That will work but one of the reasons for using a framework is to use the pre-made functions within it.

There are many helpers in codeigniter to do this kind of thing.

score 4 · Answer 7 · answered Jun 06 '13 at 12:22

add one folder any name e.g public and add .htaccess file and write allow from all it means, in this folder your all files and all folder will not give error Access forbidden! use it like this

<link href="<?php echo base_url(); ?>application/public/css/style.css" rel="stylesheet" type="text/css"  />
<script type="text/javascript" src="<?php echo base_url(); ?>application/public/js/javascript.js"></script>

score 4 · Answer 8 · answered Aug 28 '16 at 11:51

4

I'm using the latest version of CodeIgniter 3.1.0. The folder structure of it is:

system
application
user_guide
assets
- images
- js
- css

That's where you should put the images, css and js files inside the assets folder.

answered Aug 28 '16 at 11:51

coolest

427
1
4
17

score 3 · Answer 9 · answered Sep 14 '15 at 11:35

3

I use the following folder structure:

application 
system 
static
    admin
        js
        css
        images
    public
        js
        css
        images
    uploads
        original
        thumbs

answered Sep 14 '15 at 11:35

Scorpion

396
2
14

score 2 · Answer 10 · answered Apr 07 '15 at 17:32

(I am new to Codeigniter, so I don't know if this is the best advice)

I keep publicly available files in my public folder. It is logical for them to be there, and I don't want to use Codeigniter for something I don't need to use it for.

The directory tree looks likes this:

/application/
/public/
/public/css/
/public/img/
/public/js/
/system/

The only files I keep in /public/ are Codeigniter's index.php, and my .htaccess file:

RewriteEngine On
RewriteBase /

RewriteRule ^css/ - [L]
RewriteRule ^img/ - [L]
RewriteRule ^js/ - [L]

RewriteRule ^index.php(.*)$ - [L]
RewriteRule ^(.*)$ /index.php?/$1 [L]

score 2 · Answer 11 · edited Oct 30 '19 at 10:57

you can put the css folder inside the assest folder(you name it any name) in the directory of your project as:

- ci_app
- application 
- views      
- assets 
  - css 
    - style.css

... when you want to load that file in a page, you can use base_url()function as this way: <head> <link rel='stylesheet' href='<?php echo base_url();?>assets/css/style.css'> </head> and you are sure to add base_url of your project in the config.php file as this:

$config['base_url'] = 'http://localhost/ci_app';

score 0 · Answer 12 · answered Mar 01 '16 at 07:06

Hi our sturucture is like Application, system, user_guide

create a folder name assets just near all the folders and then inside this assets folder create css and javascript and images folder put all your css js insiide the folders

now go to header.php and call the css just like this.

<link rel="stylesheet" href="<?php echo base_url();?>assets/css/touchTouch.css">
  <link rel="stylesheet" href="<?php echo base_url();?>assets/css/style.css">
  <link rel="stylesheet" href="<?php echo base_url();?>assets/css/camera.css">

score 0 · Answer 13 · answered Aug 26 '20 at 11:55

I just wanted to add that the problem may be even simpler -

I've been scratching my head for hours with this problem - I have read all the solutions, nothing worked. Then I managed to check the actual file name.

I had "image.jpg.jpg" rather than "image.jpg".

If you use $ ls public/..path to image assets../ you can quickly check the file names.

Sounds stupid but I never thought to look at something so simple as file name given the all the technical advice here.

score -2 · Answer 14 · edited Mar 12 '16 at 05:28

-2

The link_tag() helper is clearly the way to do this. Put your css where it usually belongs, in site_root/css/ and then use the helper:

From The CodeIgniter docs...

echo link_tag('css/mystyles.css');

Output

<link href="http://example.com/css/mystyles.css" rel="stylesheet" type="text/css" />

edited Mar 12 '16 at 05:28

Mr. ED

11,163
10
51
114

answered Apr 20 '15 at 23:11

Stephen C

101
4

Where do I put image files, css, js, etc. in Codeigniter?

14 Answers14

Folder Structure

Files to edit

Linked

Related