This is a problem we may encounter when doing the restore of a production database in our local computer. We may also encounter it when developing locally, when we try to access the WordPress site from a remote computer using the ip address.

The symptoms are that the page does not display correctly: the CSS is not loaded, js files and images are missing, the theme is completely broken, and basically our site looks awful, and not at all what it is supposed to look like.

For example, take the site WordPress site I installed in my previous post about installing WordPress in Debian Stretch. If I try to access the site from a different computer in the networking using the ip, the site will look like this:

site not loading CSS
hey, where did all the CSS go?

The reason that this happens is that the WordPress internal URLs pointing to resources like CSS, images, etc are pointing in that case to localhost. So when I try to access an url using the ip all kind of bad stuff happens.

A quick fix for our freshly created TEST sites

Now if we have installed WordPress locally to serve as a test site for themes/plugins, etc we can fix that in a very easy manner.

Go to WordPress administration menu > general

In General Settings update the WordPress Address and Site Address to use the IP of the computer instead of localhost:

wordPress urls configuration
replace localhost by your ip address

After we save the changes, the site will display correctly.

Update the machine Host configuration file to work with the desired ip

If we are having that trouble because we are working with the backup of a real WordPress site, or if the WordPress site is configured to use a domain – real or fake – and not an ip – there is a different way we can use to solve the problem.

Let’s imagine that our site has been configure to use the myaws1om1esite.ca domain. We let that configuration be, and instead we are going to look for our hosts file – etc/hosts in Debian Stretch – and add a new line:

192.168.1.100 myaws1om1esite.ca

If we want to access WordPress from a remote machine in our network we got to update the hosts file in the same way on those machines too. This way the computers will know how to find myaws1om1esite.ca and be able to fetch and display correctly CSSs, images and all the files involved.

Advertisements