MarkupCSScompress

[Martijn Geerts]

Module:
MarkupCSScompress 0.8.5 (beta)

convert $config->styles array to a single gzipped & cached CSS file and give <link rel="stylesheet" src="/processwire/styles.min.css/"> tag back.

I love using the $config->styles array on the front-end. One disadvantage is, I like it that much that I end up with a multitude of styles with their corresponding links. To much requests for the browser if you asked me.
 
So my thought was: I wish I could combine all styles, compress the css and serve 1 link back to the browser. But I don't like struggling to find CSS selectors in a compressed file. So I add the setting: Caching & concatenating disabled for superusers. For caching I used Ryan's beautiful MarkupCache module.
 
Cons:

• Doesn't work with external CSS files ( All CSS files have to exist in processwire  )

How to use: ( important )

• Put the MarkupCSScompress.php into the template folder.
• Place <?php echo $modules->get('MarkupCSScompress')->render(); ?> in the head where normally the CSS <link> would be.
• Install this module.

Totally open for changes & improvements.

• download from github
• view on github
• modules on PW

---

Todo:

• Change al relative urls to absolute urls in the CSS cache files. ( done )
• Check PW version compatibility

[Martijn Geerts]

It looks like LanguageSupportPageNames (2.3.1) doesn't support URLs that doesn't end with a trailing slash.

Will it be supported in the near future? 

 

note: /processwire/styles.min.css looks so much nicer then: /processwire/styles.min.css/

[ryan]

It looks like LanguageSupportPageNames (2.3.1) doesn't support URLs that doesn't end with a trailing slash.

Will it be supported in the near future? 

 

 

This is now fixed in the latest dev branch. 

 

Thanks for the nice module! 

 

 

 

 

 

[ceberlin]

Hi, I find your module an interesting alternative to "minify" but I find the instructions confusing.

- There is no "templates" folder inside of the "modules" fiolder, You mean the "site" folder?

- Does your php file needs to be in the root of the template folder or can it reside in a subfolder?

- "All CSS files have to exist in processwire" You mean all css files, external or not, are loaded into PW's config-> array?

- CSS files need a certain order. Is this order preserved after minifying?

- <?php echo $modules->get('MarkupCSScompress')->render(); ?>

Do you target the module file with this? Or the file that was copied into templates and is this the right code for that?

[Martijn Geerts]

01. & 02. It's /site/templates/ ( the place where to put the MarkupCSScompress.php, it's just a PW template )

03. CSS files have to be PW accessible. ( CSS files from other sources won't work, other domains for example.)

04. The order is the order that files are in the array.

05. The module here is triggered, and uses the MarkupCSScompress.php (template) to output the combined styles.

[ceberlin]

Great, thank you! - I am giving the module a try now.

FYI: After what you wrote, this info looks incorrect on the PW modules page:

Instructions

• Put the MarkupCSScompress.php into the template folder. (located in the module folder)   

[ceberlin]

Hi,I would recomment updating minify a.s.ap. in your module, see this thread:

http://processwire.com/talk/topic/1537-minify/page-2

[Martijn Geerts]

I looked at it a time ago, but I don't use that part of the Minify script.

Maybe better to delete all those parts I don't use.

(using 2 classes directly from within this module)

(Already did the deletion of the rest of the files, think when developing that module )

Edited September 8, 2013 by Martijn Geerts