Root-relative links?

[Mal]

I've run into a problem that Google has so far been unable to help me with. I've been placing all of my site documents in the site root directory, but it's beginning to get cluttered. I tried moving several files into a subdirectory, but of course I'm using relative links to make coding easier and lighten up the files, so my links broke when I tried to do that. After a bit of Googling, I tried to convert the links to root-relative links (as I understand it, I simply need to place a / at the beginning of the link), including the links in my php includes, which also contain the link to my CSS stylesheet. Problem is, they don't seem to work.

On my testing server:

http://www.japancpi.com/cp/prod/ipodtouch.php

That page should link to the following 3 files:

http://www.japancpi.com/cp/default.css
http://www.japancpi.com/cp/head.inc
http://www.japancpi.com/cp/foot.inc

as well as several images.

Please, any advise would be wonderful.

This is running on shared hosting, a Linux box running Apache version 1.3.37 and PHP version 5.2.5.

jW

 

[angelwatt]

I'll share a trick I learned that may be of help for the PHP includes.

  include $_SERVER['DOCUMENT_ROOT']."/includes/head.inc";

I had to do this because I'm using a web host and cannot edit the PHP include path. To get around that, you prefix the root level access with the server variable document root.

 

[theappleguy]

<link media="screen" rel="stylesheet" type="text/css" href="../../cp/default.css" />

Just use "../" for every directory you want to go back to and then the path of the file you want.

 

[SrWebDeveloper]

Beyond the examples stated, when referencing content via HTML you can use either relative paths or optionally start with the slash which means START AT THE DOCUMENT ROOT. That's usually public_html or whatever where you upload your files on the server. Within HTML, the slash does NOT mean server root.

Angelwatt's example is the exception - that's a server side script trying to import another server side script which requires the full physical path so PHP can find the file. Just like you'd need to do if you wrote a script and ran it via a shell/command line. PHP makes it easy for including files when using $_SERVER['DOCUMENT_ROOT'] (path to the document root) and now you know why its required to do so.

When you start doing alot of development, knowing this stuff is crucial. Always try to use relative paths when possible (in your HTML) to streamline your HTML but most importantly not have to change the paths if you move the site to a different server (i.e. testing vs. production) or change domain names or webhosts. Use physical paths for server side scripting.

-jim

 

[Mal]

<link media="screen" rel="stylesheet" type="text/css" href="../../cp/default.css" />

Just use "../" for every directory you want to go back to and then the path of the file you want.

Unfortunately, that doesn't help me deal with my current situation, because all of my php files are calling the same head.inc, which is on the document root directory, and it in turn is calling the CSS stylesheet, which is also on the document root, except that once the head.inc file is called, the stylesheet is actually being called by the file it's now in, which means it needs two different paths if I can't get the root-relative links to work as expected.

jW

 

[SrWebDeveloper]

Unfortunately, that doesn't help me deal with my current situation, because all of my php files are calling the same head.inc, which is on the document root directory, and it in turn is calling the CSS stylesheet, which is also on the document root, except that once the head.inc file is called, the stylesheet is actually being called by the file it's now in, which means it needs two different paths if I can't get the root-relative links to work as expected.jW

I read that 4 times and still got dizzy.

Consider re-organizing your files so included files are called in a sensible sequence, i.e. any script that's intended to be called in all situations is in a global folder, separated from the rest where a switch or if/elseif/else logic helps to include only what's necessary. Or, make use of PHP's very sensible and powerful "require_once" and "include_once" functions to ensure an included file is never loaded on top of another by accident.

Unrelated side note: Nothing wrong with using path starting with document root, of course, my comment earlier about using relative paths is still valid, though. Just food for thought on your next project in terms of designing the folder heirchy.

-jim

 

[angelwatt]

Unfortunately, that doesn't help me deal with my current situation, because all of my php files are calling the same head.inc, which is on the document root directory, and it in turn is calling the CSS stylesheet, which is also on the document root, except that once the head.inc file is called, the stylesheet is actually being called by the file it's now in, which means it needs two different paths if I can't get the root-relative links to work as expected.

jW

Can you elaborate some more on the current tries? I don't know if you were able to make use of my suggestion or not. Could you supply some code snippets that you're working with and indicate the file they are in and where they exist in your directories relative to root? Seeing examples will also help ensure we are all on the same thought and not talking past one another.

 

