1. Enable VirtualHosts
Open the file “httpd.conf” which locate at:
/Applications/XAMPP/xamppfile/etc/httpd.conf by Textwrangler or other text editor.
Look for the following lines:
# Virtual hosts #Include /Applications/XAMPP/etc/extra/httpd-vhosts.conf
Uncomment the second line by removing the hash (#), so that Apache loads your custom VirtualHosts configuration file:
# Virtual hosts Include /Applications/XAMPP/etc/extra/httpd-vhosts.conf
2. Add Your Custom VirtualHosts
Open the file /Applications/XAMPP/xamppfile/etc/extra/httpd-vhosts.conf.
At the bottom of the file, add ‘localhost’ as the default named VirtualHost:
# localhost
<VirtualHost *:80>
ServerName localhost
DocumentRoot "/Applications/XAMPP/htdocs"
<Directory "/Applications/XAMPP/htdocs">
Options Indexes FollowSymLinks Includes execCGI
AllowOverride All
Order Allow,Deny
Allow From All
</Directory>
</VirtualHost>
After you add the default localhost. Now you can add your own virtualhosts
# mysite.local
<VirtualHost *:80>
ServerName mysite.local
DocumentRoot "/Users/phichamon/Public/mysite/"
<Directory "/Users/phichamon/Public/mysite/">
Options Indexes FollowSymLinks Includes ExecCGI
AllowOverride All
Order Allow,Deny
Allow From All
</Directory>
ErrorLog "logs/mysite.local-error_log"
</VirtualHost>
In the example you can replace “mysite.local” with your own hostname.
3. Edit hosts file
Once you’ve saved your httpd.conf and httpd-vhosts.conf files, the next step is to edit your OSX hosts file by open the Terminal instance, and at the prompt type the following command:
sudo nano /etc/hosts
Enter your OSX password when prompted, and the hosts file will be opened in the nano text editor. You’ll see that the hosts file already contains some default hostname mappings (e.g. “127.0.0.1 localhost”). Use your keyboard’s arrow keys to navigate to the bottom of the file and add your own mapping:
# XAMPP VirtualHost mappings 127.0.0.1 mysite.local
4. Restart Apache
So that your changes take effect, restart Apache. This can be done using XAMPP Control, which is found at /Applications/XAMPP/XAMPP Control.app.
Point your browser at http://mysite.local (or whatever ServerName you chose) and you should see your website.
if you have error about server error you can fix by change the file permission by add the following command on terminal.
chmod 755 /Users/phichamon/Public/mysite/ or sudo chmod -R 755 /Users/phichamon/Public/mysite/

