0

Currently, my index.html is like this

<html>
<head>
<title>EngineeringNotes.net</title>
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>


<div class="header">
	<div id="logo">
		<h1>EngineeringNotes.net</h1>
	</div>
	<div class="menu">
		<ul>
			<li><a href="mailto:daviddoria@gmail.com">Contact Me</a></li>
			<li><a href="phpBB3">Forums</a></li>
			<li><a href="Ideology.html">Ideology</a></li>
		</ul>
	</div><!-- end menu -->
</div><!-- end header -->


<div class="page"><!-- start page -->
	<div class="sidebar"><!-- start sidebar -->
		<h2>EE Topics</h2> 
		<ul>
			<li><a href="Notes/EE/PatternRecognition.pdf">Pattern Recognition</a> </li>
			<li><a href="Notes/EE/ImageProcessing.pdf">Image Processing</a> </li>
			<li><a href="Notes/EE/ComputerVision.pdf">Computer Vision</a> </li>
			<li><a href="Notes/EE/ComputerGraphics.pdf">Computer Graphics (stub)</a> </li>
			<li><a href="Notes/EE/SignalsAndSystems.pdf">Signals and Systems</a> </li>
			<li><a href="Notes/EE/Communications.pdf">Communications</a> </li>
		</ul>
		

	</div><!-- end sidebar -->
	
	<div class="content"><!-- start content -->
		<h2>About this Site</h2>
		<p>
		This site is inteded to provide a "crash course" in many subject areas
		related to electrical engineering. The primers are not at all designed
		to
		be a replacement for a formal course in these topics. The target
		audience is a serious student who feels that it is worth their time
		outside of class to make sure they are getting the "big picture" and
		seeing the value of the subject rather than simply learning the mechanics of "doing problems". 


	</div><!-- end content -->
	
</div><!-- end page -->

</body></html>

If I want to change the content in the "page" section, but leave the title header and sidebar there, how would I do this? I can't imagine I have to have the header and sidebar on every page, or when I have to make a change to either of those, I have to change it on every page!

Any suggestions?

Thanks,
Dave

4
Contributors
5
Replies
6
Views
9 Years
Discussion Span
Last Post by daviddoria
0


Use Server-Side Includes, e.g.:

<!--#include file="page.html" -->

Or:

<!--#include file="header.html" -->
<body>
 <h1>Title</h1>
 <p>...</p>
</body>
<!--#include file="footer.html" -->
0

So should the code look something like this?

<html>
<head>
<title>EngineeringNotes.net</title>
<link href="style.css" rel="stylesheet" type="text/css" media="screen" />
</head>
<body>


<!--#include file="header.html" -->

<div class="page"><!-- start page -->

	<!--#include file="sidebar.html" -->

	
	<div class="content"><!-- start content -->
		<h2>About this Site</h2>
		<p>
		This site is inteded to provide a "crash course" in many subject areas
		related to electrical engineering. The primers are not at all designed
		to
		be a replacement for a formal course in these topics. The target
		audience is a serious student who feels that it is worth their time
		outside of class to make sure they are getting the "big picture" and
		seeing the value of the subject rather than simply learning the mechanics of "doing problems". 


	</div><!-- end content -->
	
</div><!-- end page -->

</body></html>

With the header.html file as...

<div class="header">
	<div id="logo">
		<h1>EngineeringNotes.net</h1>
	</div>
	<div class="menu">
		<ul>
			<li><a href="mailto:daviddoria@gmail.com">Contact Me</a></li>
			<li><a href="phpBB3">Forums</a></li>
			<li><a href="Ideology.html">Ideology</a></li>
		</ul>
	</div><!-- end menu -->
</div><!-- end header -->

...and the sidebar.html file being...

<div class="sidebar"><!-- start sidebar -->
		<h2>EE Topics</h2> 
		<ul>
			<li><a href="Notes/EE/PatternRecognition.pdf">Pattern Recognition</a> </li>
			<li><a href="Notes/EE/ImageProcessing.pdf">Image Processing</a> </li>
			<li><a href="Notes/EE/ComputerVision.pdf">Computer Vision</a> </li>
			<li><a href="Notes/EE/ComputerGraphics.pdf">Computer Graphics (stub)</a> </li>
			<li><a href="Notes/EE/SignalsAndSystems.pdf">Signals and Systems</a> </li>
			<li><a href="Notes/EE/Communications.pdf">Communications</a> </li>
		</ul>
		

	</div><!-- end sidebar -->
0

OK...that worked on my server when I named the original document index.shtml. The shtml extention was required so that I could add the SSI (server side include) directives to the existing page.

This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.