6

I notice not many people have downloaded the plugin Combine CSS. Without it, I don't know of a better way to automatically combine CSS files. I was wondering, are 99% of the developers using WordPress just working in a single stylesheet? Is there some other way to combine CSS without the Combine CSS plugin?

  • 1
    There are many plugins that combine CSS, but this is not the place to discuss plugins. – vancoder May 2 '13 at 23:45
  • 3
    "WordPress Answers" is not a place to discuss plugins? Are you kidding me? Furthermore, it was a generalized question. Where else would you go to ask the question "How to Handle CSS Organization". I don't see how this isn't an appropriate place. – JamesHoux May 2 '13 at 23:49
  • 3
    I should be clearer. From the FAQ: we do not handle questions... asking for recommendations for plugins – vancoder May 2 '13 at 23:52
  • Are you talking about concatenating css for use in your themes/plugins or on your own website? – OriginalEXE May 2 '13 at 23:53
  • 1
    "As it currently stands, this question is not a good fit for our Q&A format. We expect answers to be supported by facts, references, or specific expertise, but this question will likely solicit debate, arguments, polling, or extended discussion." - close voted as not constructive – Chip Bennett May 3 '13 at 0:16
5

If you have shell access to an Apache server, Google's Mod Pagespeed is a great way to do so automatically at the server level. It has really powerful options for doing much more than just combining CSS and speeding up your sites.

mod_pagespeed

mod_pagespeed speeds up your site and reduces page load time. This open-source Apache HTTP server module automatically applies web performance best practices to pages, and associated assets (CSS, JavaScript, images) without requiring that you modify your existing content or workflow.

3

Several constants are used to manage the loading, concatenating and compression of scripts and CSS:

define('SCRIPT_DEBUG', true); loads the development (non-minified) versions of all scripts and CSS, and disables compression and concatenation,

define('CONCATENATE_SCRIPTS', false); disables compression and concatenation of scripts and CSS,

define('COMPRESS_SCRIPTS', false); disables compression of scripts,

define('COMPRESS_CSS', false); disables compression of CSS,

define('ENFORCE_GZIP', true); forces gzip for compression (default is deflate).

Is this the answer you are looking for? WordPress has a build-in concaternating of scripts and css. But you have to activate it by yourself with define( 'CONCATENATE_SCRIPTS', true );. It seems most of the blog owner doesn't know this or simply doesn't care.

  • Theme developers shouldn't care, because this isn't something that a Theme should be mucking with. – Chip Bennett May 3 '13 at 1:44
  • Yes right, this should be placed in the wp-config.php. I don't know why I wrote 'theme-developer', lack of concentration I guess. – Ralf912 May 3 '13 at 1:52
1

I agree with you that some of the restrictions on what you can/can't answer on a site titled "WordPress Answers" are a tad ridiculous. That aside, I will actually provide you with an answer rather than argue the point.

  1. Sometimes we have CSS which is only necessary for a single page. This is often the case with things like contact form or archive pages. To handle this we can incorporate some of the answers found here: http://wordpress.org/support/topic/different-css-on-one-page This type of solution will keep you from loading unnecessary CSS on pages that do not require it, very helpful.
  2. Many theme developers will put their CSS in a single stylesheet but this is not always the case. I suggest calling CSS for things like plugins or options panels internally in your theme's files, rather than having them in the stylesheet for a potential novice to fiddle with.
  3. If you want to compress the CSS you can use any number of free CSS compressors. One I use is Styleneat: http://www.styleneat.com/
  4. I personally find it somewhat pointless to use the plugin you've mentioned. It doesn't take much to move the appropriate CSS to the appropriate stylesheet.
  • 1
    This site FAQ and scope are discussed and decided on WordPress Development Meta. You can check the archives and raise any new concerns that you have over there. Good info here, btw :) – brasofilo May 3 '13 at 3:01
  • I'm not sure how this comment really addresses my answer... – AndrettiMilas May 3 '13 at 3:25
0

I'm a big fan of CodeKit: http://incident57.com/codekit/

I work with LESS, so I organize my CSS into multiple .less files: reset.less, webfonts.less, forms.less, style.less, etc. Every time I make a change on my local computer to one of these files, CodeKit automatically compiles the whole thing down to the main style.css. That way my code is nicely organized but the site only needs to load a single, compressed stylesheet.

  • PrePros is a Windows based alternative of CodeKit and it really does make minification and even image optimisation, amazingly easy. It just automates the whole process. – Phill Healey Nov 10 '18 at 21:34
0

I use Sass and Compass, which offer numerous benefits beside CSS combining and compression. LESS is another great option, as mentioned by @Dalton above. It's not necessary to purchase CodeKit to use Sass or LESS (though it is a great app), as both are open-source.

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.