View my basket

Install and configure XAMPP on a Mac

Learn how to install XAMPP on a Mac so it can host multiple localhost WordPress sites simultaneously.

The first thing to do is download the correct version of XAMPP. If you’re not sure which version to download, get “the middle one”. So if PHP 8.0, PHP 8.1 and PHP 8.2 are the options, download the version that includes PHP 8.1.

The installer for Mac doesn’t have many options, so just accept the defaults and run through to the end of the wizard.

Download different XAMPP versions for Mac
Mac XAMPP/PHP versions

Windows or Ubuntu?

How to install XAMPP on Ubuntu
How to install XAMPP on Windows

After it’s finished, you can launch the XAMPP Control Panel by going to Applications > XAMPP and running “”.

The XAMPP Control Panel launcher on Mac
Launch the XAMPP Control Panel from /Applications/XAMPP

Configure host name lookups

Whenever your computer tries to convert a host name into an IP address, it checks a local file called “/etc/hosts” before it checks DNS. So we can add custom host name lookups in this local file and call the anything we want.

Open a terminal window and type the following to edit your system’s “/etc/hosts” using nano (as administrator):

# Edit the local hostname lookup file: /etc/hosts
sudo nano /etc/hosts

…then add the following lines to the end of the file to define some custom host-name lookups. These names are just examples – you can give them any names you want.

# XAMPP Development Sites
#    scratch.localdev    my-client.localdev    local-shop.localdev    another-shop.localdev

Press CtrlO to save the changes.

Press CtrlX to exit nano and return to the command-line shell.

Edit /etc/hosts on a Mac
Edit the /etc/hosts file as administrator, on a Mac

Test these have worked by pinging one of the host names from the terminal, like this:

# Ping one of our custom host names
ping scratch.localdev

You should see responses from “” (localhost), like this:

64 bytes from localhost ( icmp_seq=7 ttl=64 time=0.043 ms
64 bytes from localhost ( icmp_seq=7 ttl=64 time=0.043 ms
64 bytes from localhost ( icmp_seq=7 ttl=64 time=0.043 ms

Press CtrlC to stop the ping command.

Check/Adjust Apache’s core config

We need to check, and maybe adjust, Apache’s core configuration file to make sure the vhosts (Virtual Hosts) sub-configuration is enabled.

If the XAMPP Control Panel isn’t already running, start it now. Select the “Apache Web Server”, click “Configure”, open the “Conf” file and find the line, # Virtual Hosts. The line that comes after it should read Include etc/extra/httpd-vhosts.conf. If that line is commented-out (i.e. if it starts with #), remove the # and save the file. Exit Text Editor.

Enable Virtual Hosts on Mac XAMPP
Enable the vhosts sub-configuration in XAMPP

In Finder, navigate to Applications > XAMPP > etc > extra and open “httpd-vhosts.conf” in Text Editor. This is where we tell Apache about our individual virtual hosts. Delete all the text in the file (it’s just comments and examples), replace it with the following, save the changes then exit Text Editor.

# XAMPP virtual host definitions
# /Applications/XAMPP/etc/extra/httpd-vhosts.conf

# All our websites are stored in sub-directories under here.
<Directory "/Applications/XAMPP/vhosts">
    AllowOverride All
    Require all granted

# Each site needs a ServerName that matches an entry in /etc/hosts
<VirtualHost *:80>
    ServerName scratch.localdev
    DocumentRoot "/Applications/XAMPP/vhosts/scratch.localdev/htdocs"
    ErrorLog "/Applications/XAMPP/vhosts/scratch.localdev/log/error.log"
    CustomLog "/Applications/XAMPP/vhosts/scratch.localdev/log/access.log" common

<VirtualHost *:80>
    ServerName my-client.localdev
    DocumentRoot "/Applications/XAMPP/vhosts/my-client.localdev/htdocs"
    ErrorLog "/Applications/XAMPP/vhosts/my-client.localdev/log/error.log"
    CustomLog "/Applications/XAMPP/vhosts/my-client.localdev/log/access.log" common

We’ve set up two virtual hosts in here, “scratch.localdev” and “my-client.localdev”. Each ServerName entry needs to match a host name from “/etc/hosts”, then we just specify the paths for the PHP/HTML files (DocumentRoot), and the two log files.

Now we just need to create the folders for the virtual hosts.

Go back to the terminal window and enter the following:

# Create a vhosts folder and move it into /Applications/XAMPP/
mkdir ~/vhosts
mv ~/vhosts /Applications/XAMPP/
ln -s /Applications/XAMPP/vhosts/ ~/Websites

Open Finder and navigate to your home folder and you’ll see a new linked-folder (symlink) called “Websites”. Go into this folder and create a new folder for each host that you added to “/etc/hosts”. In each of these host folders create two sub-folders, called “htdocs” and “log”.

You should end up with a structure like this:

  • /Users/paul/Websites (link: “/Applications/XAMPP/vhosts/”)
    • scratch.localdev
      • htdocs
      • log
    • my-client.localdev
      • htdocs
      • log
symlink from Websites to XAMPP's vhosts folder
Symlink from Websites to /Applications/XAMPP/vhosts

Create a test HTML file

Next up, create HTML files in the “htdocs” folders. We’ll delete these later so they only need to be simple:

<!DOCTYPE html>

Change title and h1 so they show the name of the containing folder (e.g. “my-client.localdev”).

Enable and test

If the XAMPP Control Panel isn’t already running, launch it now. Then go to “Manage Servers” and start the Apache Web Server.

Now you can point your browser to http://scratch.localdev/ and http://my-client.localdev/ – you’ve got two local dev sites up-and-running 👍

XAMPP running multiple dev sites on Mac
Hosting multiple dev sites on a local host

Testing PHP

Create a file in “/Applications/XAMPP/vhosts/scratch.localdev/htdocs” called “info.php“, paste the following couple of lines and save it.



…then navigate to http://scratch.localdev/info.php. If you get the PHP info page, everything is working.

phpinfo() running on Mac localhost
Running phpinfo() locally

Adding more local dev sites

Adding more sites:

  1. Edit (sudo) “/etc/hosts” and the new host name (e.g. “ amazing-new-client.localdev”).
  2. Edit “/Applications/XAMPP/etc/extra/httpd-vhosts.conf” and create a new <VirtualHost *:80>...</VirtualHost> snippet, and make sure ServerName matches your new host name. Update DocumentRoot, ErrorLog and CustomLog too.
  3. In “/Applications/XAMPP/vhosts” (linked to by “Websites” in your home folder), create a subfolder with the new host name, and put two subfolders in there, called “htdocs” and “log”
  4. Put your web content into the new “htdocs” folder
  5. Use the XAMPP Control Panel to restart the Apache service

That’s it – multiple locally hosted dev sites 😎 👍

Power Plugins newsletter

Want to see more articles like this?

For the latest WordPress guides & special offers...

Leave a comment