19

Is there an advantage/disadvantage to using a EE css template vs a standard css file? I tend to use a css directory that is separate from EE templates. I like using a css preprocessor, and I prefer not to sync my css files through the Template Manger. I am wondering if I am missing some advantage to not using a ExpressionEngine css template?

  • Are you able to select a "correct" answer from those provided? – Anna_MediaGirl Dec 18 '12 at 5:10
27

I'd say you're not missing much at this stage in the game and if you are using preprocessors then even more reason to not use EE CSS templates.

With that said, I could see if you wanted to give your clients access to edit certain colors, for example href colors, then you could build something dynamic which allowed them to edit said colors via GVs, Snippets or Low Variables etc. So the advantage would be the fact that you could use Tags (or PHP even) in a stylesheet template.

Aside from that I'm not seeing much advantages for going that route. Oh, maybe caching; I don't know to be honest on that either because, you have add-ons like Minimee which will minify and cache your css now as well so, not really sure if there are any advantages there any longer either.

  • Agreed. The less EE has to do the better. There are so many other good tools to minify and combine css files. – mjr May 14 '14 at 13:17
11

Very rarely will I run CSS through EE.

There are times when it's useful as Nate has said but generally it's another load on the template parser that doesn't need to be there.

I also generally keep my 404 page outside of EE as well because it's another db load that doesn't need to be there.

I never edit templates in production either.

7

The main advantage of using CSS templates over flat files (as Natetronn has mentioned) is the cache busting EE provides. EE adds a version number to the end of the file name automatically and this will flush the CSS out of browser caches each time you update the CSS. This can be highly important if your main audience is sitting behind a corporate firewall as they tend to cache for longer.

I like it as it gives me the opportunity to edit the CSS through the EE cpanel should I need access when I don't have FTP access - such as when I don't have a laptop with me. Yet using Mountee I can still edit it in my code editor of choice.

The other advantage is Versioning, if you have it turned on and are not using a version control system like Git.

  • 4
    Just a quick note about caching if you're using css/js as file. You can use Erik Reagan's Cache Buster which appends the file's modified timestamp (as a query string) to the end of the file url. – Dave O'Brien Nov 19 '12 at 14:39
  • I would like to have control of the cacheing of my CSS and JS files. I have never used Cache Buster before. In my case, it might be a better solution then using up database resources though a template call. Thanks @divtagged! – Shan Ricciardi Nov 19 '12 at 21:04
6

I've just used SASS for the first time on a project and I ended up with a bit of a hybrid solution.

I had one main.css stylesheet which was generated by Compass (for all the SASS goodness). This just overwrites the EE CSS template when it generates.

I then had a second stylesheet dynamic.css which was used purely for stuff which the client could edit, such as background images, colours etc. This was a standard EE CSS template. The second dynamic one was pretty sparse, literally only containing the stuff that could be edited and nothing more.

I kept the two files in the location in the EE file structure for no other reason than, if someone was to follow behind me, that's where they'd expect them to be.

Splitting the stylesheets out into two separate ones might be a bit much for most folks, but I get really twitchy when working on massive all encompassing files which have loads of different stuff going off in them. I'd much rather keep things in there own separate box, and then combine them at the end. Which thanks to Natetronn is what Minimee looks like it's going to do for me.

I would be interested to hear if this is a totally dumb way of going about things as it is the first time I've done it, so I'm all ears if there is a much better way.

  • 4
    That's a good way of doing things as you're avoiding routing static requests through EE. In terms of keeping things organised, if you aren't doing it already you can easily generate a single file from several sass/scss files via the @import command, e.g. @import 'partials/forms';. Couple that with automatically minimised output via output_style = :compressed and you have a pretty good setup. – Dom Stubbs Nov 19 '12 at 10:27
  • Thanks for the feedback Dom, it's good to know I'm headed in the right direction. The @import was the first thing I reached for, so much nicer to work with individual files :) – Steve Holland Nov 19 '12 at 12:28

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.