f + tab

This creates an anonymous function, which is great when using jQuery or many other JS libraries out there. I tweaked mine to remove the semi-colon at the end.

functionname+shift+return

If you type out the name of your function, then immediately hit Shift + Return, TextMate will convert it into a function.

fun+tab

Construct a function with tab stops.

This site compresses MooTools to about 20kb (the original file with YUI Compression weighing in at 65kb). Check it out!

The Setup

This will literally take minutes to integrate.

1. Download the PHP script.
2. Upload the file to your active WordPress Theme folder.
3. Create a folder called “cache” – Make sure this folder has proper permissions
4. Create an .htaccess file in your theme folder.
5. Create a folder called “css”
6. Create a folder called “javascript”

Making it Work

Insert the following code into your .htaccess file in your active theme. Make sure to replace RewriteBase with the absolute path to your theme folder where your combine.php script resides. Note that I made RewriteRule to be a relative path to combine.php:

RewriteEngine On
RewriteBase /wp/wp-content/themes/yourtheme/
RewriteRule ^css/(.*\.css) combine.php?type=css&files=$1
RewriteRule ^javascript/(.*\.js) combine.php?type=javascript&files=$1

You’re ready to link your Javascript and CSS files. As described on the authors site, you link your stylesheets and scripts by chaining with commas. Here is how it will look in your WordPress theme file:

<link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/styles.css,
another.css,athird.css" type="text/css" media="screen" />

<script src="<?php bloginfo('template_url'); ?>/javascript/jquery.js,
another.js,etc.js" type="text/javascript"></script>

Notes

You need to consider script dependencies, and chain your scripts accordingly. Also, make sure your stylesheets are added in the correct order or you may notice some rules being overridden. Depending on your server configuration you might have to chmod your cache folder to 777. Confirm that your cache folder contains your cached files with a ‘.gzip’ extension.

All CSS files are moved to the CSS folder in the theme. This goes against the WordPress convention of style.css in the theme’s main folder. I still have theme comment data for WordPress in my original style.css file, but I don’t use it on my site.

Major hat-tip to Niels Leenheer for creating such a great script and simple solution.