All Forces

Design, Music & Mac Geekery

WordPress on Mac Part 2: Sub-Domains

47 Comments
by Melvin Rivera
Updated: Oct 17th, 2009

This guide will help you run WordPress(the blog app that runs this website) in your own personal Mac for testing purposes or for backing up your blog. On WordPress on Mac – Part 1: PHP & Mysql we covered installing PHP and MySQL. On part two we’ll cover setting up local sub-domains. What is a sub-domain and why do I need one? Sub-domains are websites with absolute URLs that are accessed via a prefix to the url i.e.the server mail.earthlink.net is a sub-domain of earthlink.net. Why do I want to do this locally? Because it will make it possible to mimic your website structure locally. In other words, it’s all about file paths. If you set it up your images and link will work, if not, you’ll have broken links and images.

WordPress on sub-domain


Step 1: Setting up Apache

Apache comes as part of Mac OS X and it can be easily activated by the click of a button. However there are a few tweaks we need to do to Apache before we can use it for WordPress. To modify the Apache settings we need to edit some configuration files that are in some hidden folders. Now here a nerd will tell you to open the command line and edit the files in some DOS looking environment. But since we’re not nerds here, just cool geeks, we’ll use the free text editing application Text Wrangler which allows you to edit hidden text files and takes care of file permissions when saving.

Download Text Wrangler.

Text Wrangler

User Apache file

First we’ll edit your apache user file so that we can use ModRewrite in WordPress. ModRewrite is what translates search friendly URLS to the true url. From Text Wrangler, select “File > Open Hidden…” , make sure you enable “All Files” and navigate to the folder “etc/httpd/users/” then open the file of the current logged in user. In my case it’s “melvin.conf”.

Open Hidden File

Open Apache User File

Apache User File

Comment out these lines within the directory lines by adding the # symbol at the beginning of the lines:

#Options Indexes MultiViews
#AllowOverride None

Then Add the following lines

AllowOverride All
Options Indexes MultiViews ExecCGI FollowSymLinks Includes
Order allow,deny
Allow from all

Close the file.

Mod-Rewrite Log

Now we’ll specify where to log any errors for Mod Rewrite. From Text Wrangler, select “File > Open Hidden…” and navigate to “etc/httpd/httpd.conf”. Go to the end of the file and add the following code:

Open Apache Config File

Rewrite Log

# begin custom edit
# mod_rewrite
RewriteLog /var/log/httpd/rewrite.log
RewriteLogLevel 9
#end custom edit

Keep the file open for the next step.

Local Sub-Domains

Next we’re going to set up a local sub-domain. This will allow our site URl to be “http://blog.localhost” instead of “http://localhost/~username/blog”. A local sub-domain will allows us to set up our local blog in the same way we would if we had it hosted at a public server. For example we use absolute URLs like ‘/images/header.jpg’ and that code will work on both local or public servers. It also makes for a very short and manageable URLs.

From Text Wrangler, add the following code after the Rewrite segment we just added but before the “#end custom edit” line.

Virtual Hosts

# virtual hosts
NameVirtualHost 127.0.0.1

# localhost

ServerName localhost
DocumentRoot /Users/melvin/Sites/

# wordpress.localhost

ServerName wordpress.localhost
DocumentRoot /Users/melvin/Sites/Projects/wordpress

# change the sub-domain name to your desired sub-domain name
# change to the name of your home folder
# change to the path of your project folder from the Sites folder

The first part will link “localhost” to your personal “SItes” folder. The second part is to specify the sub-domain. In this case I want the sub-domain “http://wordpress.localhost/” to test a custom version of wordpress, however you can rename this to whatever you want. Replace the path of DocumentRoot to the path to your site. In my case I put all my projects in a folder called Projects in the Sites folder in my home folder. For this example I am using the folder name wordpress but you can rename it according to your project name. Repeat this second block for each sub-domain needed.

Close the file.

Hosts File

Next we’ll add the sub-domains to the list of hosts. From Text Wrangler, select “File > Open Hidden…” and navigate to “etc/hosts”. Add the following line to the list. Make sure you specify the same sub-domain you did in the previews step:

Open Hosts File

Add Hosts

127.0.0.1 wordpress.localhost

Restart the Apache Server

From the Finder select ‘Apple > System Preferences > Sharing > Services’ and Start ‘Personal Web Sharing’. Quit System Preferences.

Restart Apache

Now point your browser to http://wordpress.localhost or whatever sub-domain name you chose.

Not Found Error

If you don’t have anything in the folder you specified in the previews step you will get this 404 Not Found Error. This means it’s working. You can move any html files to that folder for testing. Or as we’ll do in the next Step of this tutorial, download WordPress and place the files on that folder.


47 Comments

  • Jon Trainer says:

    Nice set of articles. Thanks for putting this together. It’ll work as a nice reference for getting all this worked out for local development and testing.

  • nga says:

    sorry, i don’t have the time to write more — but to make it short: there is a much easier way to get wp or any other php/mysql thing running on a mac : MAMP (= Macintosh, Apache, Mysql and PHP). It’s a very easy solution — you don’ need any configuration. A user (James) at macupdate about it: «Drag a single folder to your applications folder, [that's it!] […] Note : it leaves the standard mac os X apache alone – so php will only work when ynu access the pages on the port 8888 (that is the default for MALP but im sure it is easy to change to 80 if you wish) webpages go in a sub folder in the same folder»

  • nga,
    the way i described to install php and mysql is by the use of two installers. the configuration files need to be edited for specific features that would make it possible to mimic a public website. specifically sub-domains and mod-rewrite.

  • I’m using Apache 2, and a separate install of php ect.
    But unfortunatly adding a sub domain doesn’t work :(
    Changing the folder standard folder does work:
    # localhost

    ServerName localhost
    DocumentRoot /Users/justin/Sites/

    but this:
    # test.localhost

    ServerName test.localhost
    DocumentRoot /Users/justin/Sites/test/

    doesn’t :(

    do you know what is wrong?
    Its probably got something to do with not being able to add
    127.0.0.1 wordpress.localhost
    cause the hosts file doesn’t seem to exists on apache 2

    Can anyone save my day?? plz :)

  • ok scrap that :)
    if you want it to work just add it to the regular hosts file then it will work.
    (the one in etc/ )

  • iGav says:

    Great set of articles. Have only just started dipping my toe in the water of WordPress by downloading and installing – nice to see there are some articles around by and for other OS XC users

    Looking forward to the rest in the series

  • Oh wait this is great!
    I now use the real url of the sites but instead of .com or something else I use .x

    Its very easy
    just add stuff like this:
    127.0.0.1 test.x

    # test.x

    ServerName test.x
    DocumentRoot /Users/myusername/Sites/test/

    Very very very easy and it saves me typing localhost everytime

  • little problem, here, Melvin. My httpd.conf file only goes up to line 118, and when I do a search in the file for “# begin custom edit,” it comes up blank.
    whatsup?

  • Zach, you are doing good. I added the “#begin custom” part at the end of the document. it was not there before.

  • ohhhhhh. duh. i feel like a monkey, it’s right there…. “Go to the end of the file and add the following code:”
    sheesh. Great tutorials, melvin, hopefully I’ll read them a little closer ; )

Leave a Reply


Contact Me