Setting Up Virtual Hosts With Apache on Mac

Pinterest LinkedIn Tumblr
  1. Add Your Local URLs to Your Hosts File
    The next step is to direct your local URLs to your localhost by adding them to your hosts file, which is located here on a Mac:
sudo nano /etc/hosts

Go ahead and edit it using your favorite text editor and add all your local development sites like this: first.local second.local third.local

Note, I decided to switch to the “.local” top-level domain for my local dev sites. You can choose whatever you want, but don’t use “.dev”, as that has been reserved for other purposes and won’t work in most browsers (I learned this the hard way back when I was using Desktop Server).

  1. Add Your Local URLs to Your httpd.conf File
    Now you have to tell Apache which directory to use for each URL. If you’re familiar with Apache, you know this happens in the httpd.conf file. You can find it here on MAMP for Mac:

Now, you can edit it directly, or do what I did, which is edit the httpd-vhosts.conf file in the “extra” directory here:

sudo nano /Applications/MAMP/conf/apache/extra/httpd-vhosts.conf

If you do this, make sure that your main httpd.conf file includes the httpd-vhosts.conf file. In httpd.conf, find this line and make sure it’s uncommented:

Now, for each domain name, add an entry to connect it to the appropriate directory path on your computer like this:

<VirtualHost *:80>
  DocumentRoot "/Users/username/projects/first"
  ServerName first.local

<VirtualHost *:80>
  DocumentRoot "/Users/username/projects/second"
  ServerName second.local

<VirtualHost *:80>
  DocumentRoot "/Users/username/projects/third"
  ServerName third.local

Remember to change the DocumentRoot URL to the appropriate path to your sites on your computer.

I also added this entry so I could access the project root through a browser:

<VirtualHost *:80>
  DocumentRoot "/Users/username/projects"
  ServerName localhost

Save the file. If you were editing your httpd.conf file directly, you’re done with this step.

  1. Set AllowOverride in Your httpd.conf File
    After I did these steps (and doing a search and replace on my site’s database to update the URLs), I got the site to resolve, but permalinks were not working. Basically, the home page would show up, but I couldn’t access any posts or pages.

The solution is to go back into your httpd.conf file and search for “AllowOverride”. Once you find it, set it to “All” like this:

<Directory />
    Options Indexes FollowSymLinks
    AllowOverride All
  1. Save and Restart MAMP
    Save all of the changes to your httpd.conf files, then re-start MAMP. You should be able to access your local dev sites through the new URLs! If it doesn’t work, add “http://” to the beginning of the URL.

Note, if you’re running local WordPress sites, you’ll need to do a search and replace on the database to update the URLs.


Write A Comment