Using html to design and store parts of webpages separate from each other?

Question

I'm trying to design using css/html and I want to store the content of the sidebar outside of the main html, so that if I need to change it later, I don't have to change it in 10,000 documents on my site. I know CSS lets you control the look of the page but is there any similar function for the content?

I have tried loading a text/html document into the main html using embed,object,iframe...but nothing works.

Can anyone help?

Answer 1

I use Server Side Includes for exactly the reason you want to use them. You'll have to set up your .htaccess file and then make the include file(s) that will be edited at times. Using the include code on the pages where you want them will allow you to just edit one include file, upload and overwrite the old one and all changes will take effect on every web page calling that include file. You can use the PHP Include method if you prefer.



Using Includes in a webpage: http://www.htmlbasix.com/includes.shtml



PHP: http://www.ibdhost.com/help/templates/







Ron

Answer 2

I'd recommend using PHP to preprocess the file, but you can also use javascript.



If using PHP, make a php file that represents the sidebar. put it in the form of a variable. In the main html/php, include the other file and echo the variable where the side bar should go.



If using JavaScript, it is basically the same idea. include a javascript file that has a function that you can call that uses document.write. Include the javascript file using and when you get to the side bar, call the function with a script.



Hope this helps!

Answer 3

Check if your web server supports "server-side includes" ("SSI"). If it does, there's no need to use anything other than straight HTML and CSS. No scripting languages needed.



I use this on my website to put the top banner, main menu, and sidebar into their own files. Then, on each page, I simply include this at the top of the "body" section:











I then have a "inc" directory within my "htdocs" directory (some systems use "public_html" instead), where I place these files.



Over the holidays, I had this in my "/inc/banner.inc" file:

Please note that our offices will be closed for the holidays from

Thursday, 24-Dec-2009 through Sunday, 3-Jan-2010

This notice then "magically" appeared in the banner on every page on my site.



In my CSS file, I have this style for my sidebar, to keep it on the left side:



#SideBar {

background: rgb(162,192,198);

color: black;

font: 10pt Arial;

width: 15em;

float: left;

/* padding: 5px 10px 5px 0px; */

margin: 0px 2em 0px 0px;

}



and within "inc/sidebar.inc", I place everything within

to place it properly.



- kb -

Answer 4

Please don't use frames like the first person said. Use a PHP include statement, I have these constructing most of my site haha. Here's how to do it:




include('/link/to/file.html');

?>



The file that you link to can be named with any extension (ie. html phtml php), just make sure that what it contains is the exact code you want to be shown on the page...

so...

Welcome

include('file.html');

?>





file.html could be:

home | info | log out

and that code would be pasted where the include statement is:

Welcome

home | info | log out

NOTE: YOU NEED TO NAME EVERY PAGE THIS IS BEING USED IN WITH EITHER A .PHP OR .PHTML ENDING OR THIS WILL NOT WORK!!!!!! IT SHOULDN'T EFFECT ANYTHING NEGATIVELY THOUGH.

Answer 5

Try a Dreamweaver. It`s easy to understand.

Answer 6

I don't think you can do that with just HTML. You can do it using JSP, ASP or PHP.

Answer 7

Agree, don't use frames, they are very 1997

Answer 8

you need to utilize frames. it separates your webpage into sections

http://www.w3schools.com/html/html_frames.asp