Mostly, NOF looks after all of your internal links. But, occasionally, you may need to make one yourself. You might be uploading an HTML file that is already done for you and you just want to link to it. Or you may decide to split your site into separate sections that you publish as if they were separate sites. You want the two to operate seamlessly as if it were one site, so you need to make a relative link from one section to the other.
Anyway it's the principle you need to grasp. So...
Say you have a folder in the root directory on your server and you've called it "AFolder".
And another folder, also in the root directory on your server, and you've called it "BFolder".
Also, in AFolder is a sub-folder called ASubFolder.
Let's make this a simple site, so each folder has only one page in it. AFolder has a page called A1.html in it. BFolder has B1.html. ASubFolder has AS1.html.
The principle of creating relative links is that you need to find stepping stones. If you look at the sample site in the graphic above, you can't just jump across the creek from AFolder to BFolder. You have to go through the root directory. So the root directory, in this case, is the stepping stone between AFolder and BFolder.
If we wanted to get from A1.html to B1.html, there would be three stepping stones.
Step 1: Step up to the root directory.
Step 2: Step down to the BFolder.
Step 3: Find the page B1.html
Note that there's no mention of AFolder on this path. That's because a page knows where it is, so when we step off the page (in our relative pathway) we can step straight out of the directory it is in to another directory.
Let's create the relative link from A1.html to B1.html by taking the pathway.
We're on page A1.html.
First, we have to step out of the directory the page is in. So in this instance, we have to go up to the root directory. Here's how you do this:
This says "back up a level". We don't name the levels we back up to. A folder can only be in one container folder, so the principle of relative links is that, as we back up, we only indicate the levels themselves, not the names of the levels.
So... You've stepped up to the root directory. Now you need to step from there down to the "BFolder", so the link becomes:
(ie Backup a level. Now find a folder called "BFolder".)
Now you have to point to the file you want in that folder. So the link becomes:
(ie Backup a level. Find a folder called "Bfolder". Now find a file called "B1.html")
Here's how it looks when you make the link:
To link from AS1.html to B1.html, we have an additional level to go through. So the link will look like this:
(ie Backup a level. Back up another level. Now find a folder called "BFolder". Now find a file called "B1.html".)
If you need to go forward (or down) in a hierarchy, it's one dot and a slash.
So if you wanted to make a link on A1.html to open AS1.html, it would look like this:
(ie Look down in the hierarchy. Find a folder called ASubFolder. Now find a file in there called AS1.html.)
The tricky bit is just remembering the difference between two dots and one dot. I remember it by thinking two dots to mean "back up" (which is two words), and one dot to mean "forward" (which is one word).
This page was written, and is maintained, by Dallas