Multi CSS: Strategical + Optimization Question

Discuss phpwcms here, please do not post support requests, bug reports, or feature requests! Non-phpwcms questions, discussion goes in General Chat!
Post Reply
User avatar
StudioZ
Posts: 802
Joined: Fri 28. May 2004, 19:57
Location: Québec, Canada
Contact:

Multi CSS: Strategical + Optimization Question

Post by StudioZ »

hmm...:roll: :?:

I am thinking about a CSS strategy, where updating
a phpWCMS site to a new version would need less CSS editing.
From times to times as PhpWCMS grows, some extra css data
gets added to the default css file: frontend.css and I don't like to
overwrite these, to make sure I always keep a reference to
the new formating that Oliver adds for new features, from times to times. 8)

What do you think about this solution, where
in my templates I call these three CSS files ?

frontend.css
(default css file)

frontend1-custom-general.css
(default css file - customized, depending on the site)

frontend1-custom-specific.css
(special css file for extra stuff for extra scripts)


Stategical Optimization Question:
:?: Is there a way to call these three CSS files
without having the browser to load all three at once,
when only one is needed in a special section ?
or... asked in another words...
:?: Is there a way to load only the needed CSS file(s) only when
the page need it or them ?

Thank you for your inputs

Gratefully,

Yves
Last edited by StudioZ on Thu 22. Mar 2007, 01:13, edited 2 times in total.
Image
PhpWCMS Evangelist, -- iRoutier.com Running phpWCMS 1.4.2, r354 -> Great Version!!!!
User avatar
marcus@localhorst
Posts: 815
Joined: Fri 28. May 2004, 11:31
Location: localhorst
Contact:

Post by marcus@localhorst »

you can only load all three files at ones in the suggested order:
1 - frontend.css standard and updatable phpwcms file
2 - custom_frontend.css loaded after the frontend.css - to overwrite special setting
3 - as much more custom css you need

your question:
you need to tell the browser when and where he should load the special needed CSS file. There are many ways where and how to do that, depends on your needs (setup different templates, write reference in Contentparts etc, use PHP or JS) but all of them are more complicated than load a whole bunch of (maybe compressed)CSS Files.

greetings
marcus
User avatar
StudioZ
Posts: 802
Joined: Fri 28. May 2004, 19:57
Location: Québec, Canada
Contact:

Post by StudioZ »

Hey! Thank you Marcus for that compressor tip:
http://www.cssdrive.com/index.php/main/csscompressor/
This solution sounds good to me :wink:
Will have to give it a try 8)

Cheers,

Yves
Image
PhpWCMS Evangelist, -- iRoutier.com Running phpWCMS 1.4.2, r354 -> Great Version!!!!
User avatar
Jensensen
Posts: 3000
Joined: Tue 17. Oct 2006, 21:11
Location: auf der mlauer

Re: Multi CSS: Strategical + Optimization Question

Post by Jensensen »

StudioZ wrote:Is there a way to load only the needed CSS file(s) only when the page need it or them ?
Select CSS('s) with template and/or work with:
@import url('folder/special_xtra.css');


My 'frontend.css' usually contains only @imports.

And, strictly speaking, CSS classes, ID's and so on nowadays are only allowed lower case, even without '_' to my surprise. So I change [patch] all phpwcms built in styles with every update....

Greetz
{so_much} | Knick-Knack. | GitHub
Umlaute im URL sind meistens immer Kacke.
User avatar
StudioZ
Posts: 802
Joined: Fri 28. May 2004, 19:57
Location: Québec, Canada
Contact:

Post by StudioZ »

Thank you Jensensen 8)
Your solution is also valuable :wink:
Combined with Marcus' solution, your suggested @import url
sounds or... could be even more optimal.
Will also give it a test drive 8)

Thanks again guys for your tips :idea: :D

Cheers,

Yves
Image
PhpWCMS Evangelist, -- iRoutier.com Running phpWCMS 1.4.2, r354 -> Great Version!!!!
User avatar
Oliver Georgi
Site Admin
Posts: 9888
Joined: Fri 3. Oct 2003, 22:22
Contact:

Post by Oliver Georgi »

you can select as many different css files as you like per template!

There is no must to use frontend.css or custom @import.

Oliver
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Систрон
User avatar
marcus@localhorst
Posts: 815
Joined: Fri 28. May 2004, 11:31
Location: localhorst
Contact:

Post by marcus@localhorst »

Hiho,
that could be interesting for you: http://www.phpwcms.de/forum/viewtopic.php?p=85364#85364

best marcus
User avatar
Oliver Georgi
Site Admin
Posts: 9888
Joined: Fri 3. Oct 2003, 22:22
Contact:

Post by Oliver Georgi »

I can not recommend this in times of broadband connections. Also larger CSS files loads very fast - and will be cached (when no inline CSS is used).

Oliver
Oliver Georgi | phpwcms Developer | GitHub | LinkedIn | Систрон
User avatar
marcus@localhorst
Posts: 815
Joined: Fri 28. May 2004, 11:31
Location: localhorst
Contact:

Post by marcus@localhorst »

hi,
the "you" was not pointed to you (oliver) directly :-) I mean the thread contributors who are interested in optimizing css.

I agree with you, but you know the urge of over-optimizing everything hehe...
and I came up with this because I work for someone who switch from static and very basic html 3.0 files to CMS driven xhtml/css madness and he was confused because of the loading time (I explained the facts of broadband and caching, but I think you know those people - it's not a bad meaning but a fact hehe) - so i find an easy way to minimize loading time and keep the CSS files formatted to keep the overview for later changes...

anyway - it compress the whole css stuff to 10 kb less - and thats ok and an argument for the customer ;-)

best marcus
Post Reply