loader

How to Setup a Custom Domain Name for a Localhost project (Windows 10)


Want to access your localhost project via a domain, something like, mywebsite.test?


There are few benefits in doing so.

  • First you won’t have to type the full path (something like http://localhost/mywebsite/).
  • Second if your project is in a subfolder, you could route the domain directly into the subfolder. For example, if your project is located in htdocs/folder/example/ you could route the domainexample.test to that specific subfolder.
  • You get the idea. There are a number of things you can accomplish better with this.

This article assumes you are running on Windows 10 and Running XAMPP. It might work differently for other platforms or different versions of those platforms.

Step 1

Open this folder in your file explorer:

C:\Windows\System32\drivers\etc

Step 2

There is a file called "hosts". Double click on the file to open it. If it asks you to choose a program to open it, choose Notepad.

Step 3

Scroll to the bottom end of the file and add the following:

127.0.0.1 example.test

Notes:

  • is your localhost address(127.0.0.1), followed by the domain name that you want to use(example.test).
  • You can use any extension(.test .mywork .anything). Do not use common extensions (such as .com, .net, .io, etc), otherwise it will conflict with your access to internet.

Step 4

Next Click on Save (Windows Shortcut CTRL+S) to save the file. For “Save Type As” select ‘All Files’. There will be a popup window asking you if you want to replace the file. Click "Yes"

If you get a windows message prompt saying that you don’t have the right administrator permission/permissions to replace the file. If you do, Go to step 4.1 , if not skip to Step 5

Step 4

In your computer search bar, type “notepad”. Right click on notepad and run as administrator.

Copy the contents of hosts file that we opened in step 3 and paste the content into the notepad file that you opened as an administrator.

Click “Save As” on the new notepad. For “Save Type As” select ‘All Files’. On the Save Windows go to the following folder:

C:\Windows\System32\drivers\etc

You will see a file on top called “hosts”. Select the file and it will prompt “file already exists, do you want to override the file?”, to which you must select yes.

Step 5.

Go to

C:\xampp\apache\conf\extra

Double click to open a file called “httpd-vhosts”. If it asks you to choose a program to open it, choose Notepad.

Step 6.

Scroll to the bottom end of the file and add the following:

<VirtualHost *:80>
DocumentRoot "c:/xampp/htdocs/example/"
ServerName example.test
<Directory"c:/xampp/htdocs/example/">
</Directory>
</VirtualHost>

You should replace "c:/xampp/htdocs/example/" with any folder location of where your project is. Example if it is in a subfolder then add the subfolder “c:/xampp/htdocs/folder/example/"

ServerName (example.test) should also be replaced your chosen domain name. Note it must be the same domain name that you used in Step 3.

Restart your xampp. (Stop & Start the apache service).

Type your added domain (in my case it was example.test) into the browser and you are good to go.


About the Author


Shavkat

Suggested Articles