How to Configure Virtual Host in XAMPP on Windows 10

Most of the developers start the projects in their local development environment. If you are working with Magento, Drupal, WordPress etc.  you may need virtual hosts to setup, in order to work the test sites properly. When you use virtual hosts each and every links looks very unique, and similar to the main website URL.

So today’s tutorial we are demonstrating how to configure virtual host in XAMPP server in Windows 10.

Step #1

Go to the XAMPP installation folder and navigate to C:\xampp\apache\conf\extra. Most of the installatoins will be in the mentioned path, but some of the users opt for a different drive.

Step #2:

Open the file called httpd-vhosts.conf, and there you will find a lot of configuration options, most of them will  be commented out. Do not touch on that lines, just add the below config in the bottom of file.

I just used a configuration lines that I used for Magento 2 development website.

<VirtualHost *:80>
    ServerName m2.staging.com
    DocumentRoot "C:\xampp\htdocs\websites\labs\m2"    
    <Directory "C:\xampp\htdocs\websites\labs\m2">
        DirectoryIndex index.php
        AllowOverride All        
        Allow from all
    </Directory>
</VirtualHost>

Step #3

Next, you need to update the hosts file, navigate to the following folder C:\Windows\System32\drivers\etc, and open hosts file, and add the below line in it.

Step #4 :

Now, enter the url in the browser and there you go with the new website.

You can add multiple virtual hosts in XAMPP, just add one more entry in the virtual hosts file from the step #2, and point a different ServerName and DocumentRoot. It is as simple as that.