The Websites

Now it’s time to make a choice. Earlier, we looked into the /Library/WebServer/ path and found a folder called ‘Documents’. Think of that ‘Documents’ folder as your website. This is where all of the files, folders, images, the code etc., will be placed and when you type into your browser address bar:

http://127.0.0.1

It is from this folder that Apache will return the requested data.

But as I said right at the beginning, it is possible to run multiple websites on your local machine and it is also possible to give them a better name to use. Let me explain my setup to help make this clearer.

Firstly, because we have multiple machines at out house all networked and using a wifi connection, my machine has it’s own IP address. I assign IP addresses to our machines instead of using DHCP to do it for me so that
I can use the machine as a server and run the sites on it from any other machine in the house - including a Windows PC which enables me to easily see how things look in IE.

Because I want to make exact replicas of my public websites so that I can work on plugin code, themes etc., without visitors to my site seeing stuff half-baked, I do not make use of the ‘Documents’ folder that Apple have set up for me. You can, in fact, place your website files anywhere on your disk and then just tell Apache where to go look for them.

I also want to run my local based sites by name. But I can’t, for example, use www.yellowswordfish.com because a browser request for that is going to go get the real thing. So I rename, replacing the .com with .dev which allows me to see both sites and also reminds me which one I am looking at by the address in the browser bar.

Setting Up Virtual Hosts

To do this, we need to set up what are called Virtual Hosts and for this I will use my own site names as a guide. It means making small edits to three of those hidden files.

First though, we need to decide where the sites will reside on my disk. I use the /Library/WebServer folder (why not?) and define a new folder for each website I want to construct. So, along with the ‘Documents’ folder that is already there I have defined one called ‘yellowswordfish’ and one called ’stuff’ where my local sites will reside.

The first hidden file we need to edit is the same one we edited before at:

(YourHardDisk)/private/etc/apache2/httpd.conf

Open it up in your plain text editor and scroll almost to the end. Here you will find a long list if ‘includes’. Prior to Apache 2, Virtual Host settings were stored in the httpd.conf file but with 2 they can be included. Apple have provided both the include and an empty file for the purpose but like php earlier, it is commented and not loaded. Find the entry:

# Virtual hosts
# Include /private/etc/apache2/extra/httpd-vhosts.conf

remove the hash from in front of the word ‘Include’, save and close the file. You can see that the line we have just made available is actually the path to a file named ‘httpd-vhosts.conf’ and this is the one we are going to open and edit next.

Everything in the default ‘httpd-vhosts.conf’ file should be commented with asterisks. If it is not then it is a good idea to do so before we add our own definitions. Shown below are the entries from my own file that set up the two website clones mentioned above:

NameVirtualHost *:80

# Override the default httpd.conf directives.  Make sure to
# use 'Allow from all' to prevent 403 Forbidden message.
<Directory />
	Options ExecCGI FollowSymLinks
	AllowOverride all
	Allow from all
</Directory>

<VirtualHost  *:80>
	DocumentRoot "/Library/WebServer/stuff"
	ServerName www.stuff.yellowswordfish.dev
</VirtualHost>

<VirtualHost  *:80>
	DocumentRoot "/Library/WebServer/yellowswordfish"
	ServerName www.yellowswordfish.dev
</VirtualHost>

The first <Directory> block opens permissions as Apache is delivered tightly battened down! The second two blocks tell Apache where to look when it receives a specific url request from the browser.

You can see that the ‘DocumentRoot’ setting is the path to the folders I set up above and the ‘ServerName’ is the actual name I wish to use to access the website. Using this method, it becomes obvious that your Apache and Mac can host as many websites as you choose to set up!

If you plan on following this method, simply copy and paste the above and then replace the path and name as appropriate. When you have finished, save and close the file.

Which leaves one more hidden file to edit and this is the ‘hosts’ file - a list of the address and sites. This can be found at:

(YourHardDisk)/private/etc/hosts

(Note that this file has no extension).

You need to add your new website(s) to the bottom of the hosts list in the format:

IP-address tab site-address

Mine looks like this:

192.168.0.20 www.stuff.yellowswordfish.dev
192.168.0.20 www.yellowswordfish.dev

If your machine does not have a static network IP address then use 127.0.0.1 instead.

When you have added your site(s), save and close the file.

Now it’s time to add WordPress itself.

Next: Installing WordPress