Page Header and Footer Functions

PHP programming forum. Ask questions or help people concerning PHP code. Don't understand a function? Need help implementing a class? Don't understand a class? Here is where to ask. Remember to do your homework!

Moderator: General Moderators

Post Reply
imderek
Forum Newbie
Posts: 12
Joined: Thu Jul 24, 2008 9:04 am

Page Header and Footer Functions

Post by imderek »

Hi all,

I've created two functions which I include in all my pages. The Header function echos the first portion of my html (including tags: html, head, body, container div, logo img, etc.) and the Footer function closes the open tags. The problem I've run into is that the head tag has relative links to the CSS and JS files, so when I create a page which is in a subdirectory and use the same functions, it obviously cannot locate the CSS or JS.

The reason I don't wish to use absolute linkage is the fact that I'm developing with WAMP on my workstation and the paths vary from when I'm testing it locally and when it is on the web server.

So how do I make the same function work for a page regardless of its directory location without using absolute linkage? Is there some sort of argument I can pass to the function to remedy this?

Many thanks!

Code: Select all

function insertHeader() {
    echo '
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <head>
    <title>Executive Search Firm for the Kitchen/Bath and Building Industry | Brooke Chase Associates, Inc.</title>
    <meta name="Copyright" content="All Images, Flash, Copy and Code copyright 2008 Brooke Chase Associates, Inc." />
    <meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
    <!-- css -->
    <link href="css/display.css" rel="stylesheet" type="text/css" />
    <!-- jquery -->
    <script src="js/jquery.js" type="text/javascript"></script>
    <script src="js/jquery.validate.js" type="text/javascript"></script>
    <script type="text/javascript">
    $(document).ready(function() {
        $("#form").validate();
    });
    </script>
    </head>
    <body>
    <div id="container">
';
}
Last edited by imderek on Thu Jul 24, 2008 10:04 am, edited 1 time in total.
User avatar
pickle
Briney Mod
Posts: 6445
Joined: Mon Jan 19, 2004 6:11 pm
Location: 53.01N x 112.48W
Contact:

Re: Page Header and Footer Functions

Post by pickle »

Would semi-absolute paths work? The path to the JS/CSS files should be the same from the document root

For example, if the CSS file is stored at http://www.mydomain.com/styles/blue.css , make your link to this file:

Code: Select all

<link rel = "stylesheet" type = "text/css" href = "/styles/blue.css" />
Real programmers don't comment their code. If it was hard to write, it should be hard to understand.
imderek
Forum Newbie
Posts: 12
Joined: Thu Jul 24, 2008 9:04 am

Re: Page Header and Footer Functions

Post by imderek »

pickle wrote:Would semi-absolute paths work? The path to the JS/CSS files should be the same from the document root

For example, if the CSS file is stored at http://www.mydomain.com/styles/blue.css , make your link to this file:

Code: Select all

<link rel = "stylesheet" type = "text/css" href = "/styles/blue.css" />
The trouble with semi-absolute paths is that the number of levels to the document root are different when local and when hosted.
mabwi
Forum Commoner
Posts: 27
Joined: Wed Aug 01, 2007 4:51 pm

Re: Page Header and Footer Functions

Post by mabwi »

Do you have a config file that's included for each page? You could set the base path there - either as a constant or returned in a function - and then you would only have to change it in one place when you move servers.
User avatar
ghurtado
Forum Contributor
Posts: 334
Joined: Wed Jul 23, 2008 12:19 pm

Re: Page Header and Footer Functions

Post by ghurtado »

imderek wrote: The trouble with semi-absolute paths is that the number of levels to the document root are different when local and when hosted.
They are called "root-relative" paths (as opposed to document-relative paths, the kind you had before), and this will only work as long as the path from your document to the root of the webserver are the same.

I have solved this same problem before by using document relative paths, then adding a base tag to the document which gets dynamically populated by php based on the document root. That way you only have one "dynamic" spot to change (in the header) and all your links should work regardless of environment.

Something like:

Code: Select all

 
<base href="<?= getenv("DOCUMENT_ROOT") ?>" />
 
imderek
Forum Newbie
Posts: 12
Joined: Thu Jul 24, 2008 9:04 am

Re: Page Header and Footer Functions

Post by imderek »

ghurtado wrote:
imderek wrote: The trouble with semi-absolute paths is that the number of levels to the document root are different when local and when hosted.
They are called "root-relative" paths (as opposed to document-relative paths, the kind you had before), and this will only work as long as the path from your document to the root of the webserver are the same.

I have solved this same problem before by using document relative paths, then adding a base tag to the document which gets dynamically populated by php based on the document root. That way you only have one "dynamic" spot to change (in the header) and all your links should work regardless of environment.

Something like:

Code: Select all

 
<base href="<?= getenv("DOCUMENT_ROOT") ?>" />
 
Hmm... problem is getenv("DOCUMENT_ROOT") on the webhost returns "/export/home/blah/public_html" which, when applied to the beginning of links, does not appropriately direct them. Did I miss something?
User avatar
ghurtado
Forum Contributor
Posts: 334
Joined: Wed Jul 23, 2008 12:19 pm

Re: Page Header and Footer Functions

Post by ghurtado »

Sorry, my mistake. That environment variable is for filesystem paths, not web paths.

You should probably go with mabwi's suggestion: defining the base tag in your config file.

So my example becomes:

(in your config.php file)

Code: Select all

 
$web_root = dirname($_SERVER["REQUEST_URI"]) . "/";
 
And the base tag:

Code: Select all

 
<base href="<?= $web_root ?>" />
 
Post Reply