Links break when you move your site from WAMP to your hosting service?
Three steps to set up a Virtual Host and solve those broken links when you move from WAMP to your hosting service
#1 Get oriented
- You will only able to see your WAMP based site in your browser after you have turn on your WAMPSERVER by going to Start/All Programs.
- Look where your files are stored by going into Windows Explorer or My Computer.
- Look at your C://wamp/ folder
- You will see c://wamp/www where you store all your websites (right?)
- And c://wamp/bin/apache/conf/ folder where you see a file called httpd.conf
- Look at your C://Windows/ folder
- Track to c://windows/system32/drivers/etc folder where you see a file called hosts
- Inside the httpd.conf folder, we will list Virtual Server for each (and every) site that we are developing on WAMP for later export to a hosting service
- That means you should edit this file every time you start work on a new website and clean it this file when you finish work on a website and remove it from your laptop.
- Inside the hosts file, we are going to tell Windows (as distinct from WAMP) that when it sees a reference to mysite.localhost, it should redirect/loopback to 127.0.0.1 which is the IP address of your computer (and mine when I am working on mine.)
- Windows 7 will stop you editing this file and we must work around that restriction.
- Of course, you must do this for every site you are working on and remember to clean off what you no longer need at the end of a job.
#2 Set up your Virtual Server
- Go to the httpd.conf file and open it in a text editor (Notepad or Wordpad)
- Look for the line that reads: Servername localhost :80
- Add the following text below this line. Substitute your sitename for mysitename and remember to duplicate the last four lines for each website that you are working on
- Save as httpd.conf (don’t forget the extension)
#3 Tell Windows to redirect from mysitename.localhost to 127.0.0.1
- Windows 7 will discourage you from editing the hosts file. This is your workaround.
- Go to Start and type in Notepad
- Right click Notepad and open as Administrator.
- Track to the hosts file (see #1) and open the file. You may have to change the setting from Textfiles to All Files.
- Look at the last line. It probably reads 127.0.0.1 localhost.
- Add another line reading 127.0.0.1 mysitename.localhost
- Close and save
Check you are redirecting your site successfully
- Confirm nothing is broken
- Go back to WAMPSERVER (look for the W, bottom right on the task bar)
- Select localhost
- Open your website and others too
- Confirm http://localhost/mysite still works
- Close the other tabs so there is no confusion
- Enter the link above.
- Everything still working?
- Prove your redirect works
- Shut all the tabs
- Type into the browser http://mysite.localhost
- Does your site open correctly?
Set up links that don’t break when you export your site
Now you can set up all your links without them breaking when you move your site. Hmm. . . not sure this is the last word here. I suspect the format is important.