php or shtml for headers and menus

@SalamFeb 26.2003

Hi, I need to have a header at the top and a menu at the right side on all my pages. I now understand that I can use two ways to include them on every page.

(1)
Making my pages “.SHTML” and using the include statement for the menu and header at the right spots in my pages

<!–#include virtual = “header.htm”–>
and
<!–#include virtual = “menu.htm”–>

(2)
Making my pages “.PHP” and using the require statement for the menu and header at the right spots of in my pages

<?php require(‘header.htm’);?>
and
<?php require(‘menu.htm’);?>

Consider that my server supports both shtml (Server Side Includes) and supports PHP. Also consider that I am good in php programming.

First question:
What has more advantages … having all my pages being .shtml or .php

Second question:
what is the best way to place the menu on the right? should I make all my pages tables and have a colomn at the right side to place the menu in it or there are other ways. Consider that I already have the pages and it will be easier for me to have a way that I can plug in the existing pages even though I want the best way even if it takes more work.

Thanks
Sam

to post a comment

HTML

8 Comments(s) _↴

@Zach_ElfersFeb 26.2003 — #I think in PHP it is <?php include("file.php"); ?> but maybe there are two ways or I am wrong.

It is up to you I guess. It doesn't really matter. Maybe use the SSI cause then if someone is using an old browser the include will be a comment and the coding won't appear on the page like with xml and php.

@jeffmottFeb 26.2003 — #PHP is probably better so you'll be able to add other operations in later if you choose to.

[i]Zach Elfers[/i]

[b]Maybe use the SSI cause then if someone is using an old browser the include will be a comment and the coding won't appear on the page[/b][/quote]
SSI is parsed at the server and will never even reach the browser. Same with PHP.

@nkaisareFeb 26.2003 — #Both methods are equivalent as both are server side methods and server will read through entire code to look for your "commands".

For placing your menu to the right, I recommend the following:

<i>
 </i>&lt;body&gt;
 &lt;!-- Main contents of your page --&gt;
 
 &lt;div id="nav"&gt;
 &lt;!-- Your navigation links here --&gt;
 &lt;/div&gt;
 &lt;/body&gt;

And your style sheet:

<i>
 </i>body {margin-right: 200px}
 #nav {position: absolute; top: 0px; right: 0px; width: 200px}

->This is definitely a better way as you separate style from the content and end up with cleaner codes.

-> Its also better for non-visual browsers (eg. lynx, hand-helds etc).

-> Another disadvantage of tables is that "perceived download time" is higher. Browser needs to read the entire table before it starts displaying it.

@pyroFeb 26.2003 — #I'd agree with jeffmott, you would be far better off using PHP for the reason that he stated: you will be able to add far more to your pages using PHP than SSI. SSI is very limited in what it is useful for, not so with PHP....

[i]Originally posted by Zach Elfers[/i]

[b]but maybe there are two ways or I am wrong.[/b][/QUOTE]Yes, either way will work. There are obviously differences, but... ?

@SalamauthorFeb 27.2003 — #Hi,

Regrding the first question I had:

Based on the answers and the fact that I also agree its the better choice, I will go with the PHP option.

Regrding the second question:

nkaisare, I am definitly going with your advice. I never used div before and I spent sometime playing with it to get what I exactly want. I was able to go a long way but not completely.

I want a top division (header) that takes the width of the screen regardless of the screen resolution. I was not able to handle this width issue.

Left and right devisions work fine

I want a footer section to also take the width of the screen. I could not figure out how to do that. Curently, it takes the width of the body as if it is a normal extention of the body section.

The top taking the width of the screen is what is more important for me if you (or anyone) can point to me how I can fix that.

Thanks,

Sam

------ code -------

<head>

<STYLE TYPE="text/css">

body {margin-right: 150px; margin-left: 150px; margin-top: 130px}

#top {position: absolute; top: 0px; left: 0px; height: 130px}

#nav {position: absolute; top: 130px; right: 0px; width: 150px}

#lef {position: absolute; top: 130px; left: 0px; width: 150px}

#footer {position: relative; top: 0px; left: 0px; height: 30px}

</STYLE>

</head>

<body>

<?php require('page-1.html');?>

<div id="top" align=center>

<?php require('header.html');?>

</div>

<div id="nav" align=right>

<?php require('menu.html');?>

</div>

<div id="lef">

<?php require('left_side.html');?>

</div>

<div id="footer" align=center>

THIS IS THE FOOTER ... THIS IS THE FOOTER ... THIS IS THE FOOTER ... THIS IS THE FOOTER

</div>

</body>

@pyroFeb 27.2003 — #Does this work for you?

&lt;STYLE TYPE="text/css"&gt; 
 body {margin-right: 150px; margin-left: 150px; margin-top: 130px} 
 #top {position: absolute; top: 0px; left: 0px; height: 130px; width: 100%} 
 #nav {position: absolute; top: 130px; right: 0px; width: 150px} 
 #lef {position: absolute; top: 130px; left: 0px; width: 150px} 
 #footer {position: relative; top: 0px; left: 0px; height: 30px; width: 100%} 
 &lt;/STYLE&gt;

@SalamauthorFeb 27.2003 — #YES pyro thankssss, the "width=100" worked for the top which I care about. The footer still covers the area below the body section wich is fine. Actually, I used "width=100" before. Problem was when I changed the resolution of the screen to a lower resolution, it did not refresh and thus there was a long horizontal scroll bar for the screen. So I thought the "width=100%" does not work for all resolutions. This time the window refreshes and fits the screen width when resolution is changed. I must have done something else wrong that time and blamed it on the poor "width=100".

Thanksssssssssss

Sam

@SalamauthorFeb 28.2003 — #Hi,

Actualy, width=100% did not work. I did a wrong test when I thought it did. Playing with the code and searching for info, I think that I was able to understand what the problem is but could not figure out a fix.

Problem description: top is not taking the whole width of the window but something smaller than that.

Take a look at the first two lines (body and top). the width percentage used in "top" is based on the width of the parent object. I think the parent object of the top section is the body. because of using left and right marganes for the body, the body width is smaller than that of the window.

I need a different way to specify the width of top or be able to do somehing like width=100% + 185px !!!!

I will open a new thread for this problem with a relative title.

Thanks,

Sam

----- code: just take a look at the first two lines -----

body {margin-right: 85px; margin-left: 100px; margin-top: 130px}

#top {position: absolute; top: 0px; left: 0px; height: 130px; width: 100%}

#nav {position: absolute; top: 140px; right: 0px; width: 85px}

#lef {position: absolute; top: 140px; left: 0px; width: 100px}

#footer {position: relative; top: 0%; left: 0%; width: 100%}

Also in #HTML _↴

Link to database Help with Javascript Form?i don't know how to see the values i select in a list form

Success!

Help @Salam spread the word by sharing this article on Twitter...

Tweet This

php or shtml for headers and menus

8 Comments(s) _↴

Also in #HTML _↴

Success!

Social

Version

php or shtml for headers and menus

8 Comments(s) ↴

Also in #HTML ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

8 Comments(s) _↴

Also in #HTML _↴