Working with a Template & Rewriting CSS & JS

[eluser]ChangedNames[/eluser]
Hello CI community. I came across this framework yesterday and man does it look promising. I'm very excited about working with it.

My workflow in the past has led me to a filesystem structure that I prefer to use all the time now. I use it on small static projects, Wordpress themes, drupal, etc. It's pretty common amongst developers anyways so I don't want to claim any ownership over it. The purpose for writing is because I wanted to find a way to set it up with CI. I searched around the forums and couldn't find anything where someone did this already so I figured I would share.

I created my "template sections" (header, footer, ads, sidebar, etc) in my application/views folder under a subfolder "template". Each time I call them into place I (obviously) use $this->load->view('template/header'); or something to that affect. I always have my CSS and JS referring from the root of my domains. Example:

Code:

link rel="stylesheet" href="/css/main.css" type="text/css" media="screen" charset="utf-8"/>

I wanted to keep this intact but have the files nested within my template folder (so that if I need to change the "theme" down the road I can do this with ease. I also have a PHP file that actually works with my CSS and JS (for logging purposes - watching how many people access them directly). This lead me to add the following to my .htaccess file:

Code:

RewriteRule ^(.*)$ index.php?/$1 [QSA]
  RewriteRule ^css/(.*)\.css /system/application/views/template/file_handler.php?file=$1&type=css
  RewriteRule ^js/(.*)\.css /system/application/views/template/file_handler.php?file=$1&type=js  [L]

Now I don't have to worry about needing the URL helper to grab the root site address or anything.

Does anyone have any thoughts on this process? Does it seem illogical or flawed? I'm not too familiar with Apache or regular expressions so any thoughts are appreciated.

[eluser]The Wizard[/eluser]
you know what,
i love you

this was exactly THE thing i was looking for!

with this code, at least all css files can be keeped OUTSIDE of the theme folder
and the particular images and HTML's and all the nasty theme shit, can be located
in it.

if i am assuming right, it would result in something like,

views/themes/
in this folder there would be
a.css
b.css
c.css
d.css
and FOLDERS like
\a
\b
\c
\d

where all the stuff belonging to a b c or d could be put in to.
that would help us for a theme system

let me try that.., ill report when im done with it, ive to draw
some designs so we will see

[eluser]The Wizard[/eluser]
Hello again

maybe didnt worked like the way i wanted, or i didnt manage to do it like that,
i suggest all to take a look at

http://ellislab.com/forums/viewthread/88821/


take care

[eluser]ChangedNames[/eluser]
I'm not sure I understood your first reply.

[quote author="herrkaleun" date="1220236171"]with this code, at least all css files can be keeped OUTSIDE of the theme folder
and the particular images and HTML's and all the nasty theme shit, can be located
in it.[/quote]

I'm keeping my css and js files INSIDE what you are calling the "theme" folder. I simply created a folder called "template" in system>application>views that holds my theme php, css, js, and image files. I've actually reworked my htaccess and now it looks more like this (not the full contents):

Code:

RewriteRule ^(.*)$ index.php?/$1 [QSA]
RewriteRule ^images/(.*) /ci/system/application/views/template/images/$1
RewriteRule ^css/(.*)\.css /ci/system/application/views/template/css/$1.css
RewriteRule ^js/(.*)\.js /ci/system/application/views/template/js/$1.js  [L]

I was using a php file handler for some debugging purposes but now I have no need for that. I just reference directly to the template folder I have. This way if anyone wants to see my css, js, or images they can navigate to http://mysite.com/css/something.css as opposed to my system folder (which I actually renamed). The files are still physically in the folder listed above which directly would be http://mysite.com/ci/system/application/...ething.css.

So far this is working perfectly for me and all of my paths are absolute to the server (beginning with a forward slash "/").

If it helps this is what my htaccess file looks like currently:

Code:

<IfModule mod_rewrite.c>
  RewriteEngine On
  RewriteBase /ci/
  RewriteCond $1 !^(index\.php|images|css|js|robots\.txt|favicon\.ico)
  RewriteCond %{REQUEST_FILENAME} !-f
  RewriteCond %{REQUEST_FILENAME} !-d
  RewriteRule ^(.*)$ index.php?/$1 [QSA]
  RewriteRule ^images/(.*) /ci/system/application/views/template/images/$1
  RewriteRule ^css/(.*)\.css /ci/system/application/views/template/css/$1.css
  RewriteRule ^js/(.*)\.js /ci/system/application/views/template/js/$1.js  [L]
</IfModule>