Include common parts into multiple HTML documents

[FollowJC2Life]

Is there a way that I can take a common part of an HTML part and insert it into other HTML files. here's my situation. I've got about 12 pages and they are all just a like. They have the same menu, banner, etc. Problem is...I make changes to what's in the banner, etc. Is there a way I can sort of link the files together to keep a part in common and only have to change that common file instead of all 12 of them? I mean...it's not a big hassle with only 12, but if my menu keeps extending...pretty soon I'll have more...and more...and it will become a hassle....thanks for any help.

Kevin (followjc2life@hotmail.com)

 

[Nevermoor]

The easiest way is to make a javascript include file with a function that will write your header when called. (You can even set parameters to customize the header if you want). Save this file as a .js file and include it at the beginning of each html page.

All you need to do then is call the printing function from where you want your menu to be.

 

[FollowJC2Life]

Thanks, I follow you, but what is the coding to include? I guess that's what I need.

 

[ChrisHunt]

Javascript is one way, but be aware that some users surf with Javascript disabled, and that search engine spiders often don't understand it - so if your navigation is presented through such a script your site may not get spidered.

A safer way to do this is through Server Side Includes (SSI). This is a way of including files (and executing programs) at the server and sending the resoutling HTML file to the end-user. The only caveat is that many free hosts do not allow SSIs. See faq253-2000 and faq253-3309 for more information.

-- Chris Hunt

http://www.extracon.com

http://www.mcgonagall-online.org.uk

http://www.napitalia.org.uk

http://www.leicesteryha.org.uk

 

[Nevermoor]

ChrisHunt is right that SSI may be the way to go. The only advantages to .js includes is that regular .html pages can use them and you don't need to work out server side limitations.

say you had a html header like:

<table width=&quot;100%&quot; border=&quot;0&quot; cellpadding=&quot;2&quot; cellspacing=&quot;0&quot;>
<tr>
<td>YOUR TITLE</td>
<td width=&quot;10%&quot;><a href=&quot;#null&quot; onclick=&quot;sender('linkHome')&quot;>Return Home</a></td></tr>
<tr><td width=&quot;10%&quot; rowspan=&quot;50&quot; bgcolor=&quot;#CCFFFF&quot;>&nbsp;</td>

you would create new file (ex. MyFunctions.js) and make a javascript function like this in it:

function returnHeader(){
retStr = &quot;<table width='100%' border='0' cellpadding='2'&quot;;
retStr +=&quot;cellspacing='0'>\n&quot;; //the \n makes code readable
retStr +=&quot;<tr>\n&quot;;
retStr +=&quot;<td>YOUR TITLE</td>\n&quot;;
...
return retStr;
}

then in each html page, you have the following line of code at the top
<script language=JavaScript src=&quot;MyFunctions.js&quot;></script>

and where you want your header you simply write (within script tags)
response.write (returnHeader());

 

[jstreich]

Or even PHP or ASP, The idea is to have it done before the it hits the Web (read: your machine should do the work, not thiers).

 

[ChrisHunt]

&quot;The only advantages to .js includes is that regular .html pages can use them and you don't need to work out server side limitations.&quot;

The point is javascript is subject to client side limitations. You only have one server, you know its limitations and can work around them. There are masses of possible client configurations, you can't predict how all of them will (mis)handle your code.

Use a server-side solution where you can and client-side where you have to.

-- Chris Hunt

http://www.extracon.com

http://www.mcgonagall-online.org.uk

http://www.napitalia.org.uk

http://www.leicesteryha.org.uk