Virtual Host Configuration in XAMPP

Using virtual hosts is much easier for development systems than using the default alias “project” style. Having a URL such as http://example.dev/index.php instead of http://localhost/example/index.php is much clearer, works better with some website “extensions” involving paths and routing, and stored passwords are much easier to manage in browsers. Let’s face it, it’s just better all around. 🙂

Follow these simple steps and you should be up and running with an easily duplicable configuration for XAMPP.

Install XAMPP & Configure Control Panel Specifics

Screen Shot of XAMP Control Panel — Add editable files here that you’ll be consistently working on when adding new domain name-based virtual hosts to your Apache configuration. Optionally, add the `hosts` file if you have the file permissions properly set so you can edit it.

Default installation should work fine. I’m running mine in Windows, so the control panel looks like this. It’s probably a good idea to add extra/httpd-vhosts.conf and extra/httpd-ssl.conf, since you’ll likely be opening those files.

Configure XAMPP

Generally, there are three (3) steps that you’ll do to configure initially, with two (2) files you’ll be constantly updating as you add new virtual domains. The line changes might be different than what’s shown here. It’s no biggie, though: Simply find the relevant line and make the necessary edits.

Activate Modules in httpd.conf

    LoadModule rewrite_module modules/mod_rewrite.so
    LoadModule log_config_module modules/mod_log_config.so

Activate Virtual Host Settings in httpd.conf

    #Listen 12.34.56.78:80Listen80<VirtualHost*:80>

Comment out directory information:

    #DocumentRoot "E:/xampp/htdocs"
    #<Directory "E:/xampp/htdocs">
    ...

Be sure to close the VirtualHost directive before the file includes:

    </VirtualHost>

    # Supplemental configuration
    #
    # The configuration files in the conf/extra/ directory can be 
    # included to add extra features or to modify the default configuration of 
    # the server, or you may simply copy their contents here and change as 
    # necessary.

    # Server-pool management (MPM specific)
    Include conf/extra/httpd-mpm.con

Configure Extra Virtual Hosts Configuration File

After making the previous changes to Apache’s base-level conf file, you can work with the vhost extra conf file.

    <VirtualHost *:80>
        ServerAdmin webmaster@myexamplesite.dev
        DocumentRoot "C:\Users\JHaas\Documents\Projects\MyExampleSite"
        ServerName myexamplesite.dev
        ServerAlias myexamplesite.dev
        ErrorLog "logs/myexamplesite.dev-error.log"
        CustomLog "logs/myexamplesite.dev-access.log" common

        <Directory"C:\Users\JHaas\Documents\Projects\MyExampleSite">
            Options Indexes FollowSymLinks
        AllowOverride all
        Order Deny,Allow
        Deny from all
        Allow from 127.0.0.1
        </Directory>

        DirectoryIndex index.html index.php
    </VirtualHost>

Editing /etc/hosts

Finally, you edit the /etc/hosts file. This file is helps your system bypass the need for a DNS query, allowing you to create your own TLD (top-level domain) suffix such as *.dev, or anything that isn’t going to collide with current new top-level domain suffixes (*.me used to be quite popular until that suffix itself became a TLD suffix).

The localhost entry is not required, and from my experience has actually caused problems if uncommented, so leave it commented out if it is already. If you see that localhost is not commented out (depending on your platform), be sure to leave it so. Changing the localhost entry from default can cause issues for many network services if it’s changed. Note that chrome has an issue with using *.local, so it’s probably best to avoid using this TLD suffix.
```
    127.0.0.1   localhost
    127.0.0.1   myexamplesite.dev
```