The Mac is a great platform for website development. You keep each site that you’re working on in a separate folder in your ~/Sites folder. You edit and debug them locally and then, when everything’s good to go, you just ftp the files up to your live server, or commit your changes to your svn repository. Easy.

But eventually you may want to use server-side includes (SSI) to generate standard headers or footers on your pages. SSI are probably readily available on your webhost’s server, but to get them working on your Mac requires one small step: you have to configure Apache to activate a virtual server for each of your sites. Don’t panic; it’s easy to do.

Let’s say you have a site installed at ~yourname/Sites/project1. And let’s say the site’s pages have a standard footer, which is contained in the file ~yourname/Sites/project1/includes/footer.html. You’d like to be able to put the following SSI line in every file on your site:

<!–#include virtual=”/includes/footer.html” –>

Trouble is, the server interprets that path as relative to the DocumentRoot setting in your Apache configuration. On the Mac, the default setting (in /etc/httpd.conf) is

DocumentRoot “/Library/WebServer/Documents”

So when you load a page from the site, the server looks for your footer in /Library/WebServer/Documents/includes/footer.html. Since that’s not where your footer lives, you’ll probably just get this unhelpful error:

[an error occurred while processing this directive]

You could move your includes into /Library/WebServer/Documents, but that’s a supremely bad idea; you’ll soon go crazy keeping track of all your files scattered across the filesystem. Instead, take 2 minutes to do things properly, by setting up a virtual host on your Mac. This will allow you to set the DocumentRoot for each of your web projects. Here’s how:

  1. Open Terminal and type: cd /etc/httpd/users.
    You should see a file in there with a name like yourname.conf where “yourname” is your Mac user name.
  2. Type sudo vi yourname.conf and enter your password, if asked.
  3. Insert the following lines at the end of the file

    NameVirtualHost 127.0.0.1:80
    <VirtualHost project1>
    ServerName project1
    DocumentRoot /Users/yourname/Sites/project1
    </VirtualHost>

    (If you have more sites, just add more <VirtualHost> blocks.)

  4. Save and quit (type :wq)
  5. Restart Apache: sudo apachectl graceful
  6. Finally, edit your hosts file (sudo vi /etc/hosts) and insert the following lines at the end:

    127.0.0.1 project1

    (If you have more sites, just add more lines in that format. For example, 127.0.0.1 project2, etc.)

  7. Now point your browser to http://project1 and your SSI include files will be correctly displayed.