Home

Scaffold is a CSS pre-processor built in PHP that allows developers to easily create custom extensions to CSS and reduce the amount of time they spend writing code.

Out of the box, you get:

• Nested Selectors
• Variables
• Minify/YUI/CSSTidy compression
• Automatically parse files through SASS.
• Combining of files
• Data URI embedding of images/fonts
• Custom CSS functions like random() and hsla()
• Custom CSS properties like image-replace:url();
• Variables powered by XML
• Mixins

With a complete cache system included; you don’t need to worry about the hit to the server. In addition, Scaffold will serve your CSS to the browser with the correct caching headers.

• Gzip components
• Sets a far-future expires header
• Configures ETags

How it works

Requests to CSS files are made through Scaffold:

<link href="scaffold/parse.php?file=/stylesheets/master.css" rel="stylesheet"/>

You need to tell parse.php the location of a CSS file, and it will do all the work for you. Alternatively, you can use a .htaccess file automatically parse CSS files in a directory.

If the file has changed, Scaffold will recache the file, otherwise it will just fetch the processed file from the cache and return that.

Requirements

• PHP 5.2

Setup

Download the latest version and place the scaffold/ folder somewhere on your webserver.

The parse.php file needs to be accessible to the web, so either put the scaffold folder in your web directory, or move parse.php and change the $system variable inside this file to point to the scaffold directory. parse.php contains the configuration options for Scaffold.

Now in your HTML reference CSS files by going through the parse.php file:

<link href="path/to/parse.php?file=/path/to/stylesheet.css" rel="stylesheet"/>

The file parameter can point to the CSS file using either an absolute path, a path relative to parse.php or you can add your stylesheet directory to the load_paths array in parse.php.

Next

• Configuration
• How Extensions Work
• Creating Extensions
• Creating your own CSS properties
• Creating your own CSS functions

Extensions

• AbsoluteUrls
• CSSTidy
• Embed
• Functions
• HSL
• ImageReplace
• Import
• Minify
• Mixins
• NestedSelectors
• Properties
• Random
• Sass
• Variables
• XMLVariables
• YUI

Resources

• Automatically parsing files with a .htaccess file
• CSS Performance