RFC – ChuckNorris Plugin

Update (06/10/2009): installation & usage instructions are available from ChuckNorris Plugin wiki page.

Me and some colleagues were yammering some Chuck Norris Facts-like jokes a few days ago (ChuckNorrisException can never be caught, only thrown :p), and that reminded me of ChuckNorris Plugin, a simple plugin I wrote when I first started learning about Hudson plugin mechanism a while ago.

This plugin displays a picture of Chuck Norris, instead of Hudson the butler, and a random Chuck Norris ‘The Programmer’ fact on each build page.

On failure build, Chuck Norris is ready to give you a whoopin’ for breaking the build.
You’ll also see a Chuck Norris fact on the build page.

A thumb up on successful build.

And an alert stance on other build results.

Please leave a comment and let me know what you think of ChuckNorris Plugin. And also let me know if you want to install it on your Hudson instance, I’ll make the .hpi file available for download.

My favourite facts: ‘Chuck Norris can unit test an entire application with a single assert,’ and ‘When a bug sees Chuck Norris, it flees screaming in terror, and then immediately self-destructs to avoid being roundhouse-kicked.’

A Cleaner Way To Customise WordPress Theme Styles

The most frequently asked question from Emptiness Theme users was about customising the styles (font, color, width, etc) and the header image of the theme, and I usually answered by giving them some pointers to which file to modify and where. The problem was that most WordPress users  would make the modifications directly against the theme files.

The downside of such approach is that the custom code would end up buried within the theme, which users won’t remember few months down the line. And this will then discourage them from upgrading the theme in order to avoid overwriting the customisations accidentally.

A cleaner approach to customise a theme is by isolating the custom code away from the original theme code. Having said that, I would like to encourage my theme users to start practicing this approach. Here’s what you need to do:

1. Install MyCSS Plugin, read the documentation on how to use the plugin. Note: you might encounter an error complaining about ‘my.css file not found’, to fix this, you need to create my.css file under mycss plugin directory and give it a proper permission (644 will do).
2. When you need to customise a style, do it on my.css file. CSS code in this file will take precedence over the theme’s own style.css .

For example, to change the font-family of the sidebar headings, I added these lines to my.css file:

h3 {
    font-family: helvetica, sans-serif;
}

That’s it. I didn’t modify any of the theme code. The catch here is of course we have to be careful not to accidentally delete my.css file.

I don’t know why WordPress doesn’t have this custom CSS feature as part of vanilla WordPress installation. I think this would be very useful when they finally provide easy theme upgrade just like the way upgrading plugins is done.

As for MyCSS Plugin itself, it would be nice if it allows me to customise the location of my.css file so I can put it external to the plugin directory. And how about storing the content of my.css in the database so it can be persisted between plugin versions? Another nice improvement would be to provide the ability to upload files, handy for custom images.

Testing Reflection Plugin

I spent several train rides this week putting together Reflection Plugin for WordPress. This plugin applies reflection effect to images on a blog. The reflection effect is done on the client side using the excellent Raphael JavaScript library. You can use normal image on your posts as usual, and you’ll get the reflection effect by simply adding ‘reflection’ to the class value.

Here are some examples of the effect…

Wide movie poster:

Album covers, aligned, with wrapping text:

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut pede ut mauris varius ultricies. In a dolor non risus dapibus faucibus. Etiam tristique pellentesque ligula. Cras tempus nunc vel turpis. Vivamus congue. Nullam hendrerit tincidunt metus. Pellentesque bibendum dapibus felis. Suspendisse risus magna, placerat id, malesuada eget, pellentesque quis, felis. Sed dolor lectus, vehicula rutrum, venenatis et, fringilla vel, tellus. Curabitur mi. Donec ligula pede, vulputate vitae, bibendum ac, pharetra in, elit. Pellentesque et mauris ut pede mattis commodo. Mauris massa odio, egestas eget, luctus id, suscipit sit amet, velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse ac sem. Cras nec dolor a ipsum consectetur lobortis. In blandit erat. Fusce mollis ultrices ipsum.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Donec ut pede ut mauris varius ultricies. In a dolor non risus dapibus faucibus. Etiam tristique pellentesque ligula. Cras tempus nunc vel turpis. Vivamus congue. Nullam hendrerit tincidunt metus. Pellentesque bibendum dapibus felis. Suspendisse risus magna, placerat id, malesuada eget, pellentesque quis, felis. Sed dolor lectus, vehicula rutrum, venenatis et, fringilla vel, tellus. Curabitur mi. Donec ligula pede, vulputate vitae, bibendum ac, pharetra in, elit. Pellentesque et mauris ut pede mattis commodo. Mauris massa odio, egestas eget, luctus id, suscipit sit amet, velit. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Suspendisse ac sem. Cras nec dolor a ipsum consectetur lobortis. In blandit erat. Fusce mollis ultrices ipsum.

Obligatory browser screenshot:

For more information, please have a look at Reflection Plugin web page.

Update (07/12/2008): I’m starting to think that this plugin can actually be an image effect plugin. Not only reflection, something like rounded corner effect can easily be done with Raphael, along with many other effects. The underlying work is basically to apply client side image effect by using class attribute values as meta data (hmm, shouldn’t future version of CSS support this?). Oh well, let’s see how Reflection Plugin goes.