Installing Drupal on a Mac

The Drupal site contains full instructions for both prerequisites and installation but somethings were not immediately clear to me and some of the documentation is fairly long so I thought I'd distill them here.

Install Apache - On a Mac you don't need to do this as it's already there, you just need to enable it in System preferences under Sharing -> Web Sharing.

Install MySql - You get the option of 32 bit or 64 bit installs. It seems that at the moment it's still safer to install the 32 bit version. I downloaded the dmg version and installed both packages (so MySql will start up automatically with the machine) and the preferences panel.

Install PHP - Again this is already installed on your Mac you just need to activate it.

Download Drupal and unzip it somewhere, (the Drupal instructions will link it to Apache later on).

Configure MySql (by default installed to /usr/local/mysql/bin). The following step by step instructions assume that MySql has only just been installed and has not been configured at all yet.

Log in as root:
mysql -u root

Then the following sets up a root user password:
SET PASSWORD FOR 'root'@'localhost' = PASSWORD('secret_password');

Create a user for use by Drupal
CREATE USER 'drupal'@'localhost' IDENTIFIED BY 'another_password';

Create a database for use by Drupal
CREATE DATABASE drupalDb;

Allow the Drupal user to manipulate the Drupal database (note the ` characters that are not ')
GRANT SELECT, INSERT, UPDATE, DELETE, CREATE, DROP, INDEX, ALTER, LOCK TABLES, CREATE TEMPORARY TABLES ON `drupalDb`.* TO 'drupal'@'localhost';
FLUSH PRIVILEGES;

Quit MySql
\q

Follow the remaining installation instructions on the Drupal site.

The Mac specific instructions on the Drupal site are a bit mangled. This page explains how to set up virtual hosts more clearly:

http://drupal.org/node/238805

One important note here is that if you put your Drupal files somewhere non-standard then you could end up getting 403 errors. This page has some suggestions on how to fix things. Personally I just put the Drupal files in a subdirectory of /Library/WebServer/Documents.

Once that's all done you ought to be able to go to the virtual site you set up and see the drupal installation start page. From there it ought to be plain sailing.

But in my case it wasn't. A final couple of useful points:
- You'll probably get an error about the files directory. Just create the directory manually and give the _www group write access to it.
- If you're installing on Snow Leopard you'll probably get an error after entering the database details. To get around this, click on advanced options and change the host name from localhost to 127.0.0.1.

Notes on the iPhone on IOS4 is broken

Apple recently released IOS4 for the iPhone which updated a number of things (mostly for the better).

One of the less obvious changes was to synchronise notes from the Notes app automatically with your gmail account. The iphone will automatically create a "Notes" label in gmail and file your notes there.

Anyway this would have passed unnoticed for me except that the Notes app is now bugged and anything after the first few lines of a note will be lost when you close and re-open the app. This makes the Notes app unusable and is apparently down to a bug in the gmail synchronisation.

Fine so I just turn off this feature that I didn't want anyway and everything will be OK right? Wrong. Turn off the note syncing (in the settings app under the mail settings) and any notes written since you updated your phone will vanish from the Notes app completely. Brilliant.

Fortunately they don't get deleted from gmail so you can still get at them and paste them back into the Notes app where they ought to have stayed in the first place.

So be warned, if you use the Notes app at all then turn off the gmail synching ASAP and be prepared to retrieve your newest notes from gmail.

PNG and CSS colour matching

Whilst working on my new site layout I came across a couple of issues.

Firstly, at least on a mac, if you create a PNG with a certain colour and then use that same colour in a stylesheet the likelyhood is that the colour won't look the same in a browser. If you want to see this for yourself, have a look at the various test pages at libpng.org.

One way to get around this problem is to use a single pixel image as a repeating background instead of setting a colour in the stylesheet.

This brings me to the second and far more bizarre issue. In Chrome (but not firefox) a single pixel background image displays as a different colour to a background image made up of two or more pixels of the same colour. I have tested this by creating a two pixel image viewing it, then cutting it down to one pixel and viewing it again so I'm pretty sure it's not some subtle issue to do with the image itself.

My best guess is that Chrome is optimising single pixel background images somehow. However, it's not just turning it into a CSS background colour as it displays as yet another different colour.

So for now I'll have to make do with 2 pixel background images to be able to match my  backgrounds to my other graphics.

Static Sites with Haml, Sass, and ScriptMatic

I was listening to an episode of the "Herding Code" podcast recently, and they had a guest on who was singing the praises of Haml. Haml is a language for creating HTML documents that is supposedly neater and easier to use than HTML itself. Haml is also packaged with another project called Sass (although either can be used without the other) which is a language for creating CSS documents. Again Sass is supposed to be easier and quicker to write than CSS, but it also supports variables and arithmetic which can be very useful.

Since my website is currently in need of a refresh I thought I'd try using these languages and see how it went.

Haml and Sass are often used with dynamic pages generated by Rails. My site is a simple static affair, and whilst it is possible to run both Haml and Sass from the command line it's quickly going to get tedious. So, I had a look for a tool to help. My requirements were:

• Must support Haml and Sass
• Must have a live preview - automatic regeneration of the site whilst developing
• Must support partial files - so that common sections can be split out and re-used
• Must be able to export the site to HTML and CSS when it's done

I found a few recommendations, but these two seemed to be the closest match to what I wanted:

• StaticMatic
• MiddleMan

For no particular reason I've gone for StaticMatic.

So, assuming that you have ruby and gem set up, you can get things working, by running the following commands from a terminal window:

• sudo gem install haml
• sudo gem install staticmatic
• staticmatic setup mySite
• staticmatic preview mySite

At this point you should be able to go to http://localhost:3000 and see the default staticmatic page.

Now that the site is up and running we can change it a bit. By default the main files are:

• src/layout/application.haml - The default template, page content replaces "=yield"
• src/pages/index.haml - Default index content
• src/stylesheets/application.sass - Default stylesheet

As you change the Haml and Sass files in mySite/src the site should update dynamically.
Once you've got things looking how you like run "staticmatic build mySite" to build the html and css files under mySite/site which you can then upload to your live site.