One of the most wonderful thing in Drupal 5 is Garland theme. It is very flexible and simple to modify. In addition, Garland theme is really usable in production site. However, the very first step to make it usable in production site is to change logo and favicon to match what you have. If you notice the header area, Garland allows us to set gradiant from top to bottom of that region. This feature is a good and a bad. It looks good but the question is how to produce the logo to match this gradiant.

As far as I know, transparent PNG is not supported in IE6 and earlier version. The transparent color will be displayed as white. As a result, transaprent PNG must not be used for production site that visitors may use IE to browse the site. In other words, we should produce a logo with the gradiant as its background. The next problem is how to make it align. Actually, Garland theme doesn't provide the template to produce the logo.

The secret is that changing logo in Garland theme is very simple and template is absolutely unnecessary.

We need 2 things.

1. A logo in transparent PNG format at size 64x73 pixels.
2. color module.

Then follow below steps.

1. Enable color module in admin/build/modules.
2. Go to admin/build/themes/settings/garland and upload the logo image.

That's the magic. color module has automatically produced the correct logo with gradiant background as it could be. You are able to change color theme as your imagination. The background will be generated everytime you change logo or color theme. It works with Firefox, IE and Safari.

If you are going to create a theme, don't forget to read and follow instruction for integrating with color module.

Tags: drupal, garland