[notjustjay]

Unfortunately, that doesn't help me deal with my current situation, because all of my php files are calling the same head.inc, which is on the document root directory, and it in turn is calling the CSS stylesheet, which is also on the document root, except that once the head.inc file is called, the stylesheet is actually being called by the file it's now in, which means it needs two different paths if I can't get the root-relative links to work as expected.

So use angelwatt's code snippet to use the $_SERVER['DOCUMENT_ROOT'] variable.

In each of your files, when you want to include your head.inc:

include $_SERVER['DOCUMENT_ROOT']."/includes/head.inc";

And inside your head.inc, to call the stylesheet:

<LINK rel="stylesheet" type="text/css" href="<?php echo $_SERVER['DOCUMENT_ROOT']; ?>/path/to/styles/style.css" >

That should work wherever you call the files from.

 

[Mal]

Sorry, Jim, I think it was just a bad explanation on my part, not so much a bad method. Basically, my head.inc file contains all of the document headers, including the link to the stylesheet. I'm not using another include in that head.inc, just has the normal link format. I think the method that notjustjay just posted should work, I'll implement that later this afternoon and see if it's successful.

Can you elaborate some more on the current tries? I don't know if you were able to make use of my suggestion or not. Could you supply some code snippets that you're working with and indicate the file they are in and where they exist in your directories relative to root? Seeing examples will also help ensure we are all on the same thought and not talking past one another.

Thanks, and yes, your code was perfect for the includes. I think with notjustjay's explanation of how to utilize that in my header, I'm in good shape. Just for clarification, though, here's my setup:

ipodtouch.php contains the following lines at the beginning and end, with the actual page content in between:

<?php
	include $_SERVER['DOCUMENT_ROOT']."/head.inc";
?>	

<?php
	include $_SERVER['DOCUMENT_ROOT']."/foot.inc";
?>

I might should make an includes directory, but I haven't yet, they're just sitting on the document root directory.

head.inc contains the DOCTYPE description (all of my pages are the same), the beginning html tag and the head tag (with all of the contained information), including my link to the CSS stylesheet, which is also on my document root directory. I tried linking it to "/default.css" (I have an iphone.css file I will be implementing when I get a chance), but it didn't load the CSS file at all with that code, except when I was loading a page that was on the document root, so it seems it wasn't recognizing the root-relative link.

jW

 

[notjustjay]

Actually it just occurs to me that this might not work exactly as written because your document root might be something like "/home/users/blah/www/public_html" and your LINK tag wants to see "http://www.domain.com/blah/".

 

[angelwatt]

That looks like my setup too. Each of my content pages, which include files at root and inside directories have a,

include $_SERVER['DOCUMENT_ROOT']."/includes/head.php";

at the top. Then, inside the head.php I have a link to my CSS,

<link rel="stylesheet" type="text/css"
  href="/css/angelwatt.css" media="screen, presentation"/>

which uses the / at the beginning to access from root. It hasn't created any issues and sounds like you're doing the same thing.

Hope you get it figured out.

 

[Mal]

Actually it just occurs to me that this might not work exactly as written because your document root might be something like "/home/users/blah/www/public_html" and your LINK tag wants to see "http://www.domain.com/blah/".

Yeah, that's what I was guessing when I saw what it was producing. I switched back to the other link style and it appears to be working correctly now. Go figure. I may have had a typo that my tired eyes weren't picking up. Thanks everyone! I'll be back if I have anymore problems.

jW

 

[notjustjay]

Yeah, sorry about that, I freely admit I'm no expert! angelwatt is right, use a hard path in the <LINK> tag and you should be fine.

 

[Mal]

Yeah, sorry about that, I freely admit I'm no expert! angelwatt is right, use a hard path in the <LINK> tag and you should be fine.

No worries, I'm obviously no expert either, but I've offered advice when I thought I had a good answer. It's always appreciated!

jW

 

[memco]

I realize I'm late in the game with this, but thought I'd chime in to see how people feel about relative paths. On a small site, I'll use them. But for a larger site I maintain, I do everything as absolute paths because when using includes, you just never know where your files are being requested from. Using constants helps to shorten the reference if need be.