using iframes
The purpose of iFrames is to make changing CSS, links, etc. easier on yourself. With out them--for example--if you decide to add link on one page, you have to add it to all of the other pages as well. That can be more than frustrating. That is why I decided to create this tutorial. It's a bit long and tideous, but it is very useful. First off, create 3 pages, name them index, home, and style.index page
Copy the following code into your index page. That is the basic code. now all you really have to do is plug in stuff. If that's all you needed, then you're pretty much set. (; If not, continue, I'll explain each piece. For this part:<style> CSS CSS CSS </style>Just replace 'CSS CSS CSS' with your... CSS. ;p
<div style="position: absolute; top:0px; left:0px;">"Layout link" with your actual layout link. Haha, do I really need to be explaining this? xD Now, see all of the NUMBER's everywhere? you will need to replace each of these with an actual coordinate's number. Now here is our first important piece:
<IMG SRC="LAYOUT LINK" border="0px">
</div>
<div style="position: absolute; top: NUMBERpx; left: NUMBERpx; width: NUMBERpx; height: NUMBERpx; overflow:auto;">These 'NUMBERS' should make out the div layer for your navigation content.
<a href="http://overagain.net" target="iframe1">link</a>
</div>
all of the links you list here will automatically be located to the 'iframe1' box you create in the next step.
Remember to incorporate target="iframe1" into all of your links, otherwise it will open into a new window or something.
Feel free to change the overagain link to something else. xD Now onto this other important section:
Replace 'LINK TO YOUR HOME PAGE' with the home page that you made. We'll get to that later. This is the most important part of the iframe process, since it's the actual iframe itself. Where you position this box is where all your main content should go. Now when you look at your index page, the place where you set the iframe to go should just be completely blank.
<div id="maincontents" style="position:absolute; left: NUMBERpx; top: NUMBERpx; overflow:auto;">
<iframe frameborder="0" name="iframe1" src="LINK TO YOUR HOME PAGE" width=NUMBER height=NUMBER allowtransparency="true"></iframe>
</div>
home page
Now's the time to make that page unblank. Paste this code into your home page: This is the same code that you will have to place in every page you would like to appear in the iframe. The only thing you need to change is the 'CSS LINK'... It's just the link to a stylesheet, which I ABSOLUTELY recommend. It's just the css, you can just copy the same css you made in the index page into your stylesheet, and it'll be perfecto. If you absolutely insist that you don't need a stylesheet... replace:<link rel="stylesheet" type="text/css" href=CSS LINK>with all of your CSS! And your done!
