Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

PHP

In header.php how can I link paths to menu links, css and js files in pages that are in directories on different levels?

I have a project with pages on different directories. The header.php navbar, css and js only work when pages are on the same directory level. However when using the header php script on pages outside the main directory the relative paths in the header stop working. Is there a way to generate dynamic linking through php that echos an absolute path to these files?

5 Answers

Sheldon Reiff
Sheldon Reiff
12,765 Points

Personally, I define a constant called ROOT_PATH inside a switch statement like this:

switch($_SERVER['SERVER_NAME']){
  case: 'localhost' //development
    define('ROOT_PATH', $_SERVER["DOCUMENT_ROOT"].'/your-project-directory-on-local-machine/');
    break;
  case: 'your-site.com' //production
    define('ROOT_PATH', $_SERVER["DOCUMENT_ROOT"].'/your-project-directory-on-production-server/');
    break;
}

Then, add your resources like this:

<link href="<?php echo ROOT_PATH. 'assets/css/gaia.css');?>

If your project directory in both your local and production envrionments is "pueblosanto.co", then you don't need to do this.

Thanks Sheldon for taking the time!

I will give it a try this time and see if it works. It just ocurred to me that maybe setting up the vhosts in my mac will make all this easier. So instead of having a localhost url, I can have a real, http://mydomain.local website locally and then it will be easier to deploy it live. What do you think?

Sheldon Reiff
Sheldon Reiff
12,765 Points

You can echo out $_SERVER['DOCUMENT_ROOT'] to get the path to the directory that your script is running in (i.e. .../htdocs). Then continue with the rest of the path to each of your css and js files. This will give you a dynamically generated absolute path. Lookup $_SERVER in the php docs for some more useful info you can pull out of this variable.

Thanks for your reply but this isn't really working with the css file. This is how I used it on the header script and it wont work:

<link href="<?php include($_SERVER["DOCUMENT_ROOT"] . '/assets/css/gaia.css');?>" rel="stylesheet"/>

And this is on the source code:

<link href="<br /> <b>Warning</b>: include(/usr/docs/dummy-host.example.com/assets/css/gaia.css): failed to open stream: No such file or directory in <b>/Users/tokyographer1/Sites/mydomain.co/includes/header.php</b> on line <b>14</b><br /> <br /> <b>Warning</b>: include(): Failed opening '/usr/docs/dummy-host.example.com/assets/css/gaia.css' for inclusion (include_path='.:') in <b>/Users/tokyographer1/Sites/mydomain.co/includes/header.php</b> on line <b>14</b><br /> " rel="stylesheet"/>

Sheldon Reiff
Sheldon Reiff
12,765 Points

As a quick fix you could also just use an absolute path: <link href="http://localhost/pueblosanto.co/assets/css/gaia.css" rel="stylesheet"/> No PHP required, but this isn't great if you are going to publish your site to a production server since the path will be different there.

Sheldon Reiff
Sheldon Reiff
12,765 Points

I noticed I had some misinformation here earlier... DOCUMENT_ROOT is the path to your files on the server, not the public path, so this would cause issues in production. Here's what I think makes the most sense in your case:

switch($_SERVER['SERVER_NAME']){
    case 'localhost': //development
        define('BASE_URL', 'http://localhost/pueblosanto.co/');
        define('ROOT_PATH', '/Users/tokyographer1/Sites/pueblosanto.co/');
    break;
    case 'your-site.com': //production
        define('BASE_URL', 'your-public-url/');
        define('ROOT_PATH', '/your-project-directory-on-production-server/');
    break;
}

You can use $_SERVER or other variables to dynamically generate these constants later, but this would be a good start.

To clarify:

BASE_URL: for accessing resources from public contexts (accessing images, css, js, ect. from your HTML) ROOT_PATH: for accessing resources from PHP (including and requiring other PHP files, ect.)

You could change your vhost, but I'm not sure how that would benefit you. By the way, you might want to look into MAMP in the future as it may be easier to work with than MacOS's native apache.

I finally worked around the whole issue! The definite solution was to setup vhosts in macos so I could create the same online server environment. That way I could setup a mydomain.local root folder so 'relative root paths' could work out. This way I can just deploy without having to do server edits. It took me 10 days to make this work out. Anyways thanks for your help, I appreciate you taking the time to respond. Cheers!