Using virtual hosts in XAMPP

3 min readFeb 8, 2021

Have you been using XAMPP for a while and every time you want to access your project you’ll do one of the following:

used the default URL and went to the directory of your project like localhost/my-project-folder
changed Apaches httpd.conf file by editing the DocumentRoot and Directory to match your project folder

If that’s you’re case then you’re in luck ‘cuz there’s a more sophisticated way of doing so that’ll let you have as many domain aliases for all your projects as you’ll need just in four steps.

1. Setting up a local alias for our new domain

First you’ll need to set up a new entry in the hosts file located in c:\Windows\System32\drivers\etc\ to let your system now where to go when asking for that specific domain.

Let’s do so by specifying the local loopback IP address for our new alias which will let the system now that this domain is being hosted locally.

# our localhost virtual hosts
127.0.0.1       my-domain.com

N.B.: The hosts file is protected under the admin rights. Instead of changing it’s content directly let’s create a copy of that file somewhere else on your PC and change the content of that file. Once you’re done save the changes and copy this file back changing the original file with admin rights.

Your hosts file should now look somewhat similar to this:

# Copyright (c) 1993-2009 Microsoft Corp.
#
# This is a sample HOSTS file used by Microsoft TCP/IP for Windows.
#
# This file contains the mappings of IP addresses to host names. Each
# entry should be kept on an individual line. The IP address should
# be placed in the first column followed by the corresponding host name.
# The IP address and the host name should be separated by at least one
# space.
#
# Additionally, comments (such as these) may be inserted on individual
# lines or following the machine name denoted by a '#' symbol.
#
# For example:
#
#      102.54.94.97     rhino.acme.com          # source server
#       38.25.63.10     x.acme.com              # x client host# localhost name resolution is handled within DNS itself.
127.0.0.1       localhost
::1             localhost# our localhost virtual hosts
127.0.0.1       my-domain.com

N.B.: If this is your first time editing the hosts file it’s possible that localhost entries will be commented out. Be sure to uncomment them by removing the ‘#’ sign at the beginning of each line.

2. Adding a new virtual host

Once we have our domain alias it’s time to set up a virtual host for that domain. Head to your XAMPP install folder (c:\xampp\ by default) and go to .\apache\conf\extra\ where you’ll see the file httpd-vhosts.conf. Open that file and at the end add the following:

<VirtualHost my-domain.com:80>
  ServerAdmin example@domain.com
  DocumentRoot "c:/xampp/htdocs/my-domain-com"
  ServerName moje-domena.cz
  ServerAlias moje-domena.cz
  ErrorLog "logs/my-domain.com.com-error.log"
  CustomLog "logs/my-domain.com.com-access.log" common  <Directory "c:/xampp/htdocs/">
    Options Indexes FollowSymLinks MultiViews
    AllowOverride all
    Order Deny,Allow
    Allow from all
    Require all granted
  </Directory></VirtualHost>

If you’ll want to use a custom path for your project folder located elsewhere than under the XAMPP you’ll need to change the DocumentRoot value to be your project folder with absolute path and the Directory to match your project folder parent directory.

N.B.: By specifying the Directory we’ll avoid the possible 403 Access Forbidden Error that could occure otherwise (mostly while using other than the default htdocs folder).

3. Create the index.html file

Under your project root folder (e.g. c:\xampp\htdocs\my-domain-com\) create a simple index.html showing the mainstream “Hello world!” message.

<!DOCTYPE html>
<html lang=”en”>
<head>
  <meta charset=”utf-8">
  <title>My domain</title>  <!-- <link rel=”stylesheet” href=”css/styles.css?v=1.0"> -->
</head>
<body>  <h1>Hello world!</h1>  <!-- <script src=”js/scripts.js”></script> -->
</body>
</html>

4. Boot up your browser and head to your domain

Accessing the URL http://my-domain.com/ should give us the content of our index.html file as a sign of success.

You can now specify your own virtual host a custom domain alias of your every project. It’ll be easier when it comes to using .htaccess but also when it comes to managing your projects on your PC in general since you’re just now one URL away form your project whenever you’ll boot up XAMPP. 🎉

Using virtual hosts in XAMPP

1. Setting up a local alias for our new domain

2. Adding a new virtual host

3. Create the index.html file

4. Boot up your browser and head to your domain

Written by Michal Tuček