TUTORIALS

FRAMES


Frames Tutorial

This tutorial will explain how to make a basic frameset, including three frames. This will include a Menu on the left, a Main page on the right, and a Top page. Follow the steps carefully.

1. Create three new pages. Name one page MAIN.html, another TOP.html, and the last MENU.html.

MENU.html will be your menu page. This will contain your links
MAIN.html will be the first page users see in your FrameSet
TOP.html will be the top of your page where you place a banner/welcome sign

2. Open index.html (If you do not have a page named index.html for some reason, create a new page and name it index.html)

3. Enter the HTML Code for your FrameSet on index.html. (This code is below) *Change "COLOR" to the color of your choice*


4. Once you preview your page, you should see the basic frame set. It should look like this:


5. Now that your frame set is complete, you must target your links.This ensures that your pages open in the right window. To do this, open MENU.html and insert the following code in the head code:


OR

to target each link individually, use the code:


NOTE
If you had already created your pages before you began this tutorial, you may have to change the text that is CAPITALIZED to suit your website. This includes the MENU.html, MAIN.html, etc.
**Codes are case sensitive**


FRAMES F.A.Q.
1. I have copied and pasted the frame codes into my Frame.html page, and although the frameset does work, my pages show up as an error. What did I do wrong?
Remember, frame codes are case sensitive. For example, if you name a page "FRAME.html" and name is as "Frame.html" or "frame.html", it will not work. It must be put into the same form it is named, which in this case would be "FRAME.html". Check back to make all names match exactly.

2. The codes on your Frame Codes page provide a solid border. How can I change that into a different style?
You can change your solid border into another style by replacing the word solid with another style name, such as "dashed" for example.

3. The codes on your Frame Codes page provide a border. How do I change it so that there is no border?
Change style="border: 5 solid #COLOR" to "border=0"

4. How do I get rid of the scrollbar around a certain frame?
Change scrolling="auto" to scrolling=no

Did this tutorial help you out? If so, please link back. If you have any questions please visit the FAQ page before contacting me. DO NOT STEAL THIS TUTORIAL OR CLAIM IT AS YOUR OWN.