Login

07-24-2012, 10:10 AM

[eluser]alvaroeesti[/eluser]

Hello,

I have tried it but it won't work, and if you look at the sample pages of CI, the style sheets are in the welcome_message.php for example, that is, they are not imported through a

<link rel="stylesheet" href="style.css" type="text/css" media="screen" />

for example, because that does not seem to work. But I don't want to have a style sheet adding dozens of lines of code to a page, I want to have it separated, as you would always want to have it.

What is the solution to that?

thank you

07-24-2012, 10:40 AM

[eluser]TWP Marketing[/eluser]
Try placing your css styles in an asset directory, for example:

Code:
&lt;head&gt;

...

&lt;base href='http://yoursite.com/' /&gt;&lt;style type='text/css' media='all'>@import url('css/my_css.css');&lt;/style&gt;

&lt;link rel='stylesheet' type='text/css' media='all' href='css/my_css.css' /&gt;

...

&lt;/head&gt;

Notice the relative address to the css file in the href element

I use a single subdirectory under the root, named css.

Code:
root /

 |

 -- css

    |

    -- my_css.css

 -- js

    |

    -- something.js

Other people recommend placing all your "assets" in an assets subdir like this

Code:
root /

 |--assets

    |

    -- css

       |

       -- my_css.css

    -- js

       |

       -- something.js

07-24-2012, 10:47 AM

[eluser]alvaroeesti[/eluser]
Hello

Well, actually what I did is:

In the views directory, I created a subdirectory, called Includes. In there, I am placing the header, the footer and the css. Then, in my header page, that is where I have the

<link rel="stylesheet" href="style.css" type="text/css" media="screen" />

is this not actually what you are saying?

I tried an additional variant, to load the css from the controller too, but it will not work either.

07-24-2012, 11:08 AM

[eluser]TWP Marketing[/eluser]
Remember that the paths to your "includes" are relative paths.

I no longer use "included" files, even though it perfectly valid php.
The CI MVC framework (and most other frameworks too) keep code which is reused (like CSS and javascript) in a separate directory. Not within the views directory. That's where you have to watch the paths.

Rather than "include" css files, I use the header parameters to link the css to my html doc.
And then I use the CI loader class to build my HTML doc using multiple 'subviews'
http://ellislab.com/codeigniter/user-gui...oader.html

07-24-2012, 11:16 AM

[eluser]CroNiX[/eluser]
You can't directly access anything in the /system or /application folder via the URL. They are protected. So putting your css file in the views dir won't be directly accessible from the URL, which means you can't use them for assets.

Code:
-/web root

--/system

--/application

--/css

----mystyles.css

--/js

----myjs.js

--/images

----myimage.jpg

--/index.php

Code:
&lt;style type='text/css' media='all'&gt;@import url('/css/mystyles.css');&lt;/style&gt;

<skript type="text/javascript" src="/js/myjs.js"></skript>

<img alt="" src="/images/myimage.jpg" />

07-24-2012, 11:34 AM

[eluser]alvaroeesti[/eluser]

@ TWP Marketing, I never used the php word 'include' to fetch the style sheet, the import was made in the header.php page through the standard.

Code:
&lt;link rel=“stylesheet” href=“style.css” type=“text/css” media=“screen” /&gt;

it is just that I named the folder where that css file was, 'includes'.

The header and the footer and the css were all located in the same folder.
Another thing would be that, what you are actually describing as the location with regards to the root directory, that would be the Absolute path, whereas the location to one of my pages in the views folder, would be Relative path.

@CroNiX

the header and the footer are located in a subdirectory at views, and they are effectively fetched from the main.php which is located in the views, they are fetched by the include command.

So, what it seems is that while the include command can grab any php page and make it work where you want it, it seems that the link rel=“stylesheet” etc don't work that way.

07-24-2012, 11:40 AM

[eluser]CroNiX[/eluser]
If you have things structured the way I showed them and use the traditional HTML ways of bringing the asset into your html, like I showed, it will work just fine. You just can't have your assets in one of the protected directories, which "views" is because it's located within "application" which has a htaccess file blocking direct access.

Look at the structure of what I posted. The asset dirs (css/js/images) are at the same level as index.php, which is accessible via the url as it's public. You could type "http://www.yoursite.com/images/myimage.jpg" in your browser and the image would load like normal. There's no magic here, just using regular HTML and having your assets located in a publicly accessible place.

Also remember if you use a php "include" to bring an asset in, it will slow your page load speed as your browser is fetching a larger file, rather than 2 individual files which the browser can load in parallel.

You also mention using "include", which you shouldn't have to do. CI has load methods which can load views and other things like libraries. You should be using those instead of "including" anything.

07-24-2012, 11:43 AM

[eluser]alvaroeesti[/eluser]

Ok. thank you very much to the two of you, great teaching!

07-24-2012, 12:21 PM

[eluser]alvaroeesti[/eluser]

I have followed well the advices and removed the include and loaded the header and the footer from the controller alright, so that is great and was great learning.

As per the css, I did exactly as you said, and I have understood it because I counted the number of dashes that you used to represent the depth of the directories, so the css directory that you created is at the same level than the ones for Application, System and User guide. I named it assets (instead of css) and I placed inside the style.css and then in my header.php page which is inside the views folder, I pasted the link

Code:
&lt;style type='text/css' media='all'&gt;@import url('/assets/style.css');&lt;/style&gt;

but still isn't importing that css file.
what am I missing ? it should actually import it, ain't the path correct ? that path is Absolute, that is, taking as base point the root, it should not even matter if I move the header.php file (the referencing file) elsewhere because it is referring to the style.css file with regards to the root.

07-24-2012, 12:31 PM

[eluser]CroNiX[/eluser]
Are you using an htaccess? If so, post it. You probably aren't allowing access to your assets dir.