More on this site

Alt-Web Home Page

Chalk Board Intro

CSS  Styled Background Images

Image Borders on Mouse Over

Iframes

Print Page Buttons

Close Window Buttons

Scrollable Divisions

CSS  Flyout Menus

Vertical & Horizontal Centering

Centered on  Two-toned Background Image

Liquid Layouts

Images and Text

Layout Regions

Printer Friendly Pages

Web Color Assist Tool

Hex  Color Chart

Favicons

Fast Contact Forms

Iframes (Inline frames) in NetObjects Fusion

Description:

Inline frames or Iframes are not the same as auto frames.  Iframes allow web designers to pull content from an external html page on their web site into their NOF page. Why do you need this? One example would be a large photo gallery with many sub pages made with an external application like JAlbum. By inserting the Iframe code with a call to the Photo Gallery Index page, the gallery pages appear as if they part of the NOF site - even though they are not.

Iframe Example:

 

Tutorial:

1. Upload an external page or photo gallery to your remote server. Note the file location.
2. Place a text box in your NOF page layout area.
3. Click inside the box as if to type a letter and hit Ctrl+T to bring up an HTML insertion box.
4. Copy and paste the following code inside the HTML box.

<iframe name="Frame1" id="Frame1" src="http://yoursite.com/PhotoGallery/index.html" width="100%" height="425" align="left" frameborder="0"  scrolling="auto">Your broswer doesn't support inline frames, please upgrade to a modern browser that does.</iframe>

5. Change the SRC= to an absolute URL of the page on your server.
6. Change the height and width in pixels or % to fit your layout.
7. Keep Scrolling set to "auto." This is important as some visitors to your web site may have increased their browser text size and will need the scrollbar. If it isn't there, they won't be able to see all the conent on that page.
8. Hit OK.
9. Ctrl+S to save.
10. Do a local publish and test in the major browsers.

HINT: If your Iframe page is not aligned correctly,  try placing it on a Zero Margins page (no MasterBorder).

Links to open pages in Iframes:

1. In your link properties box, where it says TARGET, select EXISTING from the drop list.
2. Click the ADD button
3. Type the name of your frame and hit OK.

It is possible to have more than one Iframe on a page. In this case you might wish to name each iframe FRAME1, FRAME2, FRAME3, etc...

That's all there is to it. We hope you found this tutorial useful. For more information on the use of Iframes in html pages, visit the W3Schools.com