Why Setup Virtual Host:

Setting up a virtual host allows you to use an alias name for your localhost. We can set up multiple hosts as per our needs so that each local website can be accessed through a specific name.

let’s say your site resides in “http://localhost/site1” and you want to load all the assets. There is always an issue when we follow the traditional steps like creating a folder inside “..\xampp\htdocs\site1”. This is the place where we used to place our hosting site in Windows, and always get an issue when they want to fetch any file resides in those directories.

In this case, the URL becomes “http://localhost:8012/site1/sites/default/files/image.jpg”. Due to an invalid path, files become inaccessible and as a result, they won’t get loaded in the page.

Steps for creating Virtual Host

Step 1:

Open httpd.conf file present in C:\xampp\apache\conf\httpd.conf
Remove the #(hash) sign present to include the “httpd-vhosts.conf” file in httpd.conf file.


# Virtual hosts
#Include conf/extra/httpd-vhosts.conf

To


# Virtual hosts
Include conf/extra/httpd-vhosts.conf

Step 2:

Create a virtual host file. Open “httpd-vhosts.conf” file. And copy the below lines of code. 

 <VirtualHost *:80>  
 ServerAdmin webmaster@localhost.com  
 DocumentRoot <PATH_TO_PROJECT_DIRECTORY_HERE>  
 ServerName <SERVER_NAME like local.pos.com>  
 </VirtualHost>  
 Example:-  
 <VirtualHost *:80>  
 DocumentRoot "D:\Xampp\htdocs\stage-blog"  
 ServerName caa.fairandlovelyfoundation.in  
 </VirtualHost>
Replace PATH_TO_PROJECT_DIRECTORY_HERE & SERVER_NAME with appropriate values, Save the file.

Step3:

Open C:\Windows\System32\drivers\etc\hosts

Add the below line at the end of the file.

 127.0.0.1   <SERVER_NAME like local.pos.com>  
 Example:-  
 127.0.0.1 www.example.com

Restart the apache server and visit the site URL.

That’s all is needed to set up a virtual host.