Okay, we can close this page for now by clicking the Close button here on the left on my Mac or it would be on the right for your Windows users. We will click Don't Save. I would like you to find the folder caller frames in your side window, open it up by clicking the arrow on the Mac or the Plus(+) sign on Windows. These are some pages that I created for you, so we can learn a little bit about creating frames in a webpage. Some of them have content and some of them don't.
So right now, we are just going to click on this page called blank.html, double-click to open that one up. You will notice I have got it opening up in this editing mode which is the Frames Editor. The reason I am having you look at this page, instead of the other one that we had open a few minutes ago, is because you actually need to build several documents when you are creating a frameset page.
Let me try to explain this to you. Imagine a window that has four panes in it and each of those panes has a piece of glass in it and plus, there is the wood that separates the four panes from each other. Well, the wood portion of that window would be what we consider the frameset and the glass portion, those four pieces of glass, would be the frame pages. So in total, when you want to create a frameset, you need one document that defines the set or what goes around the outside of the frames, and you need the documents that fill in the frames themselves.
So for this frame document, I am going to actually make a frameset that has two frames in it. Now the first thing we do is go to the Objects and Tools Palette, click and pull down to the Frame objects. Here you will see some predefined framesets that you can use simply by dragging-and-dropping them into your page. So we will start by selecting this one here on the left. It's a two frame frameset, so grab it and drag it into your page and let it go.
Notice that you get this Change Doctype dialog box. What is all this about? Well, GoLive quite clearly knows that you are trying to build a frame document now. If you do that, you need to change the Doctype. The Doctype defines what type of page it is and a frameset needs a different Doctype than a regular old XHTML or HTML page. GoLive knows that and it also knows that you might not know that, so it just gives you this option automatically. It's a good idea and just say OK.
Now we have got our frameset already in place, but if we were to preview this page, we would see nothing because there are actually no pages loaded into each portion of the frameset. So how do we go about doing that? Well, that's quite easy to do. You could do it using the Inspector Palette or you could do it simply by dragging-and-dropping pages into these different areas of your frameset, which is how we will do it. So let me just move the page over a bit, so we can see our side window as well. Then I will take the document called blue.html, which is entirely blank except for a blue background color, and drag it and drop it into the left frame.
Next we are going to take the document called red.html and drag and drop it into the right frame. I am clicking back into the document itself to bring it back to the front. Now look, each of these has been defined. This is going to show me red.html in that portion of the frameset and this will show blue.html in the left portion of the frameset. So let's take a look and see how it appears. Now we can do that by clicking the Preview button here at the top of the document window. Here you can clearly see, I have got blue on the left and red on the right.
I am going to click back to the Frames editing mode and I want to point out to you that you can set the attributes for the frames and frameset both in the Inspector Palette. So I am going to go grab my Inspector Palette and drag it into the viewable area here. So you can see we have got -- when I click here on to this frame, it shows the Frame options that I can choose, such as whether I want to have a scrollbar showing or the size and scale of the frame. I also have options for FrameSet. For example, whether I want to have a border or a border color. All these attributes you can set here in the Inspector Palette. I am going to bring the Inspector back over to the side, dock it again. We are just going to close this blank.html page and we will click Don't Save.
