My site look perfect from localhost, but not from the internet. Why can’t I see styles and pictures on my website?
The quick answer is that all of your generated links in the HTML source of the page are still using address “localhost”…
Fix Local Resolve
Load your website in a Browser (Chrome, IE, Firefox) from outside, right click on the page, and select ‘View Page Source’, and you will see that all links to the CSS (style) and Graphic content (images) are either:
- Of the form http://localhost/ or http://127.0.0.1/ or http://192.168.0.xxx/
- Or using a domain name that is made up or does not have proper global DNS set up.
None of these locations/URLs are reachable from outside. They are only reachable from the server (i.e., the local system), and/or possibly only within the LAN.
You have to use a working domain name for the website [that is not localhost (127.0.0.1) nor the LAN IP].
The domain name should resolve to the public IP address of the server, and all requests to that IP address should be properly routed and unrestricted to the server.
This could also be a webapp issue – for example, with WordPress originally installed on localhost, you’ll need to go into WordPress Setting, General Tab, and change the “wordpress address” and “site address” to something other than “localhost” (e.g., to an address that can be reached from outside).
When you test your website from outside, make sure to hard-refresh the page (in your Browser) by pressing Ctrl-F5 so everything is reloaded each time and you don’t get cached pages and old results.