|
INTRODUCTION TO USING SCRIPTED FRAMES
A frame is an area of a page that contains content independent from the rest of the page. When a site visitor scrolls another part of the page, the frame content does not move. Frames are a popular device to help visitors navigate a site. For example, many sites use two frames: one to display menu pages and another to present links to other areas and pages within the site.
NetObjects Fusion supports two ways to create frames:
- Scripted frames:
Use this feature to manually code frames using the HTML page description language. This feature requires knowledge of HTML codes and the NetObjects Fusion script interface, and is no more complicated than creating frames in an HTML editor.
- AutoFrames: Use this feature to add frames to MasterBorders with a single click, and then add navigation controls, banners, text, graphics, and links. This is the easiest and most convenient way to create frames, and is described in ·MasterBorders and AutoFrames. To learn the behind-the-scenes mechanics of AutoFrames in NetObjects Fusion, see Using AutoFrames.
With frames, content can appear in several different rectangles that divide the browser's window into a patchwork of individual pages. The frames form a top-level page called a frameset (in HTML).
Within a frameset, each frame has the characteristics of a page. When viewing a frameset, a site visitor can drag frame borders and scroll frame contents to view information. Clicking on a link within a frame can bring up new information within the frame or in a different frame. Or, clicking a link can bring up an entirely different page to replace the frameset.
DEFINING A FRAMESET
To define a frameset, you first add the frameset page, which serves as the top-level page and contains the frames. You can add the frameset page anywhere, but make sure its location makes sense within the organization of your site. What makes sense probably depends on how you want your site visitor to enter the frameset. For example, if you want the visitor to enter the frameset using standard NetObjects Fusion navigation aids, add your frameset page as a sibling of the other pages on the navigation bar.
- Create and name your page in the Site view.
- Double-click the page to open it in the Page view.
- Choose Layout Script from the Page menu.
- In the Inside Head Tag field, enter the HTML that defines the page as a frameset and the names of the frames it contains, as in this example:
<frameset rows="*,110">
<frame name="main" src=".html/guitar.html>
<frame name="main" src=".html/menu.html" scrolling="no">
</frameset>
The src attribute of the <frame> tag instructs the browser where to find the frame's content: an HTML page file. You create those pages in the next step, Creating Frame Content.
The source file names must match names of the pages that hold your content. After creating the content pages, you can determine their exact names by previewing your site and checking their names in your browser's view of the HTML source. If the source file names you specify do not exactly match the page names NetObjects Fusion creates for your content pages, you might encounter difficulties when viewing your staged or published site.
You can enter the source for your frames as a relative path (./html/menu.html) because NetObjects Fusion puts all pages except the Home page in the same HTML folder. This means the source document for each frame is always in the same directory as the page defining the frameset. If the Home page is the frameset, refer to the sub-pages as ./html/page.html; if the frameset is any page other than the Home page, refer to the subpages as ../html/page.html
Click OK.
All elements placed on a frameset page, including the banner and navigation bars,
are completely covered by the frames. This limits a visitor's ability to navigate out
of the frameset page.
CREATING FRAMESET CONTENT
Once you have defined your frameset, create the content for each of your frames.
- Add a page to your site and lay out its content. Consider these issues as you design the content:
If you want the frameset to be the only way a site visitor can access the pages in the frames, organize the content pages as children of your frameset page. This simplifies managing NetObjects Fusion's automatic navigation links.
Within a frame-content page, create links to other pages. To learn how to control where the linked information appears, refer to Creating Targeted Links.
Plan your links. Include links only to those pages designed to be displayed in your frame. If you don't want your frames to show banners and navigation bars, create a new MasterBorder for those frame content pages and remove their banners and navigation bars.
- Click Preview in the control bar to preview your site in your browser.
- Check the behavior of all links.
CREATING TARGETED LINKS
When a site visitor clicks a link within a frame, the linked information can appear in one of three places:
- The current frame
- The frame specified as the default for viewing all links launched from a frame-content page
- A frame identified for viewing this link
Unless you specify otherwise, when a site visitor clicks a link, the linked page appears in the frame where the visitor clicked the link. You can choose between two kinds of targeted links to override this, both described in the following sections.
Default Target Frame
To create a frameset with one frame displaying content and the other presenting navigation links, specify the display frame as the default for viewing all links launched from the navigation frame.
To do this, place a <base> tag in the Layout Script in the Inside Head Tag field of the navigation frame's content page. For example, the following code in the Inside Head Tag field of a menu page:
<base target="main">
will display the linked information in the main frame when a site visitor clicks a link in the menu frame.
Specific Link Target
Use the External Link tab in the Link dialog to set a target frame for a specific link. You can also use the External Link tab to create a link to a page internal to your site as described below.
- Select the object or text to be linked.
- Click the Link button on the lower left of the Properties palette.The Link dialog appears.
- Click the External Link tab.
- In the URL field, delete http://, and then specify the page to link to and the name of the frame that should display it; for example:
page.html" target="name
In the above statement, page.html is the path to your document. If the link is to a page within your site, use a relative path. Instead of name, type in the name of the frame (found on the Frame tab of the properties palette) where the linked frame should appear.
Do not type quote marks at the beginning and end of text in the URL edit box. NetObjects Fusion automatically encloses the text with quotes.
To create a link that leaves the frameset and displays the linked page in the full browser window, follow the steps above but type the following in the URL edit box:
page.html" target="_parent
- Click Link to close the dialog and create the link.You can use a specific link target in conjunction with the default target link because the specific will override the default.
Supporting Non-Frame Browsers
If your browser does not support frames, you can create alternate content for the browser.
- Define the frameset by following the first 4 steps in Defining the Frameset in this note. Use the <noframes> tag (instead of </frameset>) to close the HTML.
- In the page containing the frame content, design the page as you want it to appear in the browser that does not support frames.
- At the very bottom of your layout, create an empty text box. If you are using a MasterBorder, make sure the text box is below all MasterBorder content.
- For Windows, right-click the text box and choose Element Script... from the popup menu. For Macintosh, select Element Script from the Page menu.
- Enter the following script in the After Element Tag field:
</td></tr></table></noframes></frameset>
This leaves some unorthodox HTML at the bottom of your document, so be sure to test the page with the browsers you want to support before publishing.
|
|
