Relative links stop working after moving wordpress site from hosting to localhost

Question

After moving website to my local dev machine, relative links stopped working. When i click button with relative link /login, for example, browser redirects to

https://localhost/login/

and shows

Code: Not Found

The requested URL /index.php was not found on this server.

While it should have redirected to https://localhost/сс/login/

.htaccess contents on localhost:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /cc/
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /cc/index.php [L]
</IfModule>

1. Website files are in var/lib/html/cc folder.
2. SiteURL and HomeUrl are both equal to http://localhost/сс
3. Parmalinks setting http://localhost/cc/sample-post/ is used, so no problem with navigating to pages.

How to fix this issue?

Tried different .htaccess modifications, moving index.php to /var/lib Nothing helps.

Answer 1

If you are in https://localhost/cc and use a relative lnk with href="/login" (relative to current domain/site), the browser (not WordPress) will take you to https://localhost/login; if the link is href="login" (relative to current path) the browser will take you to https://localhost/cc/login.

Relative links work like that, nothing to do with WordPress. That is why many developers prefer to use absolute links, and WordPress too. You can get the home url and append the path you want like this:

// See https://developer.wordpress.org/reference/functions/home_url/
// Outputs http:://example.com/login
$login_url = home_url( 'login' );

If you prefer relative paths:

// Outputs /login
$login_url = home_url( 'login', 'relative' );

And the good thing of using this method is that you get paths relative to current site, not to current path. So, if you are in https://localhost/cc you get this result (which I think will work for you if you still wnat to use relative links):

// If we are in `https://localhost/cc`
// Outputs /cc/login
$login_url = home_url( 'login', 'relative' );

Answer 2

As MrWhite suggested the following steps solved the issues:

1) Adding vhost block to apache2.conf configuration file of Apache.

NameVirtualHost 192.168.1.10:80
<VirtualHost 192.168.1.10:80>
   ServerName local.site.com
   DocumentRoot "/var/www/html/local.site"
</VirtualHost>

• /var/www/html/local.site is the folder on local machine where all the website files are.
• local.site.com is the domain name of the local website
• VirtualHost directive has an explicit IP address discoverable by running ip addr show in the command line to support multiple name-based virtual hosts on one ip address

2) Adding the following entry to /etc/hosts

192.168.1.10 local.site.com

To conform to note here

Creating virtual host configurations on your Apache server does not magically cause DNS entries to be created for those host names. You must have the names in DNS, resolving to your IP address, or nobody else will be able to see your web site. You can put entries in your hosts file for local testing, but that will work only from the machine with those hosts entries.

3) Using the same .htaccess from the staging website

It basically contains the following:

# BEGIN WordPress
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteBase /
RewriteRule ^index\.php$ - [L]
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule . /index.php [L]
</IfModule>

There may be much more directives originating from security wordpress plugins. If they use staging website url like in:

#AIOWPS_PREVENT_IMAGE_HOTLINKS_START
<IfModule mod_rewrite.c>
RewriteEngine On
RewriteCond %{HTTP_REFERER} !^$
RewriteCond %{REQUEST_FILENAME} -f
RewriteCond %{REQUEST_FILENAME} \.(gif|jpe?g?|png)$ [NC]
RewriteCond %{HTTP_REFERER} !^http(s)?://site.com [NC]
RewriteRule \.(gif|jpe?g?|png)$ - [F,NC,L]
</IfModule>

RewriteCond %{HTTP_REFERER} !^http(s)?://site.com [NC] should be replaced with RewriteCond %{HTTP_REFERER} !^http(s)?://local.site.com [NC]

All the steps were run after:

1. Cloning site code repository to local development environment

2. Importing mysql dump to local mysql db

3. Using wp-cli to search and replace staging site url with local.site.com