Common Index in HTML/CSS

Oldjim · ‎15-06-2007

I want to do something very simple. At least I think it is but after a lot of Googling I still don't know if it is possible.
I want a series of web pages which will be in separate folders but I want to have a standard index either at the side or at the top.
Now I can create the basic layout using a CSS style sheet but the question is whether the index with html links can also be incorporated into a style sheet so that any change to the index will ripple through all the pages.
PS I don't want to use frames

Oldjim · ‎15-06-2007

One solution found is php coding and the hosting company includes php5 support so it looks like this is the way to go
In order to test the code I need to do it off line - has anyone tried QuickPHP http://www.zachsaw.co.cc/?pg=quickphp_php_tester_debugger&sub=quickphp_php_tester_debugger_moreinfo

hadden · ‎27-07-2007

Another option might be to generate the index using javascript dynamically?
For example:

document.write('<ul>');
document.write('<li><a href="1.htm">One</a></li>')
document.write('<li><a href="2.htm">Two</a></li>')
document.write('<li><a href="3.htm">Three</a></li>')
document.write('<li><a href="4.htm">Four</a></li>')
document.write('</ul>');

Place the javascript in an external file and call the external javascript into each page that requires it.
This should satisfy the requirement to only maintain the index in one place.
If you call the external javascript within a named DIV, CSS can be used to control the location of that DIV.
Any use?

Oldjim · ‎15-06-2007

Would that work if the person viewing the page doesn't have javascript enabled

hadden · ‎27-07-2007

Nope, javascript must be enabled.

Oldjim · ‎15-06-2007

Scuppers that option then - thanks for the suggestion

Vip3r · ‎22-10-2009

Hi Oldjim,
what you need is to be able to include one file inside another, have a look at this site for some ideas http://ask-leo.com/how_do_i_include_one_html_file_inside_another.html . Don't know what options are supported on the plusnet webspace though!
Vip3r.

Oldjim · ‎15-06-2007

Unfortunately client side include is out as it requires javascript but server side include is a possibility but seems a bit more complex at first sight. Still worth a play

jelv · ‎10-04-2007

I'm using server side includes on home pages to do almost exactly the same as you want to do.
You'll need to add the following to .htaccess

AddHandler server-parsed .shtml
AddType text/html shtml

Then make your pages that need to include the common header have .shtml extension.
Within the pages you put

<!--#include virtual="filename.xxx"-->

The filename and extension can be anything you like.

jelv (a.k.a Spoon Whittler)
Why I have left Plusnet (warning: long post!)
Broadband: Andrews & Arnold Home::1 (FTTC 80/20)
Line rental: Pulse 8 Home Line Rental (£14.40/month)
Mobile: iD mobile (£4/month)

Oldjim · ‎15-06-2007

In order for that to work do you need to refer the filename back to the root and then forward to the folder where it is stored as you would using straight html coding

jelv · ‎10-04-2007

Yes, exactly the same logic as the way you code links.

jelv (a.k.a Spoon Whittler)
Why I have left Plusnet (warning: long post!)
Broadband: Andrews & Arnold Home::1 (FTTC 80/20)
Line rental: Pulse 8 Home Line Rental (£14.40/month)
Mobile: iD mobile (£4/month)

Oldjim · ‎15-06-2007

So unlike PHP the code would be something like  where the two dots takes it back to the root and then the / etc takes it forward

Peter_Vaughan · ‎30-07-2007

Yes.
This is what is called a relative link. The location of one file is specified relative to the current file. All links should be entered this way (except external ones obviously).
One benefit of relative linking is the whole set of files can be moved to a new directory or server and all the links will remain correct.

sexysir · ‎22-08-2007

Jim:
I use a header.php holding all the stuff from the Doctype Decleration to the <body> tag. I also include a global footer.php which includes the footer stuff and the </body> tag.
Basically:
<?php include 'header.php'; ?>
webpage code
<?php include 'footer.php'; ?>
Bear in mind that the various webpages will have different header data (title, keywords etc.), so it might be worthwhile sitting down and thinking about how best to pull in the global data without messing with the page-specific stuff.

As for testing, I'm using XAMPP, which provides a local Apache dist on the PC. Just pull your files to the htdocs folder, and use the url 127.0.0.1 in the browser.
http://www.apachefriends.org/en/xampp.html

Cign · ‎17-08-2007

Jim, SSI (server side includes) is fairly straightforward. I use this for my site hosted on the Plusnet home page server http://www.cign.org The menu is entirely CSS and is pulled into each page on the fly. The menu is plain HTML no headers just the code for the menu. As Jelv says you need to amend the .htaccess file to include

AddHandler server-parsed .html
AddType text/html html

Note that this can be html and or shtml at least on Plusnet's server this works. If all the pages are already written this makes it a bit easier as there is no need to alter the file type on each page.
Cheers
John

Common Index in HTML/CSS

Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS

Re: Common Index in HTML/CSS