Home
NetObjects Fusion 3.0 User Guide
Contents
1. A 2 Problems with Forms A 3 Problems with Sounds and Shockwave A 3 Index xvi Welcome to NetObjects Fusion xvii Welcome to NetObjects Fusion 0 NetObjects Fusion 3 0 is the essential tool for building dynamic Web sites You can use NetObjects Fusion to create and maintain an entire site whether or not you know HTML NetObjects Fusion s Everywhere HTML eliminates the problems and confusion caused by browser differences Because NetObjects Fusion generates HTML pages based on page layout and publish settings you control you can build your site once and publish it everywhere In NetObjects Fusion s open site environment you can work the way you want to You can design pages using NetObjects Fusion s position based editor its text based editor an external HTML editor or a combination of all three Powerful message based animation and interactive authoring features included in NetObjects Fusion make it easy for you to create sophisticated effects You ll also nd it easy to add scripts JavaTM applets and servlets ShockwaveTM Flash Headspace RMF ActiveX controls and more About This User Guide This book explains how to build a Web site using NetObjects Fusion In addition to the basics of designing with text and graphics creating links and so on
2. 2 7 Using the Site View Tools 2 8 Selecting Pages 2 8 Working with Sections 2 9 Setting Page and Section Properties 2 9 Zooming In and Out 2 11 Adding Deleting and Moving Pages 2 12 Adding Pages 2 12 Deleting Pages 2 13 Moving Pages 2 13 Renaming Pages 2 14 Using Custom Page Names and Extensions 2 15 Setting Site View Properties 2 17 Collapsing the Site Structure Display 2 18 Printing Site or Section Structures 2 19 Working in Site Outline View 2 19 Sorting the Display in Outli
3. 26 4 Setting the Directory Structure 26 4 Setting the Site s HTML Output 26 7 De ning Server Pro les 26 10 Customizing Your Directory Structure 26 21 Creating a Custom Folder 26 21 Renaming Folders and Files 26 21 Deleting Folders 26 22 Rearranging the Directory Structure 26 22 Viewing and Setting Publication Properties 26 23 Suppressing a Page or Asset from the Published Site 26 24 Publishing Your Site 26 24 Additional Publishing Guidelines 26 26 Publishing with Firewalls or Proxy Servers 26 27 Publishing Special Assets 26 28 Managing Script Assets 26 29 Remote Server Access Checklist 26 29 xv A Working Around Browser Problems Problems with Actions
4. 5 11 Locking or Maximizing a Text Box 5 11 Supporting Your Design with HTML Output 5 14 6 Managing MasterBorders and AutoFrames Looking at MasterBorders 6 2 Working with MasterBorders 6 3 Modifying and Creating MasterBorders 6 3 Modifying a MasterBorder 6 4 Resizing a MasterBorder 6 5 Creating a New MasterBorder 6 6 Changing MasterBorders 6 8 Applying a MasterBorder to a Section 6 8 Renaming MasterBorders 6 8 Deleting MasterBorders 6 9 Using AutoFrames 6 9 Looking at AutoFrames 6 11 Adding an AutoFrame 6 13 Generating HTML Frame Borders
5. 11 3 Adding HTML Horizontal Rules 11 6 Adding a SiteStyle Line 11 7 Drawing Lines and Arrows 11 7 Editing Lines and Arrows 11 9 12 Using SiteStyles What Is a SiteStyle 12 2 Style View 12 2 About Style Elements 12 3 Applying SiteStyles 12 4 Editing SiteStyles 12 5 Editing a Style Background 12 5 Editing a Style Banner 12 6 Editing Text Settings for Buttons and Banners 12 7 Editing a Navigation Bar 12 9 Editing a Data List Icon 12 10 Editing the SiteStyle Line 12 11 Editin
6. 7 13 Using Layout Regions 7 14 Creating Layout Regions 7 15 Adding Objects to a Layout Region 7 15 Displaying the Layout Region Grid and Guides 7 16 Setting the Layout Region s HTML Output 7 17 Setting the Table Formatting Preference for Layout Regions 7 18 De ning the Layout Region as a Form 7 19 Setting Layout Region Background Properties 7 19 Making Layout Regions Dynamic 7 20 Using Text Boxes 7 21 Sizing a Text Box 7 21 Embedding Objects in a Text Box 7 24 Aligning Objects in a Text Box 7 28 De ning the Text Box as a Form 7 29 Making Text Boxes Dynamic 7 30 Using Tables for Page Layout 7 30 Using External HTML for Page Layout
7. 10 8 10 Placing Pictures Choosing an Image Format 10 2 Adding Pictures 10 3 Modifying a Picture 10 6 Resizing a Picture 10 6 Cropping a Picture 10 7 Tiling a Picture 10 7 Rotating a Picture 10 8 Creating a Border Around a Picture 10 9 Creating a Transparent GIF 10 10 Moving or Copying Pictures 10 11 Adding Text to a Picture 10 12 Using Image Assets 10 13 Editing a Picture 10 15 viii 11 Drawing Shapes and Lines Drawing Shapes 11 2 Adding Text to a Shape
8. 6 15 Setting Frame Properties 6 16 Adding Scroll Bars to Frames 6 17 v Making Frames Resizable 6 17 Setting the Frame Background 6 18 7 Laying Out the Page Using Layouts 7 2 Controlling Layout Appearance 7 2 Creating and Selecting Layouts 7 2 Renaming a Layout 7 4 Changing Layout Size 7 5 Adding Objects to the Layout 7 8 Setting the Layout s HTML Output Method 7 8 Setting the Table Formatting Preference for Layouts 7 9 De ning the Layout as a Form 7 10 Adding HTML and Scripts to a Layout 7 11 Setting Layout Background Properties 7 11 Changing the MasterBorder Selection 7 13 Making Layouts Dynamic
9. xix Getting Help xx 1 NetObjects Fusion Basics Introducing NetObjects Fusion 3 0 1 2 Work in an Open Environment 1 2 Generate HTML That Works Everywhere 1 2 Add Dynamic Content 1 3 NetObjects Fusion Views 1 3 Using the New Button 1 4 NetObjects Fusion Window 1 4 About the Properties Palette 1 5 About Toolbars 1 6 Previewing Your Site 1 7 Navigating in NetObjects Fusion 1 7 Finding an Object 1 7 Switching Between Views 1 8 Using the Go Menu 1 8 Using Shortcut Men
10. 4 12 Locating and Renaming Objects 4 12 Rearranging Layered Objects 4 13 Aligning and Distributing Objects 4 14 Making Multiple Objects the Same Size 4 15 Using the Standard Toolbar 4 15 iv Using the Advanced Toolbar 4 16 Using the Components Toolbar 4 17 Using the Form Toolbar 4 18 Interpreting the Warning Icon 4 19 5 Planning Your Site Preserving Your Design Intentions 5 2 Selecting HTML Output 5 3 Publishing with Nested Tables 5 4 Publishing with Regular Tables 5 5 Publishing with CSS and Layers 5 5 Optimizing Nested Tables Output 5 7 Optimizing AutoFrames
11. 17 8 Adding Check Boxes 17 9 Adding a Combo Box 17 10 Adding Submit Reset and Custom Buttons 17 12 Submitting Responses as Plain Text 17 14 Submitting Data to a Text File 17 14 Submitting Data in an Email 17 16 Processing Data with a CGI Script 17 17 Adding Hidden Fields 17 19 18 Using NetObjects Fusion Components Adding DynaButtons 18 2 Adding Sub Buttons 18 4 Using Ticker Tape 18 5 Adding a Site Map Button 18 6 Adding a Message Board 18 8 Adding Pictures That Roll Over 18 11 Adding Time Based Pictures 18 13 Loading Pictures onto Your Site 18 15 Adding Rota
12. 22 4 Auto Forwarding from a Transition Page 22 6 Accessing an Object s HTML 22 6 Inserting HTML in a Text Box 22 8 Coding Your Own Objects 22 9 Examples of Object HTML 22 10 Displaying a Message on Mouse Click 22 10 Linking to a New Window 22 11 xiii 23 Creating Custom HTML Framesets and Frames Understanding Frames 23 2 The Frame Scripting Process 23 3 Planning Your Use of Frames 23 3 De ning a Frameset 23 4 Frameset Paths and File Names 23 5 Relative Path Scenarios 23 5 Creating Frame Content 23 6 Scripting and Targeting Links 23 7 Scripting a Default Target Frame 23 8 Script
13. 25 8 Verifying File Assets 25 8 Opening File Assets 25 9 xiv Managing Links 25 9 Updating an External Link 25 10 Displaying the Page Containing a Link 25 10 Adding a Link 25 11 Deleting a Link 25 11 Verifying Links 25 11 Managing Data Objects 25 12 Managing Variables 25 12 Adding a Variable 25 13 Editing a Variable 25 13 Deleting a Variable 25 14 26 Publishing Your Site The Publishing Process 26 2 Using Publish View 26 3 Con guring Publish Setup
14. 13 8 Adding a Banner 13 9 Setting the Banner Style and Orientation 13 10 Customizing Banners and Buttons 13 11 Changing the Image for One Banner 13 11 Changing the Picture for One Button 13 13 Removing Banner or Button Image Customization 13 15 14 Creating Links and Anchors Working with Links 14 2 Creating an Internal Link 14 3 Adding an Anchor 14 5 Creating a Smart Link 14 7 Creating an External Link 14 9 Creating a File Link 14 11 Adding HTML to a Link 14 12 Creating an Imagemap 14 13 Editing an ImageMap 14 14 15 Placing Media Media Tools
15. 8 7 Formatting Paragraphs 8 7 Creating Multi Leveled Numbered and Bulleted Lists 8 8 Creating and Modifying Text Styles 8 9 Creating a Text Style 8 9 Modifying Styles 8 12 Modifying Styles by Example 8 12 Inserting Symbols 8 13 Wrapping Text around Objects 8 13 Setting Paragraphs to Clear Wrapped Objects 8 15 Creating and Editing Fields 8 16 Inserting a NetObjects Fusion De ned Field 8 16 Creating a User De ned Variable 8 16 Formatting a Date amp Time Field 8 18 Checking Spelling 8 18 Finding Text 8 19 Replacing Text 8 20 Countin
16. 15 2 Inserting Shockwave Files 15 2 Inserting a QuickTime Movie 15 6 Inserting a Video File 15 9 Inserting a Sound File 15 11 Inserting Other Types of Files 15 14 Replacing a Media File 15 17 Editing a Media File s Properties 15 17 x 16 Adding Java and ActiveX Inserting a Java Applet or Servlet 16 2 Inserting an ActiveX Control 16 5 17 Designing and Implementing Forms Creating a Form 17 2 Adding Objects to a Form 17 4 Naming Form Objects 17 5 Adding a Single Line Text Field 17 5 Adding a Multiple Line Text Field 17 7 Adding Radio Buttons
17. To import from a local drive you must know the drive and folder where the site s Home page usually named index htm or index html is stored To import from a remote location you must know the URL of the main site le such as index htm 3 8 Importing and Exporting C R E A T I N G N E W S I T E S You can limit the number of pages and the number of levels that NetObjects Fusion captures from either a local or remote site Levels are based on the hierarchy of pages in the source site de ned by the site s navigation the rst level is always the site s Home page The second level of the source site consists of pages that are linked from the Home page Third level pages are those linked from second level pages and so on You must be connected to the Internet when you re ready to activate the remote capture G When NetObjects Fusion imports a site it starts with the page you specify and stops importing when it hits the page number limit the site level limit or the end of the site If you don t de ne import limits NetObjects Fusion imports to the end of the site no matter how long that takes or how much it requires in system resources G In determining the number of levels NetObjects Fusion counts the designated top level page as level 1 then works down the site s structure stopping when it reaches the limit you set NetObjects Fusion imports as many pages as possible at a higher level before
18. A shipping form You can also modify or replace these templates with your own See Creating a Template on page 3 17 or Changing an Existing Template on page 3 18 for details 3 4 Importing and Exporting C R E A T I N G N E W S I T E S Sample Sites Included with NetObjects Fusion In addition to AutoSite and page templates NetObjects Fusion comes with two sample sites a small business site and a demonstration site These are templates with real content rather than placeholder content they re designed to showcase many NetObjects Fusion features You can use them as examples of how to implement various effects and results See Creating a Site from a Template on page 3 4 for information Sample site templates are stored in the NetObjects Fusion 3 0 Samples Sites folder Creating New Sites When you want to create a new NetObjects Fusion site you have three choices G You can start with a blank site and add all pages and content yourself Starting from a blank site is described in Creating and Opening Sites on page 2 3 G You can start from an AutoSite a NetObjects Fusion page template or a custom template and add or delete content as needed Starting from a template is described in Creating a Site from a Template on page 3 4 G You can start from an existing site created without NetObjects Fusion import it into NetObjects Fusion and add delete or re arrange content as needed Starting f
19. These are Curly Quotes These are Newspaper Quotes C O N F I G U R I N G P U B L I S H S E T U P Publishing Your Site 26 11 The Publish Setup dialog appears 2 Select the Server Locations tab 3 To modify an existing local server pro le select the pro le from the list and click Edit Continue with step 5 4 To create a new server pro le click Add NetObjects Fusion displays the New Location dialog with the Server Name eld blank and the Local publish setting selected by default 26 12 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P Enter a name for this pro le in the Server Name eld 5 Fill in the Directory eld using one of these methods G Enter the drive and directory path you want to use This path can point to an existing directory or create a new directory G Click Browse to display the Select Destination file dialog then select the local directory you want to use and click Open To create a new directory browse to and select the directory immediately above the location you want then click Open Enter the name of the new directory at the end of the path in the Directory eld To prevent your published site les from getting mixed in with other les enter or select a new or empty directory Also make sure the local drive has suf cient space for your published site les 6 To set the le name for the Home page of your site use the Ren
20. This chapter describes these HTML output methods and text ow choices including G NetObjects Fusion s three publishing methods their pros and cons and their application to different parts of your site G The difference between horizontal and vertical preference for page formatting G Matching your design priorities with the appropriate HTML output method 5 2 Planning Your Site P R E S E R V I N G Y O U R D E S I G N I N T E N T I O N S Preserving Your Design Intentions When you place a text box on a page it s shown in the default display font You then format the text size the object and position it relative to other objects on the page basing your efforts on the effects of your default display font and the size of the text box it creates When you preview or publish the page and view it in your browser the size of the text box and its alignment with the objects around it is controlled by the base font settings in your browser If your NetObjects Fusion base font is 10 point Times Roman and your browser base font is set to 14 point Arial you ll see an immediate difference in the arrangement and spacing of your objects because your text boxes expand to accommodate the new font size This is why you are advised to set the display fonts in NetObjects Fusion to match those of your browser so you are working in a WYSIWYG environment See Setting Preferences on page 1 12 for information This font vari
21. 10 16 Placing Pictures E D I T I N G A P I C T U R E C H A P T E R 1 1 Drawing Shapes and Lines 11 1 Drawing Shapes and Lines 11 In addition to pictures shapes and lines are essential building blocks for any page design You can draw rectangles rounded rectangles ellipses and polygons as well as HTML horizontal rules lines or SiteStyle lines You can select colors for a shape s ll and border add text to shapes select a color for lines or place a line picture from the SiteStyle you use for your site This chapter describes how to add drawn shapes and lines to your site and then modify them It includes G Drawing shapes G Adding text to a shape G Adding lines G Drawing horizontal rules G Drawing lines and arrows G Editing lines and arrows 11 2 Drawing Shapes and Lines D R A W I N G S H A P E S Drawing Shapes To draw an ellipse rectangle rounded rectangle or polygon Rectangle tool 1 In Page view select the Draw tool on the Standard toolbar and select the shape you want to add from the yout 2 Draw the shape on the page G To draw a polygon click to set the start point click to set each subsequent point and double click to complete the shape G When you draw a rounded rectangle NetObjects Fusion supplies one extra handle inside the object Use this handle to edit the degree of curve on the corners The Properties palette for the shape you selected appears For exa
22. 21 6 Specifying a Trigger Event 21 7 Specifying an Action Target 21 9 Specifying an Action Message 21 10 Specifying an Action Parameter Value 21 12 Creating Cascading Actions 21 15 Assigning an Action to a Text Link 21 17 Customizing Actions 21 17 Creating Custom Messages 21 18 Deleting a Custom Message 21 19 Scripting Custom Actions 21 20 Scripting JavaScript Expressions 21 23 Modifying Existing Actions 21 25 Customizing Action Choices 21 26 22 Working with HTML Directly Accessing the Page s HTML 22 2 Examples of Adding Page HTML 22 4 Centering a Page s Contents 22 4 Indexing Pages for Search Engines
23. 7 30 Selecting Layout Method 7 31 Text Box Considerations 7 31 vi Layout Considerations 7 32 Layout Region Considerations 7 33 Design Priorities and Method Choices 7 34 8 Designing with Text Working with Text Boxes 8 2 Working with a Text Box as a Text Editor 8 2 Working With a Text Box as an Object 8 3 Adding Text 8 4 Using the Text Tool 8 4 Dragging and Dropping a Text File 8 5 Pasting Text from the Clipboard 8 5 Setting Text Box Properties 8 5 Applying Text Styles 8 6 Formatting Text and Paragraphs 8 6 Formatting Text
24. Don t show when the page loads and an action When Object Show is received send message Set Visible Property On to target Hidden_Object myself The built in behavior for Set Visible Property On is to display the speci ed object when the ObjectShow message is received The Dynamic Page Building Process To add dynamic content and actions to your pages you follow this basic process 1 Design the activity and effects for each page Determine the sequence of actions the possible groupings and arrangement of objects and the most effective use of cascading actions Then compare all the dynamic pages within your site to identify duplication eliminate con icts or clashes and keep a big picture view of the site as a whole 2 On each page with dynamic content select the objects and assign the appropriate actions targets messages and parameters 3 Script custom parameters or custom actions as needed 4 Preview or publish then test your results in both 4 0 browsers The speci cs for each step are described in the remainder of this chapter Adding Actions to Objects 1 In Page view select the object to which you are adding an action 21 6 Building Dynamic Pages A D D I N G A C T I O N S T O O B J E C T S The object s default Properties palette appears 2 Select the Actions tab The Actions tab displays the Object ID for the current object 3 By default Object initially visibl
25. G To remove a parameter select it and click the minus button G To add a parameter click the plus button and enter a name and value in the Enter Value dialog 16 4 Adding Java and ActiveX I N S E R T I N G A J A V A A P P L E T O R S E R V L E T Typically you can add more instances of a parameter than already exists For example if text1 and text2 already exist an applet will probably recognize a text3 parameter you create If you add a parameter the applet doesn t recognize the parameter is ignored G To change the order of the parameters click the Up or Down arrow buttons The selected parameter moves up or down in the parameters list 8 To provide text that the browser displays if it cannot launch the applet or servlet enter the text in the AltTag eld 9 If your applet or servlet uses more than one class le and you need to add others click the List button then click Add in the Java Applet Files dialog 10 Select another class le from the Java Applet Files dialog and click Open Click OK to add the selected le To delete a class le from the Class list click the List button and select the appropriate applet in the Java Applet Files dialog Click Delete then click OK You can drag a Java class le from a folder onto your page The Java placeholder appears on the page and you can set the Java properties for that le Note After you place a Java object you cannot cha
26. You can either link to a page name or to the current page when you make a link to an anchor When you link to an anchor and the link is later present on another page the ability to link to the current page is useful Linking to an anchor on the current page ensures intelligent treatment of anchors by the browser For example suppose your layout contains a very long text box At the top and bottom of the text box you place anchors and in the MasterBorder you link the words To Top to the top anchor and the words To Bottom to the bottom anchor In the Link dialog instead of choosing the current page name in the Page Name section you choose the Current Page option Then you decide to copy that text box to another page with the same MasterBorder and replace its content with different subject matter Because you used the Current Page option the To Top and To Bottom links still work jumping to locations on the current page instead of the page where you made the links When you copy an anchor link from one page to another or when an anchor link is in a MasterBorder or AutoFrame you can make sure the link always points to an anchor on the current page by using the Current Page option in the Link dialog If you want an anchor link to always lead to a speci c page select a page name and then select an anchor 14 4 Creating Links and Anchors W O R K I N G W I T H L I N K S To create an internal link 1 In Page view select an object to
27. le assets in the dialog 5 Select the targeted AutoFrame from the Select Frame Target drop down list 6 Click Link to close the dialog and create the link 7 Preview or publish locally and test your targeted links 24 8 Working with AutoFrames T A R G E T I N G L I N K S I N A U T O F R A M E S Targeting the Full Browser Window To display the retrieved resource in the full browser window regardless of the type of link you use you can script the necessary targeting HTML yourself 1 In Page view select the object or text that you want to link The object s Properties palette appears 2 Click the Link button NetObjects Fusion displays the Internal Link tab of the Link dialog 3 Select the tab for the type of link you want Internal Smart Link External or File 4 Select or enter the page or resource that you are linking to the selected object 5 Make sure Select Frame Target drop down list is set to none 6 Click the HTML button The Before Tag tab of the Page HTML dialog appears 7 Select the Inside Tag tab In the text eld enter target _top This inserts your target statement inside the link tag that NetObjects Fusion creates for your object The value _top is an HTML default that displays the retrieved resource in the full browser window 8 Click OK to close the Page HTML dialog 9 Click Link to create the targeted link 10 Preview or publish locally
28. les and Headspace Beatnik les When a site visitor clicks the document s icon the le displays it in the visitor s browser or downloads to the visitor s system When you insert a le using the Plug in tool site visitors need the appropriate plugin for their browser and platform to use the le To insert a le using the Plug in tool Plug in tool 1 In Page view select the Plug in tool from the Media yout on the Advanced toolbar 2 Draw a box where you want to place the plugin The Open dialog appears 3 Select a le from your hard disk CD ROM or LAN To display the various le types that NetObjects supports use the Files of type drop down list To insert a plugin that is not explicitly supported by NetObjects Fusion choose All Files in the Files of type drop down list then select the plug in le 4 Click Open I N S E R T I N G O T H E R T Y P E S O F F I L E S Placing Media 15 15 The plug in placeholder image appears on your page and the Plug In Properties palette appears The name of the le you selected appears in the File eld on the General tab 5 To provide text for the browser to display if it cannot display the le enter a description in the AltTag eld 6 In the Display section select the option you want G To display the le on your site select Play inline G To open a new browser window in which to display the le select Play in new
29. on page 6 3 for information G You can show or hide Page view s visual aids page labels object icons and outlines and rulers and guides You can toggle these on or off by selecting the option you want to hide or show from the View menu Hiding or showing the Layout s visual aids does not have an impact on the published site G You can change the Layout margins by dragging the Layout handles See Changing Layout Size on page 7 5 for information Creating and Selecting Layouts Each page has a default Layout de ned by the Blank Site template Each Layout is attached to a single page unlike MasterBorders which can be applied to any page in the site There s no connection between Layouts on separate pages U S I N G L A Y O U T S Laying Out the Page 7 3 By default the new Layout is named PagenameLayout based on the current name of the page For example when you rst add a new page its page name is Untitled until you rename that page the default Layout is named UntitledLayout You can add multiple Layouts to a page each with its own properties design and content For example you might use several Layouts so you can prototype or publish several versions of the same page You could also create separate Layouts for different versions of your site such as English French media and text only When you publish the site NetObjects Fusion publishes each page using the Layout currently selected for that page
30. on page 21 5 6 Click OK in the Actions dialog 7 Click Link in the Link dialog Customizing Actions The actions messages and values described in Adding Actions to Objects are prede ned by and provided with NetObjects Fusion They represent samples of the typical actions you will use to make your pages dynamic However you might also want to G Create custom messages to support speci c combinations of actions G Script custom actions using JavaScript or VBScript to produce exactly the results you want G Script JavaScript expressions to create effects or perform functions 21 18 Building Dynamic Pages C U S T O M I Z I N G A C T I O N S Creating Custom Messages You can create custom messages and use them as trigger or action messages Any custom message that you de ne and use will typically be used twice once as the action Message sent when triggered by some other event and once as the When message to trigger another event For example in the of ce locations example described in Creating Cascading Actions on page 21 15 the custom message Hide all pro les works like this 1 When the site visitor clicks an of ce location the custom message Hide all pro les is sent as a cascading action message to the Layout 2 The Layout receives the custom message but it doesn t have any actions triggered by this message The Layout cascades the message down to its embedded objects 3
31. 2 4 Creating and Managing Sites C R E A T I N G A N D O P E N I N G S I T E S To start with a blank site 1 From the File menu choose New Site Blank Site The New Blank Site dialog appears You can also start a blank site by selecting the Blank Site option in the Welcome to NetObjects Fusion dialog 2 Enter a site name in the dialog Note For compatibility with NetObjects Fusion for Macintosh and Macintosh Web servers do not give your site a name with more than 26 characters Type a site le name here Click here to store the site in another location C R E A T I N G A N D O P E N I N G S I T E S Creating and Managing Sites 2 5 3 Click Save Site view opens a new site based on the Blank Site nft template and displays a Home page You re ready to begin adding pages to create your site s structure as described on page 2 12 2 6 Creating and Managing Sites C R E A T I N G A N D O P E N I N G S I T E S Opening an Existing Site 1 From the File menu choose Open Site The Open dialog appears 2 Double click the folder that contains the site you want to open 3 Select the site s nod le and click Open You can also open an existing site by doing any of the following G Selecting it in the Welcome to NetObjects Fusion dialog G Choosing it from the list of recently used les on the File menu NetObjects Fusion remembers the last four site les opened G Dragging the
32. 4 De ne each style element by double clicking it as described in Editing SiteStyles on page 12 5 As you de ne each element its image appears in Style view 5 Click Set Style to apply the new style to your site 12 14 Using SiteStyles M A N A G I N G S I T E S T Y L E S Your custom SiteStyle images and settings are applied to your site NetObjects Fusion creates a new folder in the Styles folder to contain your style elements See Styles Folder Structure on page 12 16 for information about the location of style folders Managing SiteStyles You can add new styles to the list of available styles such as those you obtain from your colleagues or those you create on your own You can also remove styles from the list and synchronize the list with the style folders currently in your Styles folder SiteStyles are stored in folders labeled with the style name Because NetObjects Fusion stores a list of SiteStyles with each site le you must add new styles you obtain to your site s style list before you can use them If you create a new site from a template your new site contains the same style list as the site from which the template was made If you import a template into your current site style names that were in the template s style list are added to your site s style list Templates created in NetObjects Fusion 3 0 also include the style folder for the template s style Templates created in earlier version
33. De ning a server pro le for each location where you want to publish your site These publishing settings are saved in your Sitename nod le for future use 2 Customize your site s directory structure if needed by a Re arranging and renaming site folders b Creating custom folders c Changing the publishing properties for folders pages and assets Your customized directory structure is saved in your Sitename nod le for future use The le and directory structure you use does not change the appearance design or content your site visitor sees it only controls the way the pages and assets are stored on the server 3 Publish your site to the selected server location Once you successfully publish you can re publish at any time by clicking the Publish button on the control bar You can also modify these settings at any time and then re publish U S I N G P U B L I S H V I E W Publishing Your Site 26 3 Using Publish View When you click Publish on the control bar Publish view opens Publish view looks similar to the Microsoft Windows Explorer or the Windows NT File Manager You must be in Publish view to publish your site The Directory pane on the left displays the le and directory structure of your site as it will be published on your server You can delete rearrange or rename folders shown in the Directory pane and you can create new subfolders at any level Components and their relate
34. G Adding text elds check boxes radio buttons and combo boxes G Adding Submit Reset and custom buttons G Submitting data via email or to a text le G Processing data with a CGI script G Adding hidden elds for client side parameters You can also use JavaScripts or Visual Basic routines with forms for example to do client side processing before sending data to the server For information on attaching script to forms see Chapter 22 Working with HTML Directly Note Don t publish pages containing forms using the CSS and Layers HTML output option or the forms won t display properly 17 2 Designing and Implementing Forms C R E A T I N G A F O R M Creating a Form With NetObjects Fusion you can create one or more forms on a page Devote an entire Layout area to a detailed survey or create one or more forms in a Layout Region table or text box One form might log product registrations for example while another emails customer comments to a product manager You can also add a form to the MasterBorder to appear on each of several pages Form Area tool 1 In Page view select the Form Area tool from the Standard toolbar and draw a rectangle in the Layout area or MasterBorder The Create Form dialog appears 2 Select a type of form G Create position based form Use this option to create a form in a Layout Region that you can resize and drag anywhere on the page When you add form objects text
35. R E P L A C I N G A M E D I A F I L E Placing Media 15 17 Replacing a Media File Sites are constantly changing and evolving As you build your site or after using it for some time you might want to change a media le that you used in a speci c location You can replace one le with another To replace a media le with a new le 1 In Page view or Assets view double click the media placeholder on your page The Open dialog appears 2 Select the new le and click Open Editing a Media File s Properties When you place a media le on your page you can set the properties for that le in the Properties palette The properties determine how the media le looks and works on your page After previewing a page or from site visitors feedback you might want to change the properties for a particular le To edit a media le s properties 1 In Page view click the media le s placeholder The Properties palette for that le appears 2 Change the options you want 3 Save the site 15 18 Placing Media E D I T I N G A M E D I A F I L E S P R O P E R T I E S C H A P T E R 1 6 Adding Java and ActiveX 16 1 Adding Java and ActiveX 16 You can make your site more interesting and interactive by adding special applications such as Java applets or ActiveX controls The tools in NetObjects Fusion make it easy to insert a Java applet Java servlet or ActiveX control and set i
36. S T O R I N G D A T A W I T H N E T O B J E C T S F U S I O N Data Publishing 20 3 Data publishing in NetObjects Fusion uses the following objects G data objects A data object is a collection of data elds the de nition of what data will be published Creating a data object is the essential rst step in adding internal or external data to your site The data object becomes an asset of your site When you store records internally you must specify the data elds you want to store When you store records from external data NetObjects Fusion includes all elds available in the source G data elds De ned in the data object data elds appear in the stacked pages and are the containers for the data in your site You can arrange and label the data elds and this arrangement appears in all stacked pages G data lists The data list appears on the parent page of the stacked pages that contain the actual data The data list functions as a table of contents for the internal or external data in your site You select the elds you want to display as column headers in the list The eld data from either the internal or external source populates the data list when you publish G stacked pages Each record in your database appears on a separate stacked page below the page containing the data list Stacked pages are not siblings of each other but instead are iterations of the same page containing the elds de ned i
37. for information on scripting techniques and requirements AutoFrames and Browser Refresh When a site visitor clicks an untargeted link in a frame that you created with AutoFrames the browser either refreshes the content of the body frame only or it refreshes the entire page Although this doesn t affect the appearance of the page for performance reasons you don t want the browser to refresh the entire page unnecessarily The HTML code that NetObjects Fusion generates for your AutoFrame pages controls this according to the factors listed below In all cases this is based on untargeted links links that depend on the default target of the frame Use this information to plan your use of AutoFrames G The browser refreshes the entire window if any one of the framed MasterBorders contains a dynamic object such as a banner highlighted navigation buttons or a smart link The dynamic object by de nition changes from page to page so the browser has to load the new page G The browser exits the frameset and displays the retrieved resource in the full browser window if the link retrieves a page with a different MasterBorder or an external HTML page If neither of these conditions exist the browser refreshes the body frame only Adding Content for Frameless Browsers Some site visitors might have browsers that don t support frames so you should include unframed content Site visitors using browsers that support frames do not s
38. 2 Click the HTML button The Between Head Tags tab of the Page HTML dialog appears 3 Select the tab that places your HTML or scripting in the proper location In the text eld of this tab enter the HTML or script for the current frame 4 Click OK to close the dialog To add HTML or scripts to an individual frame 5 In Page view click the frame to which you want to add HTML or script The General tab of the MasterBorder Properties palette appears 6 Select the Frame tab and click the HTML button The Between Head Tags tab of the Page HTML dialog appears 7 Select the tab that places your HTML or scripting in the proper location In the text eld of this tab enter the HTML or script for the current frame 8 Click OK to close the dialog For example you may want to help search engines categorize your site by adding a set of keywords to the frameset using the lt META gt HTML tag See Indexing Pages for Search Engines on page 22 4 for an example of lt META gt tag scripting 24 14 Working with AutoFrames A D D I N G O T H E R S C R I P T S T O A U T O F R A M E S C H A P T E R 2 5 Managing Assets 25 1 Managing Assets 25 NetObjects Fusion can manage all the les links data objects and variables used in your site In Assets view you can navigate to the pages on which these assets appear delete unused assets and verify the location of assets that are in use Because NetObjects Fusi
39. G Bottom_MasterBorderName htm G Top_MasterBorderName htm This source page is then used by all the frameset pages that share that MasterBorder Targeting Speci c Links When you add a link to an object located in an AutoFrame frameset you can target the retrieved results to display in one of three places G In a different frame on the same page within the same frameset Use this to target content to display in any frame other than the body frame G In the full browser window with no frames This removes the current frameset and displays the retrieved content in the full browser window G In a new additional browser window opened just for that purpose This window is also known as a new browser instance This leaves the original browser window open and the original frameset intact 24 4 Working with AutoFrames T A R G E T I N G L I N K S I N A U T O F R A M E S When you create AutoFrames you must also consider whether the browser refreshes all or part of the entire frameset when a site visitor clicks a link Although this is not a linking issue it has an impact on visitors to your site For more information see AutoFrames and Browser Refresh on page 24 10 Targeting a Link to Internal Pages 1 In Page view select the object or text that you want to link The object s Properties palette appears 2 Click the Link button The Internal Link tab of the Link dialog appears 3 If you re linking to an inte
40. If NetObjects Fusion does not recognize the word it displays the word in the Change To eld of the Spelling dialog 3 Choose to correct the selected word ignore it or add it to your dictionary Click G Ignore to skip this instance of the word G Ignore All to skip all instances on this page G Change to replace this instance G Change All to replace all instances on this page G Add to put the word in your personal dictionary G Suggest to see alternate spellings for the word in the Change to eld You can replace a misspelled word with a suggestion by double clicking the suggestion G Options to choose U S or UK English and to choose a location for your personal dictionary G Close to cancel the spelling check Finding Text 1 In Page view choose Find from the Edit menu 2 In the Find what eld on the Find dialog type the word letters or phrase you want to nd and select any options you want to use to narrow your search 3 Click Find Next 8 20 Designing with Text R E P L A C I N G T E X T Replacing Text 1 In Page view from the Edit menu choose Replace 2 In the Find what eld on the Replace dialog type the text you want to replace 3 In the Replace with eld on the Replace dialog type the replacement text 4 Select any options you want to use to narrow your search 5 Click Find Next to nd the next instance of the text you want to replace then c
41. If you have worked with Director les you should be familiar with these options For detailed information on the Controls tab options see the Shockwave or Director user guide Setting the Properties for Shockwave Flash or Splash 1 In Page view after adding a Shockwave Flash le select the Controls tab on the Properties palette The Controls options for the Flash or Splash le appear 15 6 Placing Media I N S E R T I N G A Q U I C K T I M E M O V I E 2 To control the display when using anti aliasing select a Quality option G AutoLow sets the default to normal quality The host computer uses high quality if it has the capacity G AutoHigh starts the movie in high quality The host computer uses low quality if it cannot display the movie in high quality G High anti aliases the movie on any computer G Low uses a normal quality so the movie displays quickly 3 To determine how the movie ts in the frame select the Scale option G ShowAll displays the movie within the frame but maintains the image proportions G NoBorder ts the movie within the frame so it lls the frame but maintains the ratio of the animation Some edges of the animation might be trimmed G ExactFit displays the movie exactly within the frame 4 To specify the movie s alignment within the frame select an Alignment option such as Left Right or Top 5 To play the movie automatically when the site visitor opens t
42. Instead you embed the object at a selected point in the text and then adjust its placement using HTML alignment positioning and text wrapping choices The resulting pages that NetObjects Fusion publishes however have extremely lean HTML code and load relatively quickly in the site visitor s browser Additional text box functions not directly related to your use of the text box as a page layout method such as creating and applying styles formatting text and inserting custom HTML tags are discussed in Chapter 8 Designing with Text Sizing a Text Box When you create or select a text box you can control four aspects of its size the width and internal margins the minimum height and the scaling of the text box to the full width of the Layout or the browser window To size a text box Text tool 1 In Page view either select an existing text box or draw a new text box using the Text tool from the Standard toolbar The Text Properties palette appears 7 22 Laying Out the Page U S I N G T E X T B O X E S 2 Select the Text Box tab if it s not already shown 3 To set the margins inside the text box enter a Text Inset value 4 To set the width of the text box select it and drag its object handles to stretch or shrink the text box as needed The text box is always the width you set for it unless you size it to the layout as described in Scaling a Text Box to the Layout on page 7 23 Setting
43. Setting the Display Options You set the display level to specify the relationship between the current page and the pages represented by the navigation bar You also use it to change the navigation bar orientation Illustrations in the Nav Bar Display dialog help you visualize the relationship of pages in the site s structure You can add as many navigation bars as you need and set each one to a different display level If a navigation bar appears in a MasterBorder assigned to pages at several different levels of the site the display level you select might not make sense at all levels To Highlighted button Button navigation bar U S I N G N A V I G A T I O N B A R S Creating Navigation Bars and Banners 13 5 make sure your site visitors have access to all levels of your site you can create new MasterBorders and place navigation bars with different display level settings in them To set the display options 1 In Page view select the navigation bar The General tab appears on the Navigation Bar Properties palette 2 In the Display section of the General tab click the Options button The Nav Bar Display dialog appears 3 In the Show section set the navigation option for this bar G First Level generates buttons linked to the children of your Home page G Parent Level includes links to all pages in the level above the current page in the site s structure G Current Level links the buttons to this page
44. The Picture Properties palette also appears A D D I N G P I C T U R E S Placing Pictures 10 5 6 Type a description of the picture in the AltTag eld Note The alt tag is not linked if the picture is an image map See Creating an Imagemap on page 14 13 for information For information on how to manipulate the picture see Modifying a Picture To place additional instances of a picture see Using Image Assets on page 10 13 You can also place an image by dragging and dropping it from the desktop or the Windows Explorer Note When you use drag and drop to place a picture that is not in gif or jpeg format NetObjects Fusion positions it in HTML using the lt EMBED gt tag instead of the lt IMAGE gt tag 10 6 Placing Pictures M O D I F Y I N G A P I C T U R E Modifying a Picture Once you place a picture you can G Resize crop tile or rotate it G Add a border around it G Change its transparency gif les only G Move or copy it G Add text to it Resizing a Picture 1 In Page view select the picture you want to resize The Picture Properties palette appears 2 Set the picture s Display property to Stretch 3 Drag any handle until the picture is the size you want To size the picture proportionally hold down the Ctrl key as you drag 4 To return the picture to its original size do either of the following G From the Object or shortcut menu choose Restore O
45. The only way you can permanently remove banners and navigation bars from your newly created sites is to edit the Blank Site template Navigation bar Text navigation bar Banner Button U S I N G N A V I G A T I O N B A R S Creating Navigation Bars and Banners 13 3 Using Navigation Bars Navigation bars are rows or columns of buttons or text that are automatically linked to other pages in your site NetObjects Fusion provides two types of navigation bars button navigation bars and text navigation bars Text navigation bars provide navigation for visitors whose browsers do not display navigation pictures Use the Navigation Bar tool to add navigation bars to MasterBorders or page layouts By default button names are the same as the page name unless you specify a custom name as described in Using Custom Page Names and Extensions on page 2 15 You can also split the button text into two lines by customizing the button name The style for buttons is determined by the SiteStyle you set in Style view described in Chapter 12 Using SiteStyles The SiteStyle button picture is automatically applied to buttons throughout your site You can change the button style for an individual navigation bar or even an individual button without changing the overall SiteStyle You create navigation bars using the default settings but you can customize the way they look You can choose buttons or text for navigation include borders around
46. This page becomes the parent of the imported page or pages 2 Select Import Template from the shortcut menu The Import Template dialog appears 3 Select the template you want to import G To import an AutoSite template open the AutoSites folder and nd the folder containing the template you want to use Open the selected template folder and select the TemplateName nft le within it G To import a page template open the Pages folder and nd the folder containing the template you want to use Open the selected template folder and select the TemplateName nft le within it 3 14 Importing and Exporting E X P A N D I N G Y O U R S I T E G To import a template located elsewhere on your system or network use the Import Template dialog to nd the folder containing the template you want to use Open the folder and select the TemplateName nft le within it 4 After you select the template click Open NetObjects Fusion imports the template and appends it under the page you selected The page data and all assets are stored in your current site folder The original template is still available in the NetObjects Fusion 3 0 Templates folder Importing Existing Sites You can expand your current site by importing and converting an existing site that was built without NetObjects Fusion The process is similar to creating a new site from an existing site but you are appending the existing site to your current site
47. To make a page collect data and function as an HTML form you can use the Form Area tool to place multiple forms on a single Layout or MasterBorder or you can set the Layout itself to function as a single form See Creating a Form on page 17 2 for information on creating multiple forms on a page To set the Layout to function as a single form 1 In Page view click the Layout or select it from the Object Tree The General tab of the Layout Properties palette appears 2 Select Layout is a form Note You cannot set the Layout to function as a form if it contains one or more Form Areas If the Layout is a form option is selected you cannot place another Form Area on the page 3 To assign the form processing settings to the Layout click Settings and enter your settings in the Form Settings dialog See Chapter 17 Designing and Implementing Forms for information on creating forms and determining form processing settings U S I N G L A Y O U T S Laying Out the Page 7 11 Adding HTML and Scripts to a Layout You can also add custom scripts or HTML code to a Layout When NetObjects Fusion publishes the site it can include your custom scripts or code in three places G Between the page s lt HEAD gt and lt HEAD gt tags G Inside the page s lt BODY gt tag G At the beginning of the page s body section before the rest of the page content To add HTML code or scripts to a Layout 1 In Page view
48. each CGI script has its own naming conventions but in general names can t include spaces or punctuation Check with your Web administrator or ISP for more information Adding a Single Line Text Field A single line text eld can accommodate just a few words such as a name or phone number 17 6 Designing and Implementing Forms A D D I N G O B J E C T S T O A F O R M After creating the form as described on page 17 2 Edit Field tool 1 In Page view select the Forms Edit Field tool from the Form toolbar 2 Draw a rectangle on the form 3 On the Forms Edit Field Properties palette de ne the eld s size content and name passed to the script processing the form G Name Type the argument for this eld that s passed to the CGI script processing the form Ask your Web administrator or ISP if you re not sure what s required here If you re using the Form Handler use a number indicating the object s order in the output text For example a eld with the name 2 where a visitor has typed St Louis might appear as 2 St Louis G Text Type text to appear in the eld by default This text is submitted as the response if the site visitor doesn t replace it G Password eld Select this option if the eld is for sensitive information like a password or credit card number Characters site visitors type are submitted to the script but depending on the browser visitors see asterisks bullet
49. including external links user de ned internal links and smart structural links For information on links see Chapter 14 Creating Links and Anchors Links between entries in a data list and their associated stacked pages do not appear in Assets view You can manage such links directly on the data list pages For complete information about data lists see Creating a Data List on page 20 18 25 10 Managing Assets M A N A G I N G L I N K S Updating an External Link 1 In Assets Links view double click the external link you want to update The Links dialog appears 2 Change the name in the Name eld if desired 3 Update the URL in the Link To eld and click OK Displaying the Page Containing a Link 1 Double click the link in Assets Links view The Links dialog appears 2 Select the page you want to see in the list of pages 3 Click the Go To button The page you selected appears in Page view Adding a Link 1 In Assets Links view from the Assets menu choose New Link or click the New button on the control bar The Links dialog appears 2 Enter a name and destination for your link and click OK List of pages that use the link M A N A G I N G L I N K S Managing Assets 25 11 Deleting a Link 1 In Assets Links view select the link you want to delete 2 From the Edit menu choose Delete Link or press Delete 3 Click Yes to con rm the deletion Note You ca
50. le even though it s not listed as being in use 4 In Publish view position the asset in your directory structure so when it s published it can be found by any HTML referencing it Because NetObjects Fusion doesn t edit paths to unmanaged assets in the published HTML you must position assets so the original paths will work See Customizing Your Directory Structure on page 26 21 Editing Referenced HTML To update referenced HTML edit the original les using any HTML editor such as Allaire HomeSite 3 0 which is included with NetObjects Fusion To add or modify assets do so in the original site folder as well When you preview or publish the site NetObjects Fusion copies the original HTML to your site s Preview folder or Web server If it s managing assets it copies asset les you add or modify too 19 14 Referencing and Editing External HTML E D I T I N G R E F E R E N C E D H T M L 1 In Page view select the referenced Layout area or object and click the Edit HTML File button on the External HTML Properties palette Or just double click the referenced page or object Your default HTML editor opens You choose this editor using the Preferences command on the Edit menu 2 Edit the HTML 3 Save your changes and close the le Click here in the Preferences dialog to select your default HTML editor such as Allaire HomeSite 3 0 E D I T I N G R E F E R E N C E D H T M L Referencing and
51. ll in a required eld G Output File Type a name for the le you want responses copied to Don t specify a path G Required Fields For each eld choose whether a response is required True or not False for a submission to be successful If you mark a eld True and a site visitor doesn t ll it in they see the error URL when they submit the form Note If any object in your form isn t listed in the Form Handler Properties palette you might have named it incorrectly For information see Naming Form Objects on page 17 5 3 If you re publishing to a UNIX server enter the following You might need to consult your Web administrator or ISP for this information G Perl Path for UNIX Type the path to the Perl application on the server Note that Perl 5 is required on the server G CGI Bin Directory Type the path to the directory on the Web server where CGI scripts should be copied G Storage Directory Type the path to the directory on the Web server where you want NetObjects Fusion to put the Output le 17 16 Designing and Implementing Forms S U B M I T T I N G R E S P O N S E S A S P L A I N T E X T Submitting Data in an Email You can also use the NetObjects Fusion Form Handler component to copy site visitors responses into an email to any address you specify Form Handler tool 1 In Page view select the Form Handler tool from the Component toolbar and draw a rectangle on the f
52. non Web standard 10 2 10 4 stacked pages and Assets view 25 4 imagemaps creating 14 13 editing 14 14 hotspots 14 13 images background 1 16 editing 1 18 from external source 18 15 see also pictures import template default MasterBorder 6 3 imported MasterBorders 6 3 importing assets 3 8 creating new sites guidelines 3 7 3 9 HTML pages 4 6 HTML tables 3 8 images from external data sources 20 17 limiting 3 8 page templates 3 13 pages 3 4 3 16 sites 3 1 3 4 3 16 sites from local drive 3 7 sites from remote location 3 7 sites existing 3 14 SiteStyles 12 14 templates 3 13 templates into sites 3 11 3 14 importing AutoSite templates 3 13 importing templates guidelines 3 12 3 13 indenting paragraphs in text boxes 8 8 Indexed Sequential Access Method drivers 20 11 indexing pages for search engines 22 4 inserting ActiveX controls 16 5 columns tables 10 8 HTML in text boxes 22 10 HTML tags 22 8 Java applets 16 2 Java servlets 16 2 media plug in les 15 14 15 16 objects into text boxes 7 27 QuickTime movies 15 6 15 9 rows tables 10 7 Shockwave les 15 2 15 6 sound les 15 11 15 13 variables 8 16 video les 15 9 15 11 inserting actions in scripts 21 22 installing ActiveX controls 16 5 interactive media see media les internal data elds name changing 20 10 internal data objects 20 6 adding stacked pages 20 25 internal links 14 2 14 3 ISAM drivers 20 11 J Java applets 16 2 16 4 Java le paramete
53. on page 4 14 G Add HTML scripts to a Layout Region See Accessing an Object s HTML on page 22 6 If you move the Layout Region all objects embedded inside move with it and maintain their positions within the Layout Region You can group objects within a Layout Region to reposition groups of objects on the page Adding Objects to a Layout Region Like a Layout a Layout Region can contain any object text pictures media or even other Layout Regions To add objects to a Layout Region you can either G Select the appropriate tool and create the object directly within the Layout Region borders 7 16 Laying Out the Page U S I N G L A Y O U T R E G I O N S G Drag objects into the Layout Region from elsewhere on the page To make the Layout Region expand as needed to contain the object drag the top left corner of the object into the Layout Region When you place or create objects in a Layout Region the Layout Region border changes to a thick outline indicating the object is contained in the Layout Region Embedded Object symbol When the pointer changes into the embedded object symbol you can drop the object You cannot paste an object inside a Layout Region Once you place objects in a Layout Region you can replace move or modify them as needed just as if they were on the Layout Displaying the Layout Region Grid and Guides To make it easier to place objects precisely in the Layout Region y
54. output methods best supports your site design priorities If your priority is Suggested page layout method Suggested HTML output method Lean ef cient HTML and fast browser load time Text box or page sized table Nested Tables Precise placement control for objects Layout and or Layout Region s Nested Tables Maximizing usability for site visitors with older browsers Text box sized to Layout Regular Tables Absolute control over minimum text box height Text box with size locked Nested Tables Precise placement control for selected content but lean HTML otherwise Text box for page with embedded Layout Region for selected content Nested Tables Wrapping text around images and other objects Text box and or table Nested Tables Overlapping selected objects Text box for page overlapped objects in Layout Region embedded in the text box Nested Tables for site CSS and Layers for Layout Region containing overlapped objects Wrapping page to varying browser sizes Text box sized to Layout with content wrapped to browser Nested Tables Drag and drop placement of objects while designing the page Layout and or Layout Region Nested Tables Horizontal or row based content ow such as spreadsheets or other tabular data Table sized to page Nested Tables Delivering objects with actions or other DHTML effects only to advanced browsers Text box and or table CSS and Layers S E L E C T I N G L A Y O U T M E T
55. the navigation bar modify the spacing within the navigation bar and change the background color You can assign an action to any navigation bar using the Actions tab of the Navigation Bar Properties palette For example you might want a navigation bar to y in from the top when the site visitor opens the page To make the navigation bar do this you assign it an action that executes when the page is loaded For information on creating actions and assigning them to objects see Chapter 21 Building Dynamic Pages Adding Button Navigation Bars You can add a horizontal or vertical button navigation bar to a page Buttons are linked to other pages in your site Choose pictures for buttons in Style view 13 4 Creating Navigation Bars and Banners U S I N G N A V I G A T I O N B A R S 1 In Page view go to the page on which you want to place the navigation bar Navigation Bar tool 2 Select the Navigation Bar tool from the Standard toolbar 3 Drag a box in the MasterBorder or Layout area where you want to place the navigation bar G Drag in a horizontal direction to create a horizontal navigation bar G Drag in a vertical direction to create a vertical navigation bar A new button navigation bar appears and the Properties palette displays settings for the navigation bar The bar contains buttons linked to the pages indicated by the setting in the Display eld of the Navigation Bar Properties palette
56. you ll nd chapters that elaborate on special topics including data publishing and using Net Objects Fusion components pre built mini applications that add functionality to your site Before you begin your projects refer to the NetObjects Fusion 3 0 Installation and Quick Start card and work through the lessons in NetObjects Fusion 3 0 Getting Started This is the most ef cient way to learn NetObjects Fusion If you are already familiar with an earlier version of NetObjects Fusion read Chapter 10 Upgrading xviii Welcome to NetObjects Fusion G E T T I N G H E L P From a Previous Version of NetObjects Fusion in NetObjects Fusion 3 0 Getting Started The manuals and online help assume you are pro cient with Windows 95 or Windows NT If you need help using these systems consult their respective user guides This guide also assumes you are familiar with the World Wide Web and its terminology For general advice about the web and examples of how to use NetObjects Fusion visit the NetObjects Web site www netobjects com For readability this manual presents all le names path names le extensions HTML tags and URLs in boldface Example names that you should replace with your own appear in bold italic Getting Help NetObjects Fusion offers several options for getting online help G Select Help Topics from the Help menu to launch the help system and display the table of contents G Right click an
57. 10 Creating an External Data Object from a Desktop Database 20 11 Creating an External Data Object from a SQL Data Source 20 14 Importing Images from an External Data Source 20 17 Creating a Data List 20 18 Deleting a Data Object 20 22 Creating Stacked Pages 20 22 Designing the Stacked Page Layout 20 22 Adding Navigation Buttons for Stacked Pages 20 25 Adding Stacked Pages for Internal Data 20 25 Deleting Stacked Pages 20 26 Adding Text and Images for Stacked Pages 20 26 xii 21 Building Dynamic Pages The Basics of Dynamic Pages 21 2 Objects Actions and Messages 21 3 Triggering Actions 21 3 An Active Objects Example 21 4 The Dynamic Page Building Process 21 5 Adding Actions to Objects
58. 10 6 imagemaps 14 13 internal data objects 20 7 20 10 internal links 14 3 Layout Regions 7 15 Layouts 7 2 MasterBorders 6 6 multiple images of a picture 10 7 new embedded objects 7 27 sites from existing sites 3 9 SiteStyles 12 12 smart links 14 7 templates from sites 3 17 text styles 8 9 transition pages 22 6 user de ned variables 8 16 see also adding placing cropping pictures 10 7 CSS and Layers 4 12 5 3 advantages 5 6 browser requirements 5 6 disadvantages 5 7 forms 17 1 publishing 5 5 CSS and Layers HTML output option 7 9 7 18 26 8 curly quotes 26 10 Current Page option links 14 3 custom actions scripting 21 20 21 25 custom extensions 2 15 custom frames 6 10 custom messages creating 21 18 deleting 21 19 custom names 2 15 Custom Names property pages 2 10 Custom Names property sections 2 11 custom page names specifying 2 15 customization navigation bars removing 13 15 customized assets 26 23 customizing actions 21 17 21 27 AutoFrames 24 1 banners 13 11 buttons 13 11 navigation bars 13 11 Index 4 templates 3 18 3 20 templates customizing with SiteStyles 3 19 see also changing editing modifying customizing parameters actions 21 13 D data submitting in email 17 16 data elds de ned 20 3 formatted text 20 9 image le 20 9 internal 20 9 simple text 20 9 data list icons 12 10 Data List tool 20 7 data lists creating 20 18 20 22 de ned 20 3 data objects de ned 20 3 del
59. 11 3 sharing site les 3 21 Shockwave audio les 15 2 Shockwave les formats 15 2 inserting 15 2 15 6 Shockwave for Director les 15 2 Shockwave plug in 15 2 shortcut menus 1 9 Show HTML Table Layout Properties palette 5 10 showing toolbars 1 6 SHTML extension 2 16 sibling pages 2 7 simple text elds de ned 20 9 single line text elds see edit elds site les 2 2 saving to network another computer 2 3 sharing 3 21 see also sites Site Mapper component 18 6 18 8 restriction on Preview 18 7 site names character limit 2 4 3 6 Site Navigation Window 4 6 Site Outline view sorting 2 20 site section directory structure publishing 26 5 site structure 2 7 collapsing expanding 2 18 expanding and collapsing 2 18 printing 2 19 Site tab 2 17 site tools 2 8 Site view 1 3 2 1 2 5 background color 2 18 collapsing expanding structure 2 18 orientation 2 18 Site view properties 2 17 sites author name 2 17 backing up 2 21 backing up automatically 1 17 backup settings 1 17 blank default MasterBorder 6 3 converting 3 7 creating 2 3 creating from existing 3 9 creating from templates 3 4 3 6 creating templates by exporting 3 17 distributing 3 21 expanding 3 11 exporting 3 17 3 21 import guidelines creating new sites 3 7 3 9 import limits 3 8 imported domain names 3 16 importing 3 4 3 16 importing existing sites 3 14 importing from local drive 3 7 importing exporting 3 1 levels 3 8 moving 3 21 Index 1
60. 21 script assets managing 26 29 server pro les 26 10 26 20 servers port and permission settings 26 19 setting method for sites 26 8 site section directory structure 26 5 sites 26 24 26 28 special assets 26 28 special character sets 26 9 to UNIX servers 26 17 unmanaged assets 19 13 Q Quality options Flash and Splash les 15 6 QuickTime movies inserting 15 6 15 9 QuickTime plug in 15 6 quotation marks in published sites 26 10 R RA RAM les 15 12 Radio Button tool 17 8 radio buttons 17 4 adding 17 8 Rapid Prototyping Module les 15 9 read only folders pages assets 26 23 RealAudio les 15 12 RealSpace FlashPix les 15 14 rearranging layered objects 4 13 rectangles see shapes referenced HTML editing 19 13 19 15 referenced HTML see external HTML referencing external HTML 19 1 Layout area of pages 19 4 sites 19 2 19 4 regular tables 5 3 publishing 5 5 Regular Tables HTML output option 7 9 7 18 26 7 Relative Alignment 10 13 11 5 12 8 relative paths 23 5 remote host 26 29 Remote Publish Server pro le 26 10 remote server access checklist 26 29 26 31 removing columns tables 10 8 links 14 3 rows tables 10 8 SiteStyles 12 15 renaming les 26 21 folders 26 21 Layouts 7 4 MasterBorders 6 8 objects 4 12 renaming pages 2 14 replacing le assets 25 6 media les 15 17 text 8 20 Reset button 17 12 resizing columns tables 10 7 frames 6 17 Layouts 4 3 7 5 7 7 Layouts to objects 7
61. 3 17 3 21 expressions JavaScript 21 23 HTML external see external HTML external data objects 20 6 creating from desktop database 20 11 20 13 creating from SQL data sources 20 14 20 17 ltering 20 19 importing images 20 17 importing pictures 20 17 ISAM drivers 20 11 ODBC drivers 20 11 external HTML as layout or object 19 9 publishing 19 11 referenced editing 19 13 19 15 referencing 19 1 referencing as object 19 6 19 8 referencing from Page view 19 4 referencing in Site View 19 2 19 4 using for page layout 7 30 external links 14 2 creating 14 9 updating 25 10 F le assets adding 25 4 deleting 25 7 managing 25 3 25 9 opening 25 9 replacing 25 6 types 25 3 unused deleting 25 8 verifying 25 8 File Data Source external data objects 20 15 File Extension Custom Names dialog 2 16 le extensions nft 3 2 nod 2 2 SHTML 2 16 le formats audio 15 11 images 10 2 Shockwave 15 2 le links 14 2 creating 14 11 targeting 24 7 le names framesets 23 5 HTML 2 14 23 5 les compacting 1 18 moving 3 21 renaming 26 21 ltering external data 20 19 nding text 8 19 nding objects 1 7 rewalls publishing with 26 27 Flash les 15 2 properties 15 5 Flashpix les 10 2 at directory structure publishing 26 4 youts 1 6 selecting tools 1 6 folders 1 19 aliased 26 17 26 20 26 22 custom creating 26 21 deleting 26 22 renaming 26 21 font substitution 8 6 fonts banners and buttons SiteSt
62. 4 custom adding to frames 24 13 displaying message on mouse click 22 8 dynamic 21 2 editing 1 18 22 3 editor choosing 1 14 le extensions 4 6 le extensions custom 2 15 frames targeting 24 2 generating comments 26 9 indexing pages for search engines 22 4 inserting in text boxes 22 10 keywords 22 4 linking to new window 22 9 Meta tags 22 4 not veri ed by NetObjects Fusion 22 1 object examples 22 8 page examples 22 4 HTML access for custom frames 6 10 HTML le names 2 14 character conversion 2 14 23 5 HTML les minimizing le size 17 4 HTML frame borders generating 6 15 HTML frames creating custom 23 1 HTML frameset 24 1 HTML horizontal rules 11 6 HTML output advantages of CSS and Layers 5 6 browser requirements for CSS and Layers 5 6 CSS and Layers 5 3 CSS and Layers format 7 9 26 8 disadvantages of CSS and Layers 5 7 JScript 5 3 Layout Regions 7 17 Layouts 7 8 nested tables 5 3 Nested Tables format 7 9 26 7 nested tables optimizing 5 7 5 13 I N D E X Index 7 publishing setting 26 7 26 10 regular tables 5 3 Regular Tables format 7 9 26 7 supporting site design 5 14 HTML pages importing 4 6 HTML tables importing 3 8 previewing 5 10 HTML tags inserting 22 8 HTMLadding 22 2 I image assets using 10 13 image le elds de ned 20 9 image le formats 10 2 data publishing 20 9 SiteStyles 12 13 image les drag and drop non Web standard 10 5 GIF les transparent 10 10
63. A N D B U T T O N S The General tab appears in the Navigation Button Properties palette 3 Double click the selected button or click Custom Image on the General tab The Picture File Open dialog appears 4 Select the image you want to use for the selected button G To use an image that is not already an asset in your site click the Folders tab navigate to the appropriate folder and select the image G To use an image that is already an asset in your site click the Image Assets tab and select the image from the name column For more information on choosing images see Adding Pictures on page 10 3 The selected button displays the new picture The picture does not include the text style attributes or name that NetObjects Fusion usually assigns to the button The original picture for the button is unchanged If you change the style assigned to the site the button no longer displays the custom picture For information about changing the button back to its original SiteStyle see Removing Banner or Button Image Customization C U S T O M I Z I N G B A N N E R S A N D B U T T O N S Creating Navigation Bars and Banners 13 15 Removing Banner or Button Image Customization If you change a banner or button picture and want to revert back to using the selected SiteStyle you can remove the customization 1 In Page view click the banner or double click the button to select it The General tab appears in t
64. D B U T T O N S Creating Navigation Bars and Banners 13 13 Changing the Picture for One Button You can change the picture on each individual button in a navigation bar in Page view When you assign a new picture to a button NetObjects Fusion does not display the page or custom name on the button If you want text to appear on the button you must include the text in your button picture You do not change the current SiteStyle when you customize a button picture Changing a button picture affects every instance of the button for that page even if the button is on different MasterBorders and on different pages For example if you change the picture for a regular button named Download in a primary navigation bar every instance of the regular Download button in all primary navigation bars in your site will change However the highlighted button for Download will not change nor will the Download buttons in secondary navigation bars The Download page itself which contains the highlighted button picture for the Download button remains unchanged To change both the regular and highlighted button you must customize both To change the picture for one button 1 In Page view navigate to the page containing the navigation button you want to change 2 Double click the button to select it A wide border surrounds the button to show it is selected 13 14 Creating Navigation Bars and Banners C U S T O M I Z I N G B A N N E R S
65. E C T S T O A F O R M Designing and Implementing Forms 17 9 G Group name Type the argument for this group of buttons that s passed to the CGI script processing the form Ask your Web administrator or ISP if you re not sure what s required here If you re using the Form Handler use a number indicating the button s order in the output text G Value sent Type the argument passed for the button if the site visitor selects it If you re using the Form Handler and a visitor selects a button named Large in a group named 4 the output text might appear as 4 Large G Default Choose either Selected or Not selected to set the button s initial status which is returned as the response if the site visitor doesn t change it Remember that only one radio button in a group can be selected at a time 4 To label each radio button use the Text tool to insert text next to it Adding Check Boxes You can provide check boxes for making one or more selections from a group of options or to turn a single option on or off Unlike radio buttons any number of boxes in a group can be selected at the same time or site visitors can leave them all unselected After creating the form as described on page 17 2 Checkbox tool 1 In Page view select the Forms Checkbox tool from the Form toolbar 2 Draw a rectangle on the form 17 10 Designing and Implementing Forms A D D I N G O B J E C T S T O A F O R M 3 On the F
66. Editing External HTML 19 15 Or double click the external HTML Click Edit HTML File on the Properties palette Your default editor opens for you to edit the original HTML 19 16 Referencing and Editing External HTML E D I T I N G R E F E R E N C E D H T M L C H A P T E R 2 0 Data Publishing 20 1 Data Publishing 20 NetObjects Fusion makes it easy to publish information such as employee directories product and service catalogs and event schedules You can enter manage and store this information as records either in your NetObjects Fusion site or in an external application such as a database or spreadsheet To publish the data you specify its source and create a layout for the pages that will display it NetObjects Fusion uses your Layout to create a separate page for each record and can automatically provide your site visitor with buttons to navigate between them This chapter describes how to publish data using NetObjects Fusion including G Static and dynamic data publishing G Creating a data object G Storing data internally G Using data stored externally G Creating a data list G Creating stacked pages 20 2 Data Publishing S T A T I C A N D D Y N A M I C D A T A P U B L I S H I N G Static and Dynamic Data Publishing NetObjects Fusion supports two kinds of data publishing static and dynamic G Static data publishing takes any kind of data text pictures multimedia les and so on
67. Fusion Do not move or rename the NetObjects Fusion 3 0 folder or any folders within it NetObjects Fusion performs best when the application and its parts remain in the folder recommended during installation This is especially true with the User Sites folder Since NetObjects Fusion keeps track of assets and links folder names and locations are very important If you change names and or locations using Windows Explorer or File Manager Net Objects Fusion might not be able to track assets and links properly The subfolders organize les according to their use G Components contains the NetObjects Fusion Components mini applications that can add sophisticated functions to your site See Chapter 18 Using NetObjects Fusion Components for information G Samples contains design parts such as picture les and animated gifs as well as plug in parts such as media les and Java applets that you can use to enhance your site design G Developer contains usage notes that explain how to create a custom Actions menu G NetObjects System contains les used by the program do not delete or remove these les G Styles contains a separate folder for each SiteStyle including the ones you create NetObjects Fusion style les have an ssf extension See Chapter 12 Using SiteStyles for information G Templates contains AutoSites and Page templates A NetObjects Fusion Template le has an nft extension and its own Assets
68. Inside Body Tag Adds code inside the lt BODY gt tag as in lt BODY attribute value gt where attribute value is your code G Beginning of Body Adds code just below the lt BODY gt tag A C C E S S I N G T H E P A G E S H T M L Working with HTML Directly 22 3 4 Enter your code in the white area of the dialog Your typing shown in blue appears in the dialog s grey area where you can preview its location in the HTML NetObjects Fusion generates You can click the Insert button to insert contents of an HTML script or other text le Click the Field button to insert a eld For information on elds see Managing Variables on page 25 12 5 Click OK Preview the site to test your code and view the source from your browser to see the resulting HTML To edit your code open the Page HTML dialog again click the tab containing the code and make your changes Note If you convert an AutoFrame back to a MasterBorder code added to the frame s content HTML is deleted To add HTML or script between the lt HEAD gt and lt HEAD gt inside the lt BODY gt tag itself or to the page s content just below the lt BODY gt tag Type or paste your HTML or script in the white part of the dialog Click to insert contents of an HTML script or other text le Click to insert a eld Preview your code in placeholder HTML that NetObjects Fusion generates 22 4 Working with
69. Internet Explorer 4 x Note Because of the security features in some browsers NetObjects Fusion cannot display a rollover picture in Preview You must publish the site locally or remotely to see how this component works 18 12 Using NetObjects Fusion Components A D D I N G P I C T U R E S T H A T R O L L O V E R To add pictures that roll over Rollover Picture tool 1 In Page view select the Rollover Picture tool from the Component toolbar 2 Draw a box on the page where you want to locate the pictures A picture placeholder appears on your page and the Picture Rollover Properties palette appears 3 To specify the rst image to display double click the Initial image row select the image from the Picture File Open dialog and click Open The Picture Rollover Properties dialog changes and displays two new rows Mouse over image and Mouse out image 4 To specify the image to display when the mouse pointer moves over the image double click the Mouse over image row select the image from the Picture File Open dialog and click Open A D D I N G T I M E B A S E D P I C T U R E S Using NetObjects Fusion Components 18 13 5 To specify which image to display when the site visitor moves the mouse pointer off the picture double click the Mouse out image row select the image from the Picture File Open dialog and click Open 6 To link the image to a speci c URL double click the Link URL row The Link di
70. Layers HTML output option G In either case check Do not manage or move assets NetObjects Fusion doesn t copy external assets into Assets view so it doesn t edit path names in the published HTML However you have to publish images and other assets yourself See Publishing Unmanaged Assets for information G Be sure Lock to Layout is selected on the External HTML Properties palette When you reference HTML from Page view choose Replace current lt HEAD gt In either case check this option When you reference HTML from Site view choose the ZeroMargins MasterBorder P U B L I S H I N G U N M A N A G E D A S S E T S Referencing and Editing External HTML 19 13 Publishing Unmanaged Assets If you choose not to manage assets when you reference external HTML les you have to get external pictures media les applets and other assets to the Web server yourself You can upload the les to the server with an FTP utility Or copy assets manually into Assets view and they are published when you publish the rest of the site 1 In Assets view from the Assets menu choose New File Asset The New File Asset dialog appears 2 Click Browse in the dialog to open an external asset you want to publish and type a name for the asset For more information on this dialog see Adding File Assets on page 25 4 3 Select Always publish le in the dialog This causes NetObjects Fusion to publish the
71. M E S The object s Properties palette appears 2 Click the Link button The Internal Link tab of the Link dialog appears 3 Select the External Link tab 4 If you are linking to a new external resource a Select the correct protocol for this resource from the URL drop down list http is the default for HTML pages b Enter the complete URL for the linked resource in the second URL eld c Enter a name for the external resource in the Asset Name eld If you are linking to an existing external resource select its name from the list of link assets 5 Select the targeted AutoFrame from the Select Frame Target drop down list 6 Click Link to close the dialog and create the link 7 Preview or publish locally and test your targeted links T A R G E T I N G L I N K S I N A U T O F R A M E S Working with AutoFrames 24 7 Targeting a File Link 1 In Page view select the object or text that you want to link The object s Properties palette appears 2 Click the Link button The Internal Link tab of the Link dialog appears 3 Select the File Link tab 4 If you are linking to a new le resource a Enter the complete URL for the linked resource in the URL eld or click Browse to open a le dialog and nd the resource b Enter a name for the external le in the Asset Name eld If you are linking to an existing le resource select its name from the list of
72. NetObjects Fusion creates the rst stacked page This shortcut can save you the effort of creating these buttons as described in Adding Navigation Buttons for Stacked Pages on page 20 25 12 Click OK The data list placeholder appears Its column heads are the names of the elds you selected for display and a data list button appears at the left of the rst row This is enough information for you to use the Properties palette to specify the appearance of your data list NetObjects Fusion populates the data list only when you preview or publish the page Data never appears in the data list in Page view 13 Click the data list to see the General tab on the Data List Properties palette Adjust the settings to change the bullet type background color border size and spacing of data You can also mouse over the column heading borders and drag them to set column width Field names identify columns of data This bullet is the Data List icon from the current SiteStyle 20 22 Data Publishing D E L E T I N G A D A T A O B J E C T When you are satis ed with the appearance of the data list create a Layout for your stacked pages as described in Designing the Stacked Page Layout on page 20 22 Deleting a Data Object 1 If you created stacked pages for the data object you must delete the stacked pages and any data lists before you can delete the data object Switch to Site view and select the stacked pag
73. O N T E N T below it Other types of assets have their own subdirectories Relative paths in an asset type structure are expressed as follows If the frameset is the Home page for your site the relative path to your content pages is HTML page html If the frameset is not your Home page the relative path to your content pages is page html If the frameset is not your Home page but you want to use the Home page as a source le for one of your frames the relative path to the Home page is index html G If you publish with By Site Section directory structure NetObjects Fusion puts the Home page in the top directory creates a subdirectory named for each major section of the site and puts the content pages into subdirectories for each section Relative paths in a site section structure can be expressed as follows If the frameset is the Home page for your site the relative path to your content pages is section_name page html If the frameset is in the same section as its content pages the relative path to the content pages is page html If the frameset is in a different section than its content pages the relative path to the content pages is section_name page html If the frameset is not your Home page but you want to use the Home page as a source le for one of your frames the relative path to the Home page is index html Creating Frame Content After you de ne your framese
74. P R I N T I N G S I T E O R S E C T I O N S T R U C T U R E S Creating and Managing Sites 2 19 You can also collapse the display by selecting a parent page and pressing Tab To expand the display press Tab again The Structure and Outline views display the same expanded and collapsed pages If you change the child pages hidden and shown in one view the other view re ects your changes See Sorting the Display in Outline View on page 2 20 for a description of Outline view Printing Site or Section Structures In Site view the Print command on the File menu prints the Site Structure view of your site or of a section You cannot print the Site Outline view The printed structure shows the same magni cation colors orientation and expanded or collapsed child pages that you see on the screen Its footer includes the author name number of site or section pages and the date the site was last modi ed G To print the entire site select the Home page or click All in the Print dialog G To print a speci c page and its children do any of the following Select the top level page Select a section Click Selected page and its children in the Print dialog This option is selected by default G To view what will be printed select Print Preview from the File menu G If you have a large site that might not t on a single page you can scale the printed site to the page From the File menu choose Print Setup
75. R E A T I N G A N D O P E N I N G S I T E S Creating and Managing Sites 2 3 By default your site folder is saved inside the User Sites folder but you can store the site in any location on your local computer Because the paths to the assets in a site le are absolute they include the drive and folder names you cannot save the site le on another computer on a network To do that export the site as a template as described in Chapter 3 Importing and Exporting Creating and Opening Sites When you create a site you always work from a template ranging from the most simple the Blank Site template to the professionally designed templates provided with NetObjects Fusion You can even derive templates from your own sites A template is a fully designed page or site that you can use as a starting point for your own pages or sites A typical template might include a banner and navigation buttons an assigned SiteStyle and in some cases text or other content You can start a new site from a template or insert one into your current site Templates are described in detail in Chapter 3 Importing and Exporting You can also open an existing site and add to it change its style or modify it Starting with a Blank Site You can start building a new site from a blank site which is a template consisting of a Home page with a banner and navigation buttons The blank site provides a starting point for creating a new site
76. Version 3 0 for Windows User Guide Copyright 1998 NetObjects Inc All rights reserved This manual as well as the software described in it is furnished under license and may only be used or copied in accordance with the terms of such license The information in this manual is furnished for informational use only is subject to change without notice and should not be construed as a commitment by NetObjects Inc NetObjects Inc assumes no responsibility for the consequences of any errors or inaccuracies that may appear in this book Except as permitted by the license for this manual no part of this publication may be reproduced stored in a retrieval system or transmitted in any form or by any means electronic mechanical recording or otherwise without the prior written permission of NetObjects Inc Trademarks NetObjects the NetObjects logo NetObjects Fusion SiteStyles AutoSites Everywhere HTML and Dynamic Actions are trademarks of NetObjects Inc Microsoft Windows ActiveX JScript and Windows NT are trademarks or registered trademarks of Microsoft Corporation Netscape Navigator Macromedia Shockwave Java JavaScript QuickTime HomeSite Headspace Lycos Yahoo and all other brand or product names are trademarks or registered trademarks of their respective holders GIF LZW compression licensed under U S Patent number 4 558 302 and foreign co
77. Web administrators let you install CGI scripts on their servers Some provide standard CGI scripts for you to use and a few don t support CGI at all For information on CGI support for your Web server consult your server administrator or ISP 1 In Page view click anywhere in the form except on a form object 2 On the form s Properties palette click the Settings button For a text box form look for the Settings button on the Text Box tab For other forms look on the General tab The Form Settings dialog appears 3 In the top half of the dialog specify the CGI script G Form Name Type an arbitrary name for the form This is required by some browsers G Action If the CGI script is already on the server enter its URL here for example 17 18 Designing and Implementing Forms P R O C E S S I N G D A T A W I T H A C G I S C R I P T http www host com myaccount fusionproject assets cgi bin mtscript cgi Note Normally NetObjects Fusion publishes CGI scripts to the cgi bin folder on the Web server If your server s con guration requires publishing scripts somewhere else you must use the Advanced Settings dialog to specify that location in the CGI script eld See Creating Aliased Folders and Setting the CGI Bin Directory on page 26 17 If the CGI script isn t already on the Web server but needs to be published along with your site s assets click Browse and select the script le to be publish
78. a Data List on page 20 18 and lay out your stacked pages as described in Creating Stacked Pages on page 20 22 Changing an Internal Data Field Name 1 Switch to Assets view 2 Click the Data Objects tab 3 Double click the data object name The Data Object dialog appears 4 Double click the name of the object you want to rename The Data Field dialog appears 5 Type a new name in the Name eld and click OK You can also change a Simple text eld to an Image eld and vice versa but you cannot change the type of a Formatted text eld Creating a Data Object for External Data External data exists in local desktop databases or in ODBC data sources To make this data available to your site you must choose an appropriate driver NetObjects Fusion uses two types of drivers to access external data C R E A T I N G A D A T A O B J E C T Data Publishing 20 11 G Indexed Sequential Access Method ISAM drivers These draw data from desktop databases such as Microsoft Access Paradox dBASE Microsoft FoxPro Microsoft Excel or delimited text les G Open Data Base Connectivity ODBC drivers These draw data from Structured Query Language SQL data sources such as Oracle and Sybase data les A data source is either of the following G an ISAM driver plus a source data le G an ODBC data source which is an ODBC driver bound to a database If your system includes both types of d
79. alt tag appears when the browser does not display the image C H A P T E R 1 5 Placing Media 15 1 Placing Media 15 Media such as sound and video give a site impact The tools in NetObjects Fusion make it easy to add various media les to your pages This chapter tells how to add G Sound les G Video G QuickTime movies G Shockwave les G Plugins NetObjects Fusion contains sample sound video and other media les that you can add to your pages These les are available in the NetObjects Fusion 3 0 Samples folder 15 2 Placing Media M E D I A T O O L S Media Tools The Media yout contains ve tools for placing different types of media on your pages Each tool and the types of les it helps you insert are discussed in this chapter Inserting Shockwave Files With Shockwave from Macromedia you can create multimedia graphics and audio that downloads quickly over a network NetObjects Fusion supports various Shockwave le formats including G Shockwave for Director 4 0 and 5 0 dcr G Director dir G Protected Director dxr G Flash swf and Splash spl To view these les site visitors must install the Shockwave plugin for their browser and platform These plugins are available from the Macromedia Web site at www macromedia com You cannot directly add a Shockwave Audio swa le to a page Instead embed it in a Director movie by passing it as a parameter to the
80. and Buttons on page 13 11 for more information Note When you edit a SiteStyle every site that uses the SiteStyle is affected Your Styles folder stores only one copy of a SiteStyle When you change it the change appears in all sites that use that SiteStyle If the style you want to change is used in other sites and you don t want them to be affected create a new style from the original style s graphic elements and customize the new style See Creating a SiteStyle on page 12 12 Backups of all your style folders are located in the Extras folder on your NetObjects Fusion CD ROM Editing a Style Background 1 In Style view select the style you want to change and double click anywhere in the background 12 6 Using SiteStyles E D I T I N G S I T E S T Y L E S The Background Style dialog appears 2 Select a background option G Select None to use the default background color set in the browser s preferences G Select Color if you want a solid color background such as white the default To choose a different color click the Color button and select from the Color Picker See Choosing Colors on page 1 9 G Select Picture to use an image le as a background Browsers tile the image across the page Click Browse to choose an image le from your hard disk CD ROM or LAN See Adding Pictures on page 10 3 3 Click OK Editing a Style Banner 1 In Style view select the style you want to
81. and drag it to the Layout height you want U S I N G L A Y O U T S Laying Out the Page 7 7 NetObjects Fusion displays a tip that reports in pixels the distance of the handle from the top left corner of the page It also adjusts the MasterBorder handle as needed to maintain the bottom border height The Layout and MasterBorder maintain a complete rectangle If you change the width of the Layout the widths of the top and bottom borders expand or shrink as needed If you change the height of the Layout the heights of the left and right borders change as needed Shrinking the Layout Automatically N In Page view from the Object menu select Size Layout to Objects The Layout height and width are reduced to the minimum size required by the MasterBorders and the current size and placement of objects on the page Note You can signi cantly reduce the size of the HTML le NetObjects Fusion generates for your page if you shrink the Layout Your pages can also bene t from shrinking the size of the MasterBorder see Resizing a MasterBorder on page 6 5 for information Layout width handle Layout height handle 7 8 Laying Out the Page U S I N G L A Y O U T S Adding Objects to the Layout The Layout is the default container for the page and can contain any object To add objects to a Layout you can either G Select the appropriate tool and create the object directly within the Layout G Paste the object into the
82. any of the following G To make the line longer or shorter drag an end handle G To make the line thicker or thinner drag a side handle G To change the shape of the end drag one of its handles 2 In the Style section select a style from the Head or Tail drop down lists to change the head or tail style 11 10 Drawing Shapes and Lines D R A W I N G L I N E S A N D A R R O W S C H A P T E R 1 2 Using SiteStyles 12 1 Using SiteStyles 12 SiteStyles are sets of thematic elements you can apply to your site Some style elements are graphical and others affect the text colors on your pages In Style view you use SiteStyles to create the look and feel of your entire site NetObjects Fusion comes with a gallery of professionally designed SiteStyles 55 SiteStyles are installed with NetObjects Fusion 3 0 and you can nd the SiteStyles from all versions of NetObjects Fusion in the Extras folder on your installation CD ROM You can use these SiteStyles as they are edit them or create styles using your own artwork to give your site a distinctive look This chapter describes SiteStyles and how to use them including G Applying SiteStyles G Editing SiteStyles G Creating SiteStyles G Adding and removing SiteStyles G Styles folder structure 12 2 Using SiteStyles W H A T I S A S I T E S T Y L E What Is a SiteStyle A SiteStyle is a collection of graphical and typographical elements that NetObjects Fusion
83. applies to every page in your site Your site s SiteStyle gives it a consistent look that survives variations introduced by your site visitor s browser When you change the SiteStyle NetObjects Fusion automatically updates every page in your site with the new look If you do not nd a pre built style that is appropriate for your site you can create your own custom SiteStyle Or if a SiteStyle works for most but not all pages in your site you can customize it for the exceptional pages as described in Setting the Navigation Bar Style on page 13 7 For even more exibility for example to use more than one banner image in your site or to use a different image for each button in a navigation bar you can use the Navigation Bar and Banner properties palettes in Page view as described in Customizing Banners and Buttons on page 13 11 Style View When you click the Style button on the control bar NetObjects Fusion displays Style view Style view shows G A list of available SiteStyles for this site G Elements of the selected SiteStyle W H A T I S A S I T E S T Y L E Using SiteStyles 12 3 About Style Elements NetObjects Fusion SiteStyles consist of two kinds of elements G Images for buttons banners data list icons SiteStyle lines and page backgrounds Button styles contain images for highlighted and non highlighted buttons The highlighted button image appears when a visitor is on the page represented b
84. assigning actions to banners 13 9 actions to Layout Regions 7 20 actions to Layouts 7 13 actions to text boxes 7 30 MasterBorders to imported sites 3 10 3 16 au les 15 11 audio le formats 15 11 author name 2 17 Auto Save preference 1 13 auto forwarding 22 6 AutoFrames 6 9 6 18 adding 6 13 adding custom HTML and scripts 24 13 browser refresh 24 10 converted to MasterBorders effect on HTML 22 3 customizing 24 1 de ned 6 9 dynamic elements 24 3 illustrated 6 12 optimizing 5 11 properties 6 9 selection sequence 6 14 targeting links in 24 2 targeting speci c links 24 3 see also frames AutoSite templates 3 3 importing 3 13 avi les 15 9 B background color Site view 2 18 tables modifying 10 4 background images 1 16 background sounds 7 12 background SiteStyle 12 5 backing up sites 1 17 2 21 Backups folder 1 20 Banner Custom Names dialog 2 16 banners 13 2 adding 13 9 assigning actions 13 9 changing pictures 13 11 default location 13 2 restoring SiteStyle 13 15 setting custom text 2 15 setting style of 13 9 setting style orientation 13 10 SiteStyle editing 12 6 text SiteStyles 12 7 using 13 8 13 10 base directory 26 29 BBS see Message Board blank site 2 3 default MasterBorder 6 3 starting with 2 4 Blank Site template 2 5 3 2 3 18 bmp les 10 2 borderless frames 6 15 borders 10 4 browser default display font 5 2 Browser Safe Palette 1 10 browsers displaying forms 17 4 font settings 1
85. at left you require NetObjects Fusion to create multiple tables with different sized columns By aligning the page objects as shown at right you create a simpler underlying table structure for the page 5 10 Planning Your Site O P T I M I Z I N G N E S T E D T A B L E S O U T P U T 2 Select Columns or Rows in the HTML Output section of the General tab to set the table alignment priority 3 Click and hold the Show button NetObjects Fusion hides grid lines guide lines and object borders in the Layout and displays solid grey lines that show where it is dividing the Layout into rows and columns 4 Identify underlying table cells that contain multiple text or other objects 5 Release the Show button 6 Move objects around as needed to improve the ef ciency of your HTML output If the row and column dividers are not separating objects the way you think they should those objects might not be aligned to each other with pixel accuracy Show Table Structure button C H A P T E R 5 Planning Your Site 5 11 To correct this Shift Click all the objects you want to align The Multi Object palette appears Click the alignment setting that your design requires for the selected objects 7 Repeat steps 3 through 6 as needed 8 Preview the site or page 9 To test the results reset your browser display fonts to a signi cantly larger size and preview the site again You can also preview table structure
86. banners 13 11 changing on one button 13 13 copying 10 11 creating borders 10 9 cropping 10 7 from external source 18 15 image assets 10 13 importing from external databases 20 17 inserting in frame background 6 18 modifying 10 6 10 13 moving 10 11 opening in image editor 10 15 resizing 10 6 rotating 10 8 tiling 10 7 see also images placing copied pictures 10 12 objects 4 7 see also adding creating plug in media les inserting 15 14 15 16 Plugin gif icon 15 15 PNG les 10 2 polygons see shapes Portable Network Graphics see PNG les ports specifying for publishing 26 19 position based forms 17 2 preferences General 1 12 page 1 15 setting 1 12 Preferences dialog 1 12 Preview table structure 5 11 preview choosing browser 1 13 Preview button 1 7 previewing compared to publishing 26 1 pages 5 9 sites 1 7 table cells 5 9 Previous Page button 4 5 Primary Navigation Bar 12 4 primary navigation bars 13 6 printing site structure sections 2 19 processing data with a CGI script 17 17 form responses 17 17 properties AutoFrames 6 9 Color pages 2 10 Color sections 2 11 Comments 2 11 Custom Names pages 2 10 Custom Names sections 2 11 edit elds 17 6 MasterBorder sections 2 11 page 2 9 page and section 2 9 Page Name 2 10 Page Type 2 10 publication customized 26 23 publication published date 26 23 publication suppressing page asset 26 24 publication viewing setting 26 23 Publish Don t Publ
87. be stored G If your site s Home page should be stored in the root directory of the user ID or server account that you use for loading your site leave this eld blank G If you want your site s Home page to be stored in a different directory than the root directory enter the relative path to it here 26 16 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P For more information on the base directory setting see Remote Server Access Checklist on page 26 29 9 In the Name eld enter the user ID needed to log on to the remote server so you can transfer les to it 10 In the Password eld enter the password that authorizes this ID to access the server To effectively publish your site you need server permissions that let you add les and create directories so you can transfer scripts and other executable resources to a directory on the server that lets them run 11 Select the Remember Password option unless you want to be prompted for your password every time you publish remotely to this server 12 To set the le name for the Home page of your site use the Rename the home page drop down list You can select G Index which is the default page name automatically recognized by most current servers This is the default G Current Page Name which is set by the value of the Name property for the Home page G Home G Default which literally uses the name default as in default
88. boxes and other objects to the region you can freely position and align them just as you do objects in a Layout area G Create text based form Use this option to create a form in a text box Text you type and form objects you add appear sequentially inline just as when you type This is a good choice for forms that have a lot of text where objects appear inline or that have a simple layout like a row of check boxes or single column of elds A text box form usually generates less HTML when you publish than a Layout Region form Provides exibility in arranging form objects Good for forms that include a lot of text or have a simple layout Useful for forms with a rigid tabular layout Use if this is the only form on the page Option not available when you create a form in a MasterBorder C R E A T I N G A F O R M Designing and Implementing Forms 17 3 G Create form in a table This option creates a table where you can line up form objects by inserting them in table cells Each cell acts like a text box where you type and add objects just as you add other objects to a table G De ne Layout as a form Use this option to ll your entire Layout area with a form You can t use this option if there s a form in the page s MasterBorder You ll also notice it s not available in the Create Forms dialog when you use the Form Area tool in a MasterBorder 3 Click OK 4 Add elds check boxes and other o
89. browser type and version and operating system G You can prioritize either the vertical or horizontal relationship between objects As a result site visitors are more likely to see the pages as you designed them C H A P T E R 5 Planning Your Site 5 5 regardless of their local browser font and display con gurations By default NetObjects Fusion assumes vertical relationships are most important G Pages published using Nested Tables can be viewed in most browsers that support the 3 2 HTML speci cation This includes Microsoft Internet Explorer 3 0 or higher and Netscape Navigator 3 0 or higher Nested Tables is the default publishing method for NetObjects Fusion Publishing with Regular Tables When NetObjects Fusion publishes your site Layout or Layout Region using Regular Tables it translates each page or Layout Region into an HTML table with rows and columns and places your content into table cells This table is the underlying structure of the page not a visible table object This output method gives you relative placement of content on the page your content maintains its position in the underlying table If text content expands because of a browser font setting its table row expands with it and the content below it on the page is moved down Regular Tables is the recommended output method in the following circumstances G When you want your pages to display successfully in older versions of some browsers G
90. by Default Check this option if you want this item initially selected Unless you re creating a list box and you select Allow Multiple Selections only one item in the list can be selected 5 To give the list a label use the Text tool to insert text next to it Adding Submit Reset and Custom Buttons After adding objects for collecting data from site visitors you need to add a Submit button to send the data to your Web server You can also supply a Reset button so visitors can clear the form if they want to enter responses from scratch And you can add a custom button that runs a script on the visitor s browser for example to calculate shipping for a purchase or to validate that the right information is entered in a eld Note If you re using the Form Handler component to send form responses in an email or to a text le create your Submit button as described in Submitting Data to a Text File on page 17 14 After creating the form as described on page 17 2 Name that appears in the list Value passed if this item is selected A D D I N G O B J E C T S T O A F O R M Designing and Implementing Forms 17 13 Button tool 1 In Page view select the Forms Button tool from the Form toolbar 2 Draw a rectangle on the form 3 On the Forms Button Properties palette choose the type of button you want to create and give it a label G Name Use the name your CGI script references G Text If you want a
91. change and double click the banner The Banner dialog appears E D I T I N G S I T E S T Y L E S Using SiteStyles 12 7 2 To change the banner s image click Browse to choose an image le from your hard disk CD ROM or LAN For information on choosing images see Adding Pictures on page 10 3 3 To change the appearance of text click Text Settings and set text options as described in Editing Text Settings for Buttons and Banners 4 Click OK Editing Text Settings for Buttons and Banners With SiteStyles you can choose any font on your system for banner and button text NetObjects Fusion dynamically generates image les for these banners and buttons using the font you speci ed for each element This means that on buttons and banners your site visitors see the fonts you select regardless of their browser or the fonts installed on their systems To set how text appears on navigation buttons and banners 1 In Style view from the Banner Primary Button or Secondary Button dialog click the Text Settings button The Text Settings dialog appears 12 8 Using SiteStyles E D I T I N G S I T E S T Y L E S G Select the left center or right Relative Alignment icon to align multiple lines of text in relation to each other This option applies only if you used Custom Names to specify a banner or button label of more than one line of text See Using Custom Page Names and Extensions on page 2 1
92. choose Open Object from the Object menu 2 The object appears in the application associated with it Adding and Modifying Alt Tags To make pages load faster some visitors set up their browsers so they do not display images To ensure that your pages provide the information you want to convey regardless of how the site visitor s browser is set up use alt tags to provide descriptive text that appears when images are not displayed Also Microsoft Internet Explorer 3 x and 4 x can display alt tag text in a ToolTip when the site visitor points at an object so make sure every alt tag is appropriate for a ToolTip NetObjects Fusion assigns a picture s le name as the alt tag when you place picture objects You can change the name to a more descriptive one in the Alt Tag eld on the Picture Properties palette You can add an alt tag to Java drawn shape hotspot generic plugin QuickTime Shockwave audio and video objects in the Alt Tag eld of their Properties palette Alt tag E M B E D D I N G O B J E C T S I N C O N T A I N E R S Page View Basics 4 11 To add or modify an alt tag N In the object s Properties palette type a descriptive name in the Alt Tag eld Embedding Objects in Containers In NetObjects Fusion a container is an object into which you can embed other objects A container can be any size and can hold any kind of object NetObjects Fusion provides four types of containers you can use to des
93. command 18 9 CLASS les 16 2 client side imagemaps 14 13 coding objects 22 11 Cold Fusion component Allaire 18 18 20 2 collapsing site structure 2 18 color font 12 8 text SiteStyles 12 11 Color dialog 12 8 color palettes 1 11 creating editing 1 11 loading custom 1 11 Color Picker 1 9 Color property pages 2 10 Color property sections 2 11 colors changing 1 9 inserting in frame background 6 18 Web safe 1 10 Columns HTML output option 7 9 7 18 columns tables inserting 10 8 removing 10 8 resizing 10 7 combo boxes adding 17 10 Comments property 2 11 Common Gateway Interface see CGI 17 1 compacting les 1 18 Component Development Kit 18 1 Component Tools toolbar Form Handler tool 17 14 components adding third party components 18 18 18 20 Components folder 1 19 Components toolbar 4 17 con guring publishing setup 26 4 constraining lines to horizontal vertical 11 7 control bar 1 5 illustrated 1 4 Last button 1 8 New button 1 4 Preview button 1 7 converting existing sites 3 7 Coolmaps components 18 18 copying objects 4 9 pictures 10 11 copying sites restrictions explained 3 17 3 21 copyright symbol inserting in text 8 13 creating borders around pictures 10 9 cascading actions 21 15 color palettes 1 11 custom folders 26 21 custom HTML frames 23 1 custom messages 21 18 external data objects 20 10 20 18 external links 14 9 le links 14 11 form objects 17 4 forms 17 2 forms from table cells
94. complete and your site is in place access it with your browser and examine your results You can now make changes to your site le Sitename nod and re publish the site or its changed assets as needed Additional Publishing Guidelines G Sites published with NetObjects Fusion work with any Web server on any operating platform No special Web server extensions are required G When you re publish your site NetObjects Fusion overwrites existing les as needed It does not however remove old les or obsolete assets from your local or remote directories you have to perform these housekeeping duties yourself G NetObjects does not publish through rewalls or to proxy servers See Publishing with Firewalls or Proxy Servers on page 26 27 for the steps necessary to publish your site to a protected server G If NetObjects Fusion has dif culty storing your site on a remote server Make sure your system is online and has a valid connection to your network or the Internet Make sure the server is not down or of ine P U B L I S H I N G Y O U R S I T E Publishing Your Site 26 27 Make sure your server pro le settings are correct Test the remote host account name and password settings displayed in the Location Properties dialog by using them to log onto the server using a separate FTP or telnet application Make sure your account has the appropriate permissions and that there is suf cient storage
95. content for this Layout only G CSS and Layers uses Cascading Style Sheet Positioning code layers and scripts to position and publish the content of this Layout only Setting the Table Formatting Preference for Layouts If you are using Nested Tables HTML output for this Layout you can set the table formatting preference NetObjects Fusion protects when it publishes the site This setting determines whether the horizontal or vertical relationship between objects on this Layout is more important To set the table formatting for the current Layout 1 In Page view click the Layout or select it from the Object Tree The General tab of the Layout Properties palette appears 2 In the HTML output section of the General tab select G Columns to preserve the vertical relationship between the Layout s objects This is the default G Rows to preserve the horizontal relationship between the Layout s objects See Preserving Your Design Intentions on page 5 2 for information on selecting the table formatting preference 7 10 Laying Out the Page U S I N G L A Y O U T S 3 To preview the impact of your selection on the current size and placement of your Layout s objects press and hold the Show button NetObjects Fusion hides any grid lines guide lines and object borders in the Layout and displays solid grey lines that show where it is dividing the Layout into rows and columns De ning the Layout as a Form
96. create the directory structure you de ned If your service provider does not let user accounts create directories then you must use the Flat directory structure option to publish your site My account does does not have permission to create server directories 9 How much server space do you have Before you publish you should publish your site locally and check the size of the generated Sitename Publish folder including all its sub folders Con rm that it takes less space than the maximum allowed by your service provider My account s storage capacity _________________________ 26 32 Publishing Your Site R E M O T E S E R V E R A C C E S S C H E C K L I S T A P P E N D I X A Working Around Browser Problems A 1 Working Around Browser Problems A There are a few circumstances when later versions of browsers don t properly display or handle actions forms and other objects you create in NetObjects Fusion This appendix describes browser problems with G Actions G Forms G Sounds and Shockwave objects You can work around many problems by changing the HTML output method used to publish the particular page or Layout Region For more information see Selecting HTML Output on page 5 3 Also see the usage notes at www netobjects com support for the latest information on browser problems A 2 Working Around Browser Problems P R O B L E M S W I T H A C T I O N S Problems with Actions If you
97. custom images to DynaButtons The buttons style is determined by your SiteStyle To use custom images for buttons use the Picture Rollover tool Because a DynaButton is an active link the button appears active when a site visitor moves the mouse pointer over the DynaButton or clicks the button The site visitor can click the DynaButton to go to the appropriate link Note Because of the security features in some browsers NetObjects Fusion cannot display DynaButtons in Preview To see how your DynaButtons work you must publish the site locally or remotely and browse it via http protocol A D D I N G D Y N A B U T T O N S Using NetObjects Fusion Components 18 3 To add DynaButtons and set properties DynaButtons tool 1 In Page view select the DynaButtons tool from the Component toolbar 2 Draw a box on the page to indicate the DynaButtons location A button placeholder labeled DynaButtons appears on the page along with the DynaButtons Properties palette 3 Select the buttons orientation vertical or horizontal from the drop down list 4 Double click the Number of Buttons row specify how many buttons you want and click the check mark 5 Double click the number row such as Button 1 The Link dialog appears You can link this button to another page le smart link or external link For information about adding links see Working with Links on page 14 2 6 Create the link for the button
98. different text label select Text and type the label in the eld G Image To use a picture as a label select Image click Browse and choose an image le from the Open dialog G Type Choose the type of button you want to create from this drop down list Choosing Submit creates a button that sends the site visitor s responses to the Form Handler or CGI script on the Web server Choosing Reset creates a button that reverts to the form s initial settings And choosing Button creates a custom button that runs the script you add using the HTML button G HTML Click here to open the Object HTML dialog and add a script that runs on site visitors browsers when they click the button you re creating Do this for a custom button to de ne what it does For more information see Accessing an Object s HTML on page 22 6 The button s label can be text or a picture Selecting Button creates a custom button Click here to attach a script de ning what your custom button does 17 14 Designing and Implementing Forms S U B M I T T I N G R E S P O N S E S A S P L A I N T E X T Submitting Responses as Plain Text You can have responses submitted as plain text in an email or to a le on the Web server using the NetObjects Fusion Form Handler component When you use the Form Handler you don t have to provide your own CGI script Note Using the Form Handler component might require con guration of your Web s
99. does not change the size of existing pages in your site However if 1 16 NetObjects Fusion Basics S E T T I N G P R E F E R E N C E S you change the Grid Size setting it will change the size of the grid on both new and existing pages For more information about page size see Displaying a Page in Page View on page 4 2 G Background Image pixels Most Web browsers add a margin at the top and left of the page this margin can vary from 6 to 16 pixels However no margin is added for background images a background image is aligned at the top and left edges of the page If you need to match a background pattern to objects on the page use this setting to compensate for the shift of your content in the browser Note that this option does not affect the generation of HTML in any way it affects only the appearance of your page Layout in NetObjects Fusion The default settings Offset selected Left 10 Top 16 are optimized for Netscape Navigator 3 0 and Microsoft Internet Explorer 3 0 and 4 0 running on Windows However not all browsers on all platforms use the same margin For example Netscape Navigator 4 0 for Windows and 3 0 for Macintosh use Offset selected Left 8 Top 8 These settings also do not apply if you use frames in that case the settings are always Left 2 Top 2 If you set the Background Image Offset be sure to test your pages using the browsers you want to support S E T T I N G P R E F E R E N C E S NetObje
100. for Layout dimensions is set on the Page tab of the Preferences dialog To set the unit of measurement select Preferences from the Edit menu See Setting Preferences on page 1 12 for information Setting a Speci c Layout Size 1 In Page view click the Layout or select it from the Object Tree The General tab of the Layout Properties palette appears 2 Set speci c Layout dimensions by entering a number in the Width and Height elds 7 6 Laying Out the Page U S I N G L A Y O U T S If the number you want is lower than the minimum allowable size NetObjects Fusion displays a message and offers to set the Layout size to the minimum allowable size Note Page Width and Height are display only elds that calculate the total dimensions of the page by adding the MasterBorder to the Layout A standard page size is 600 pixels in width any size over that might force site visitors to scroll their browsers left or right to see the entire page Sizing a Layout by Dragging 1 In Page view if rulers are not visible choose Rulers amp Guides from the View menu 2 Click the Layout width handle in the top ruler bar and drag it to the Layout width you want NetObjects Fusion displays a tip that reports in pixels the distance of the handle from the top left corner of the page It also adjusts the MasterBorder handle as needed to maintain the bottom border height 3 Click the Layout height handle in the left ruler bar
101. from the Assets menu choose Verify All File Assets NetObjects Fusion veri es and reports the path status of all les G When a le s path information is correct NetObjects Fusion lists the date and time found in the Verify Status column G When a le s path information is incorrect and the le or folder cannot be found NetObjects Fusion displays this dialog 2 Resolve the paths of any lost les or folders M A N A G I N G L I N K S Managing Assets 25 9 G To specify a new path click Browse and locate the le or folder G To skip the lost item and continue veri cation click Skip NetObjects Fusion gives this le Not Found status and goes on to verify subsequent les or folders G To stop the veri cation process click Cancel The veri cation status of the current le or subsequent les is not updated 3 When veri cation is complete click OK in the con rmation dialog Opening File Assets You can open a le asset in the application with which it is associated For example you can open a gif or jpeg le in your paint program directly from NetObjects Fusion To open a le asset 1 In Assets view select the asset 2 From the Assets menu choose Open Asset For information on le types and applications see To create or modify a le type in Windows 95 Help Managing Links When you click the Links tab a list of all the links used in your site appears
102. going to a lower level G HTML coding practices vary so the contents of the source site pages are unpredictable Not all HTML coding syntax translates identically into NetObjects Fusion format particularly incomplete or nonstandard tags Some pages will convert more accurately than others Spaces in html le names might cause problems importing a site G NetObjects Fusion imports assets such as Java applets Shockwave and other media It does not import server side imagemaps or manage server side resources If the imported site originally used server resources such as a CGI script or Server Side Includes you must manually recreate these on your server G NetObjects Fusion imports and converts HTML tables If the source table has a visible border no row or column spans and a maximum size of 20 x 20 cells then NetObjects Fusion converts it as a table This works for regular and nested tables that meet the criteria Otherwise NetObjects Fusion converts the table into a series of text boxes and positions them on the page to represent the table structure NetObjects Fusion tables do not support vertical alignment attributes C R E A T I N G N E W S I T E S Importing and Exporting 3 9 G NetObjects Fusion s import feature supports the HTML 3 2 speci cation Cascading Style Sheet CSS coding is removed from pages during import Content with no other alignment formatting is placed ush left on its respective page G When you impo
103. html Your server administrator can tell you whether to use Home or Default instead of Index If you use Current Page Name your site visitors must include the exact le name as part of the URL to reach your site 13 Set the default le name extension applied to each page in your site by either G Selecting htm html or shtml from the drop down list G Entering an extension of your choice directly in the extension eld Your server administrator can tell you which extension is the default for your server C O N F I G U R I N G P U B L I S H S E T U P Publishing Your Site 26 17 Note If you de ne a le name extension for an individual page in the Custom Names dialog that extension overrides the site default for that page 14 To convert all spaces and most non alphanumeric characters in asset le names to underscore characters _ select Replace le name spaces with underscores Your site might be hosted on a UNIX server that cannot handle spaces in le names so it s recommended that you select this option NetObjects Fusion does not replace periods or hyphens because all servers understand those characters 15 Click OK to complete the con guration of the remote server pro le Creating Aliased Folders and Setting the CGI Bin Directory Sometimes you need to store certain assets of your site in a location separate from the rest of your site For example G You can link to programs su
104. image from the bottom left 21 4 Building Dynamic Pages T H E B A S I C S O F D Y N A M I C P A G E S G Send cascading messages to grouped or collected objects so one message gets sent to multiple related objects An Active Objects Example Suppose you are creating a site for a non pro t organization that is having its annual fund raising drive You want to provide a Click for Status button that displays a thermometer indicating the progress of the fund raising efforts You can do this using a simple action that makes an image appear when you click on a button object The example works like this 1 When a site visitor clicks the object the browser sends a Mouse Down message to the button object itself that s how the button knows it has been clicked 2 When the button object receives the Mouse Down message it triggers the object to send a message called Object Show to its target an image that is currently on the page but hidden 3 When the hidden object receives the Object Show message it triggers the action attached to the hidden object which changes the image object s visible property to true A D D I N G A C T I O N S T O O B J E C T S Building Dynamic Pages 21 5 In this example G The button object has an action whose trigger event is de ned as a mouse click on that object When Mouse Down send message Object Show to target Hidden_Object G The hidden object has an initial setting
105. in front of another See Creating Overlapping Objects on page 4 12 for details C H A P T E R 5 Planning Your Site 5 7 G CSS and Layers is the most ef cient output method for dynamic pages containing objects that have actions See Chapter 21 Building Dynamic Pages for information on developing DHTML CSS and Layers Cons G If you publish using CSS and Layers site visitors who have older browser versions see the content stacked vertically against the left margin of the browser not laid out in your page design G Because of its use of absolute positioning CSS and Layers is less suited for text rich pages If a CSS and Layers page is viewed in a browser with large font settings the text boxes expand without regard for other objects on the page the result can be unintended overlapping of objects Optimizing Nested Tables Output If you use Nested Tables to output HTML for a Layout or Layout Region you can control the text ow for each container by setting the table formatting priority columns or rows that NetObjects Fusion uses to generate the page This helps preserve your design intentions when a browser s font settings change the size of your text content For example a Columns or vertical priority keeps text together in a vertical orientation when text size changes rearrange the page 5 8 Planning Your Site O P T I M I Z I N G N E S T E D T A B L E S O U T P U T A Rows or horizontal priority
106. in the browser by holding down Shift when you click the Preview button Optimizing AutoFrames You can control realignment of AutoFrame content by selecting for each frame the primary table alignment setting that best preserves your design intentions When you press and hold the Show button to preview the Layout s table row and column structure the preview includes the table structure that NetObjects Fusion expects to use within AutoFrames Locking or Maximizing a Text Box There are three text box properties you can apply to reduce the impact of variations in browser con gurations locking the minimize size of the text box sizing the text box to ll the Layout and wrapping the text box contents to the browser width 5 12 Planning Your Site O P T I M I Z I N G N E S T E D T A B L E S O U T P U T G Locking the minimum size of a text box prevents automatic resizing by the browser if the display font is smaller than anticipated When you publish a page with a locked text box NetObjects Fusion generates HTML code that hard wires the minimum size of the text box If the display font is bigger than expected the height of the text box expands as needed it will not shrink to a size less than the locked size G You can set the text box to automatically maximize itself to the full size of the Layout that contains it If you embed all the page s objects into a text box for example then you might want to make sure the text bo
107. in these elds can be formatted individually Formatted text elds can contain paragraph breaks and line breaks and can exceed 255 characters You cannot sort on formatted text elds G Image le elds These elds can contain an image in one of these formats bmp gif animated embedded interlaced jpg jpeg pct pcx pict png psd tga or tiff You can sort on image le elds Note Take special care as you de ne elds Once you click OK in the Data Field dialog you cannot delete the eld from the data object 5 Repeat steps 3 and 4 to add elds 6 When you are done click OK in the Data Object dialog 20 10 Data Publishing C R E A T I N G A D A T A O B J E C T The data object is now an asset of your site and you can continue as follows G If you re working in Page view the Data Publishing dialog is still open You can select elds and format the data list as described in Creating a Data List on page 20 18 and lay out your stacked pages as described in Creating Stacked Pages on page 20 22 G If you re in Assets view take these additional steps a Switch to Page view Data List tool b Select the Data List tool from the Advanced toolbar and draw a rectangle on the page The Data Publishing dialog appears c Select the newly created data object from the drop down list You can now select elds and format the data list as described in Creating
108. introduction to the NetObjects Fusion views see NetObjects Fusion Views on page 1 3 Finding an Object Use the Go To button on the control bar to nd any named object in NetObjects Fusion Click the Go To button enter the name or partial name of the object you want to locate in the Go To dialog and click OK If only one object meets your criteria NetObjects Fusion opens the appropriate view or dialog to display the object If several objects meet your criteria NetObjects Fusion displays a list you can pick from 1 8 NetObjects Fusion Basics N A V I G A T I N G I N N E T O B J E C T S F U S I O N Switching Between Views To return to the previous view click the Last button on the control bar Click the button again to redisplay the current page or view Use this button to quickly switch back and forth between the current and last view or page Using the Go Menu The Go menu provides all the navigation features in one place and shows equivalent keyboard shortcuts A dot to the left of a command indicates your current view The Go menu commands vary slightly from view to view G From all views you can go to any other view From Site view and Assets view you can also navigate to the subviews from Page view you can go to other pages G Use the Go To command the same way you use the Go to button on the control bar to nd any named NetObjects Fusion object in your site G Use the Last command to go to the last page or
109. is smaller than the Layout Region the browser automatically tiles the image as needed For more information on using the Picture File Open dialog see Using Image Assets on page 10 13 Making Layout Regions Dynamic You can make Layout Regions dynamic by assigning actions to them For example you can make a Layout Region s background change colors when the site visitor s mouse pointer passes over it or make a Layout Region y in to its proper location when the page nishes loading in the visitor s browser U S I N G T E X T B O X E S Laying Out the Page 7 21 You can also make a Layout the target of an action assigned to another object See Building Dynamic Pages on page 21 1 for a discussion of making pages and objects dynamic and the procedures for adding actions to Layout Regions and other objects Using Text Boxes The text box not only serves the basic purpose of holding the words and sentences of your text it also works as a container for other kinds of objects You can type or paste text into a text box and you can also embed pictures sound objects tables and any other object into that text box When you do so you are using the text box as a layout container for your page s content When you use a text box as a layout container you do not have pixel level control over embedded objects For example you do not insert a picture object in a text box and then drag it to the location you want
110. like the gure below 5 Click OK to close the dialog 23 12 Creating Custom HTML Framesets and Frames A D D I N G C O N T E N T F O R F R A M E L E S S B R O W S E R S A site visitor with a browser that supports frames sees the framed site as you designed it A site visitor with an older frameless browser sees the lt NOFRAMES gt message such as in the example C H A P T E R 2 4 Working with AutoFrames 24 1 Working with AutoFrames 24 When you use AutoFrames you use the MasterBorder to create an HTML frameset a multi paned page that lets you deliver multiple content pages in one browser window When you preview or publish the site NetObjects Fusion converts all pages that use that framed MasterBorder into content pages for the frameset The process of using AutoFrames to create a frameset is described in Using AutoFrames on page 6 9 This chapter expands your use of AutoFrames to exercise greater control over framed pages It explains how NetObjects Fusion generates HTML pages that contain AutoFrames and describes how to add HTML or scripts to individual frames or the main frameset so you can customize AutoFrame pages For example you can G Target links in your AutoFrames to specify where they display results G Include content within the lt NOFRAMES gt HTML tag so site visitors using frameless browsers older browser versions that don t support frames see some content or message G Add lt MET
111. link G If you are linking text select the text you want the browser to display as linked G If you are linking a picture or other object click to select it 2 In the Properties palette for that object click Link The Link dialog appears G If you are linking to a page select Page Name and choose a page name G If you are linking to an anchor and want the link to always link to a speci c page select Page Name and the name of a page G If you are linking to an anchor and want to always link to an anchor on the browser s current page select Current Page The Anchor section lists all the anchors on the page selected in the Page section To learn how to create and link to an anchor see Adding an Anchor on page 14 5 W O R K I N G W I T H L I N K S Creating Links and Anchors 14 5 3 If you are linking to an anchor choose the name of the anchor from the Select Anchor drop down list The Select Frame Target eld appears only when the current page contains an AutoFrame For more information about link targets see Targeting Links in AutoFrames on page 24 2 The Actions button appears only if you are linking text For information on adding an Action to a text link see Assigning an Action to a Text Link on page 21 17 4 If the current page contains an AutoFrame select the name of a frame from the Select Frame Target drop down list The destination page for the link appears only in the f
112. message to every object contained within it When the site visitor or browser triggers the action the message cascades down the target object s hierarchy In effect the target object forwards the message in turn to each object contained within itself For example if you send a cascaded action to a Layout the Layout forwards the action s message to each object on the page Be aware that messages your actions send to either the Layout or the MasterBorder will apply to the entire page not just the Layout or MasterBorder For example if you make a button which when clicked sends a Hide Object message to all objects on the Layout it actually sends the message to all items on the page making everything invisible If you want a cascading message to affect only a group of objects put all the objects in a Layout Region container and send the message to the Layout Region instead of the Layout Cascading actions are particularly valuable when you want to apply actions to a changing collection of multiple objects For example assume you are preparing a site for your company In the marketing information part of your site you want to display a map showing the 10 locations of your company of ces The way you designed it each of ce location includes a button that superimposes a text object on the page That text object contains a pro le of that location s activities When a site visitor clicks a location you want to hide any currently vis
113. more than one alias such as one alias for secure pages and another alias for protected assets you can create more than one custom folder See Creating Aliased Folders and Setting the CGI Bin Directory on page 26 17 for information 3 Drag pages and assets into the appropriate custom folder s as needed 4 Click Setup on the control bar The Publish Setup dialog appears 5 Select the Server Locations tab 6 Select the remote server pro le that you want to change and click Edit The Location Properties dialog appears 7 Enter remote server pro le information if needed 8 Position the Locations Properties dialog so you have a clear view of the Directory pane of Publish view Refer to the directory structure to make sure you type the URL correctly 9 Click the Advanced button The Advanced Settings dialog appears 10 To specify a port or permissions setting to access this server enter the port number or permissions ag in the elds shown 11 To add a new alias click the Add button To edit an existing alias select it from the list then click the Edit button 26 20 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P The New Alias dialog appears 12 Enter the relative path from your site s root folder to the custom folder containing the aliased pages and assets as the URL Path Refer to the directory panel as needed to enter the path exactly as it appears includin
114. multiple Layouts and MasterBorders then assign one of each to a page Modifying and Creating MasterBorders on page 6 3 describes how to create Layout area MasterBorder area MasterBorder area Page name Layout name Docked toolbars Properties palette Grid Rulers Guides D I S P L A Y I N G A P A G E I N P A G E V I E W Page View Basics 4 3 MasterBorders Creating and Selecting Layouts on page 7 2 describes how to create Layouts The size of a NetObjects Fusion page is de ned by the combined size of the MasterBorder and Layout The Blank Site template sets the default page size at 600x555 pixels which is appropriate for the majority of site visitors You can rede ne the default page size setting in Preferences as described on page 1 15 or by adjusting the size of the MasterBorder area the Layout area or both See Adjusting the Size of the Layout and MasterBorder Areas on page 4 3 for more information Adjusting the Size of the Layout and MasterBorder Areas You can adjust the size of the MasterBorder and Layout areas Resizing these areas also changes your page size MasterBorder handles Layout handles MasterBorder handles Layout Width and Height elds 4 4 Page View Basics D I S P L A Y I N G A P A G E I N P A G E V I E W To resize the Layout and MasterBorder areas do one of the following N Click in the Layout area then change the Layout width height or both in
115. nod le name from the Windows 95 Explorer and dropping it in the NetObjects Fusion window G Double clicking the nod le name in the Windows 95 Explorer C R E A T I N G A N D O P E N I N G S I T E S Creating and Managing Sites 2 7 Viewing a Site In Site view the structure of your site is represented by page icons As in a family tree pages have parent child and sibling relationships The pages named Apples Oranges and Grapes are all children of the Home page and are siblings of each other The Grapes page is the parent of two additional pages Raisins and Wine In Site view you can add pages to the site rename pages move them and complete other site oriented actions To add content to a particular page for example to add text or pictures use Page view As you construct a site you typically go back and forth between Site view and Page view In Site view one page is always selected as indicated by a blue border See Selecting Pages on page 2 8 Saving Your Work To save your work choose Save Site from the File menu NetObjects Fusion also has an auto save feature that saves your work each time you change views See Setting Preferences on page 1 12 2 8 Creating and Managing Sites U S I N G T H E S I T E V I E W T O O L S Using the Site View Tools When you work in Site view the toolbar contains one tool for selecting pages and another for zooming in and out on the Site view The Zoom to
116. object in any NetObjects Fusion window or a control in a dialog or palette then select What s This from the shortcut menu G Click the question mark icon in the title bar of a dialog or palette then click the item you want to learn about G Highlight a menu command then press F1 G Select NetObjects Web Site from the Help menu to open your browser and display the NetObjects Home page which contains links to information about NetObjects Fusion You must be connected to the Internet for this to work C H A P T E R 1 NetObjects Fusion Basics 1 1 NetObjects Fusion Basics 1 NetObjects Fusion 3 0 incorporates new technologies with the current browser environment to help you meet today s site building challenges Using NetObjects Fusion you ll nd it easy to build dynamic content rich sites that use the latest interactive technologies including CSS Positioning and Dynamic HTML And you don t need to build multiple versions of your site you can depend on NetObjects Fusion s Everywhere HTML to generate HTML that works on all browsers This chapter provides an introduction to NetObjects Fusion including G Basic concepts G NetObjects Fusion window G NetObjects Fusion views G Navigating in NetObjects Fusion G Choosing colors G Setting preferences G NetObjects Fusion folder structure 1 2 NetObjects Fusion Basics I N T R O D U C I N G N E T O B J E C T S F U S I O N 3 0 Introducing NetObjects Fusion
117. objects These objects import simple text elds from a data eld created in a program other than NetObjects Fusion External data sources include external databases spreadsheets and ASCII text les Use external data if your database is maintained by others who do not have NetObjects Fusion if you have large quantities of data or if the data is frequently updated Note Importing external data takes a single table from a database or a single worksheet from a program such as Microsoft Excel it does not import the entire database Create or select a data object Choose options for the data list Choose options for stacked pages Click OK to create the data list and stacked pages C R E A T I N G A D A T A O B J E C T Data Publishing 20 7 The two data tools appear on the Advanced Tools toolbar Use the New External Data Source tool to create a data object for external data use the Data List tool to create a data object for internal data The currently selected tool appears on the toolbar Creating a Data Object for Internal Data Internal data is records and elds stored within your site You enter internal data directly into a stacked page by typing text or numbers and by placing pictures You can create a data object in Page view or in Assets view If you create a data object in Page view you can immediately create stacked pages to contain the data If you create a data object in Assets view you must return t
118. on page 14 3 14 14 Creating Links and Anchors A D D I N G H T M L T O A L I N K G For information about smart links see Creating a Smart Link on page 14 7 G For information about external links see Creating an External Link on page 14 9 G For information about le links see Creating a File Link on page 14 11 G For information about custom links see Assigning an Action to a Text Link on page 21 17 6 Create more hotspots if you like using the same tools and the Link dialog Once a picture has imagemaps you can move it anywhere on the page and even copy and paste it elsewhere in the site Editing an ImageMap To edit an existing hotspot select it The General tab appears in the Properties palette G To edit the link click Link The Link dialog appears displaying the tab for the type of link Change the link destination or click Unlink to remove the link G To make the hotspot an anchor click Anchor and type a name in the Add Anchor dialog G To add HTML to an anchor click HTML and follow the procedure for adding HTML to a link as described in Adding HTML to a Link on page 14 12 G To assign an action to a hotspot click its Actions tab on the Properties palette and follow the procedure described in Adding Actions to Objects on page 21 5 G To resize a hotspot select it and drag its handles G To create an alt tag for the hotspot type in the AltTag eld The
119. or button text appears with its new options in Site view Editing a Navigation Bar Each SiteStyle includes a primary navigation bar and a secondary navigation bar The two navigation bars differ only in the style of the button images You can set the navigation bars in your site to display either style of navigation bar For example top level pages can display the primary button set while lower level pages display the secondary set For more information see Using Navigation Bars on page 13 3 Each navigation bar contains two button images regular and highlighted Highlighted buttons are used in button navigation bars to show which page a visitor is currently viewing You can turn highlighting on and off in the Navigation Bar Properties palette in Page view as described in Setting the Navigation Bar Style on page 13 7 Highlighting is turned on by default Note If you are using AutoFrames highlighting can affect how the browser refreshes your page See AutoFrames and Browser Refresh on page 24 10 for information To edit a navigation bar 1 In Style view select the style you want to change and double click the Primary or Secondary Navigation Bar The Primary or Secondary Button dialog appears depending on which navigation bar you are editing 12 10 Using SiteStyles E D I T I N G S I T E S T Y L E S 2 To select a different button image G Choose a regular button image by clicking the rst Browse but
120. original HTML s lt IMG SRC Images Logo gif gt to lt IMG SRC Index Logo gif gt in the published HTML However NetObjects Fusion doesn t edit paths to other HTML les or to lt TARGET gt anchors within a le For these links to be maintained the path names in the original les must work as is when you publish The original lt A HREF gt tags must use relative rather than absolute path names that is use lt A HREF Index html gt rather than lt A HREF HTTP www your_original_domain com Index html gt And you must position external HTML les in your NetObjects Fusion directory structure so these original paths work See Customizing Your Directory Structure on page 26 21 In particular NetObjects Fusion manages external assets referenced by these tags G lt IMG SRC gt G lt A HREF gt to non HTML assets such as sound les G lt BODY BACKGROUND gt Referenced HTML les are listed in Assets view Unless you choose otherwise pictures and other assets are listed too Rename them double click them to see them in Page view and so on P U B L I S H I N G N A T I V E H T M L Referencing and Editing External HTML 19 11 G lt EMBED SRC gt G lt BGSOUND SRC gt G lt SCRIPT SRC gt G lt INPUT SRC gt G lt APPLET CODE gt Although NetObjects Fusion manages external applets that are assets of referenced HTML it doesn t manage classes referenced by the applets
121. page you can format selected characters in formatted text elds but in simple text elds all characters have the same format For more information on data elds see Chapter 20 Data Publishing To format text properties in Page view select the Text tool then double click in the text box in which you want to format text or paragraphs to put the text box in text edit mode Formatting Text 1 In Page view select the text you want to format 2 Select a font from the Font drop down list on the Text Properties palette Font style buttons 3 Click a font style button to assign characteristics bold italic underline and strikethrough to the text Font effects buttons Click a font effects button to superscript or subscript the text 4 Select the size you want to assign to the font from the Size drop down list 5 To assign a color other than the SiteStyle color to the text click Color and select a color from the Color Picker See Choosing Colors on page 1 9 for information Formatting Paragraphs Using the Text Properties palette you can select left right or centered paragraph alignment indent a whole paragraph or create a simple bulleted or numbered list See Creating Multi Leveled Numbered and Bulleted Lists on page 8 8 for more information 8 8 Designing with Text F O R M A T T I N G T E X T A N D P A R A G R A P H S Note Due to limitations in HTML standards you cannot inse
122. pages into sections A number of line picture images are included in NetObjects Fusion styles You insert line pictures in Page view using the SiteStyle Line tool as described in Adding a SiteStyle Line on page 11 7 To edit a SiteStyle line element 1 In Site view select the style you want to change and double click the SiteStyle Line The Picture File Open dialog appears 2 Select an image le from your hard disk CD ROM or LAN For information on choosing images see Adding Pictures on page 10 3 3 Click Open Editing Text Colors You can set the colors for normal text links and visited links with NetObjects Fusion These colors apply only to text created with the Text tool in Page view and text navigation bars They do not apply to text on buttons banners or other images To edit the default font font size and other font attributes set the browser font as described in Setting Preferences on page 1 12 The normal text color is automatically applied to all text you add to text boxes in Page view You can override the default color by formatting text in Page view The regular link color is applied to all text you link the visited link color appears after your site visitor follows the link You do not see this color in Page view Link colors show site visitors where links are located and browsers keep track of which links have been followed Set a regular link color that is different from the co
123. prefer you can script your own actions in NetObjects Fusion using JavaScript or VBScript Experienced programmers can customize the built in menu of actions When you publish your site NetObjects Fusion generates dynamic pages in Everywhere HTML a combination of CSS positioning code JavaScript and browser speci c HTML code such as Netscape s lt LAYER gt tag Everywhere HTML makes dynamic pages work properly in both Microsoft Internet Explorer 4 0 and Netscape Communicator 4 0 with no further con guration or adjustment This chapter contains G An overview and example of objects actions and messages G Design considerations and the dynamic page building process G The mechanics of assigning actions and parameters to objects G Scripting custom actions 21 2 Building Dynamic Pages T H E B A S I C S O F D Y N A M I C P A G E S The Basics of Dynamic Pages Dynamic pages contain one or more objects that have actions These actions can include G Animations that make the object move on off and around the screen bounce off other objects grow or shrink or change places G Direct manipulation of the object by the site visitor typically by dragging or moving it with the mouse G Indirect manipulation of the object by the browser using JavaScript collision detection to prevent two objects from occupying the same space at the same time G Changes to the object s properties such as its color location visi
124. publish a page using the Nested Tables or Regular Tables HTML output method the following problems can occur G If you assign an action to an object and then put the object in a table text box or Layout Region sometimes the object doesn t display in Netscape Navigator 4 0 Solution Removing any action assigned to the table text box or region itself might x the problem Or you can change the HTML output method to CSS amp Layers G If you assign the Set Src or Use Image action to an image the action doesn t work in Netscape Navigator 4 0 Solution Change the HTML output method to CSS amp Layers G If you assign a transition action to an object the transition doesn t display properly in Internet Explorer 4 0 for Windows Solution Either change the HTML output method to CSS amp Layers or use a motion action instead of a transition If you assigned transition actions to objects placed inside a table or text box changing the HTML output method will not x the problem Either use a Layout Region instead of the table or text box or use a motion action Note that transitions don t display in Internet Explorer 4 0 for Macintosh regardless of your output method Usa a motion action P R O B L E M S W I T H F O R M S Working Around Browser Problems A 3 Problems with Forms G If you assign an action to an object inside a form the form might not be visible in Netscape Navigator 4 0 Solution Place the
125. remote server con guration requires a CGI directory or other aliases To specify the CGI BIN directory 1 In Publish view click Setup 2 Select the Server Locations tab select a remote server and click Edit 3 Click the Advanced button 4 Enter the ftp path where CGI scripts are stored in the CGI eld This establishes an alias to the executable directory on the server where CGI scripts are kept You can also use the Advanced Settings dialog to de ne a speci c server port or permissions setting even if you are not de ning aliases or virtual folders Depending on your Web server con guration you might need to set speci c permissions so that your Web server software can access your published les This section describes how to set a different permission string to override the default permissions normally set by NetObjects Fusion If you simply want to de ne a speci c server port or permissions setting for this server pro le proceed to step 10 To create other aliased folders 1 In Publish view arrange the directory structure for your site the way you want it to appear on your server 2 Isolate the pages or assets you want to store in an aliased location into one branch of the directory structure under a common parent folder If necessary create a custom folder for each set of aliased content C O N F I G U R I N G P U B L I S H S E T U P Publishing Your Site 26 19 If your site requires
126. some characteristics and advantages of frames Here is a generic MasterBorder applied to a site s Home page 6 12 Managing MasterBorders and AutoFrames U S I N G A U T O F R A M E S As an AutoFrame the left border now has an outline separating it from the Layout and the rest of the border and a picture appears in the background Design your frames so the browser only needs to redraw the content of the Layout area when a site visitor uses a link to a child page sharing the same MasterBorder and AutoFrame design See Chapter 23 Creating Custom HTML Framesets and Frames A D D I N G A N A U T O F R A M E Managing MasterBorders and AutoFrames 6 13 Adding an AutoFrame Since NetObjects Fusion applies AutoFrames to the current MasterBorder and all pages that use that MasterBorder you might want to start by selecting or creating a designated framed MasterBorder that you can selectively apply to the appropriate pages in your site See Creating a New MasterBorder on page 6 6 if you need help creating a new MasterBorder If you want to apply different framesets to different pages you ll need one MasterBorder for each frameset Arrange the content and design of the MasterBorder as you want it to look and apply that MasterBorder to the rst page you want to turn into a frameset As you develop this MasterBorder follow these guidelines G Objects in frames can t straddle frame boundaries so check the corners
127. style elements throughout your site For example it replaces all the buttons in your navigation bars with images from the style you speci ed while maintaining the relevant links To apply a SiteStyle 1 In Style view select a SiteStyle from the style list The elements of the selected style appear 2 Click the Set Style button on the control bar or choose Set Style from the Style menu NetObjects Fusion applies the style to your site The more pages in your site the longer this takes When complete a message con rms that the style was applied and the name above the style list changes to the one you selected E D I T I N G S I T E S T Y L E S Using SiteStyles 12 5 3 Click OK to acknowledge the message The next time you go to Page view you see the new style elements and new font colors on each page You can also select a different style from the list and then navigate to another view When a message asks if you want to set the currently selected style click Yes to set the new style Editing SiteStyles You can edit any element of an existing style to customize it For instance you might like every element of a style except the banner You can change just the banner image of a SiteStyle The image for every banner in your site changes to the new image To customize SiteStyle elements for some but not all pages you do not edit the SiteStyle you customize it just for those pages See Customizing Banners
128. the MasterBorder Properties palette select the ZeroMargins MasterBorder 3 Select the text box 4 Select the Text Box tab of the Text Properties palette 5 Select the Contents wrap to browsers width option 5 14 Planning Your Site S U P P O R T I N G Y O U R D E S I G N W I T H H T M L O U T P U T Supporting Your Design with HTML Output To determine which HTML output method best supports your site s design and delivery priorities nd the description that best matches your main priority then note the suggested HTML output choices See Chapter 7 Laying Out the Page for details about choosing the layout method that most effectively supports your HTML output method Design Priorities and Method Choices on page 7 34 matches design priorities with appropriate HTML output and layout methods C H A P T E R 6 Managing MasterBorders and AutoFrames 6 1 Managing MasterBorders and AutoFrames 6 NetObjects Fusion divides a page into two areas the Layout area and the MasterBorder area The MasterBorder is the set of margins top bottom left and right on your page Although MasterBorders are especially suited to repeating objects such as navigation buttons and logos you can place anything in a MasterBorder that you can place in the Layout including banners pictures and text You can set any or all of the margins as an AutoFrame which permits site visitors to scroll the body of the page while objects in
129. the Picture tool If you installed the Extras folder you ll nd it contains pictures specially designed for page navigation buttons 2 Select the object 3 Click Link in the object s Properties palette 4 In the Link dialog click the Smart Link tab 5 Select Next Stacked Page or Previous Stacked Page and then click Link Adding Stacked Pages for Internal Data To add a new record to internal data you create a new stacked page Each new stacked page has the same layout of data elds and non data objects as all the others in the stack You can create as many new stacked pages as you want For each new stacked page NetObjects Fusion adds a row to the data list on the data list page You can delete stacked pages for internal data whenever you want 20 26 Data Publishing C R E A T I N G S T A C K E D P A G E S Note You cannot add or delete stacked pages associated with an external data object To add or delete records when data is stored externally you must update your external database or spreadsheet application and re publish your site To add internal data stacked pages N In Page view on the rst stacked page click the Add button on the control bar A stacked page with blank data elds appears The counter on the navigation bar indicates the new total of records in the stack Deleting Stacked Pages To delete the current stacked page N In Page view click the Delete button on the control b
130. the site converts its content structure and links stores its assets in the Sitename Assets folder and assigns the MasterBorder you selected earlier to each page in the new site 9 Navigate to each page and make necessary adjustments E X P O R T I N G A S I T E Importing and Exporting 3 17 Exporting a Site You can export any site as a template to use its style or content in another site When you export a site as a template NetObjects Fusion copies all assets into the Assets folder of the template and converts absolute paths to relative paths NetObjects Fusion includes in the exported template the SiteStyle les and resources for any SiteStyle in use by the source site Therefore exporting a site as a template nft is the only way to share sites with other NetObjects Fusion authors or to incorporate it into another site You cannot move or replicate your site by copying and distributing the Sitename nod le and its Assets folder because G Your site s assets are not necessarily stored in the Sitename Assets folder they could be elsewhere on your disk somewhere on the network or out on the Web The Sitename nod le contains absolute paths to all asset locations so it doesn t need to move or copy your assets until you publish your site G The new computer to which you move the Sitename nod le might not have the same assets in the same locations If it doesn t the site will be missing assets G A customi
131. the site structure G Working with the site outline G Saving and backing up your site 2 2 Creating and Managing Sites S T A R T I N G N E T O B J E C T S F U S I O N Starting NetObjects Fusion When you install NetObjects Fusion it is automatically added to the Windows 95 Start menu To start NetObjects Fusion N From the Start menu choose Programs NetObjects Fusion When the program starts it displays this dialog Creating a blank site and opening an existing site are described in Creating and Opening Sites on page 2 3 Creating a new site based on a NetObjects Fusion AutoSite or template is described in Chapter 3 Importing and Exporting The default option in this dialog is to open the last le you were working on You can set preferences so NetObjects Fusion automatically opens your last le each time you start the program See Setting Preferences on page 1 12 Working with Site Files A NetObjects Fusion site le is a database of information about your site Site les have a nod extension Site les are stored in a folder that has the same name you give the site For example if you name the site Apples Oranges the site s folder is called Apples Oranges and the site le Apples Oranges nod is saved inside the folder In addition the site folder contains a folder with the site s assets embedded les links data objects and variables as well as a backups folder C
132. these elds For guidance on the questions you need to ask see Remote Server Access Checklist on page 26 29 To de ne a remote server pro le 1 In Publish view click Setup on the control bar The Publish Setup dialog appears 26 14 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P 2 Select the Server Locations tab 3 To modify an existing remote server pro le select the pro le from the list and click Edit Continue with step 5 4 To create a new remote server pro le click Add NetObjects Fusion displays the New Location dialog with the Server Name eld blank and the Local publish setting selected by default C O N F I G U R I N G P U B L I S H S E T U P Publishing Your Site 26 15 Enter a name for this pro le in the Server Name eld 5 In the Location Properties dialog select Remote 6 In the Remote Host eld enter the name or IP number used to connect to the remote server This can be your site s domain name the name of an intranet server or the name of your ISP s server 7 To specify a CGI FTP port number or custom port number or establish aliases or virtual directories for some of your site content click Advanced to display the Advanced Settings dialog See Creating Aliased Folders and Setting the CGI Bin Directory on page 26 17 for information 8 Enter the Base Directory for your site that de nes where on the server your content will
133. to the le and the name that appears in Assets view 4 Click Browse and select a le in the Open dialog 5 If necessary enter or edit the Asset Name This name is for your reference It appears in the list of links in Assets view so you can quickly identify and sort link destinations It is not added to the HTML generated when your site is published 6 Click Link Adding HTML to a Link You can add your own HTML or JavaScript to a link to extend its capabilities For example you might want to add HTML that directs the browser to open the link in a new window or JavaScript that displays a dialog The steps below show you how to add HTML that directs the browser to open the link in a new window 1 In Page view select the object you want to link G If you are linking text select the text you want the browser to display as linked G If you are linking a picture or other object click to select it 2 On the Properties palette for that object click Link The Link dialog appears 3 Select a link in one of the link tabs 4 Click the HTML button on the Link dialog The Object HTML dialog appears For detailed information on this dialog see Accessing an Object s HTML on page 22 6 5 Click the Inside Tag tab to indicate where you want to enter HTML or JavaScript A D D I N G H T M L T O A L I N K Creating Links and Anchors 14 13 6 Enter target NewWindow As you type the bottom pane
134. view To set the navigation bar type 1 In Page view select the navigation bar The General tab appears on the Properties palette 2 In the Button Type section of the General tab select the button type G To apply the primary button style for the current SiteStyle select Primary Buttons G To apply the secondary button style select Secondary Buttons G For a text navigation bar select Text U S I N G N A V I G A T I O N B A R S Creating Navigation Bars and Banners 13 7 Text navigation bars use the SiteStyle s linked text color and the Normal text style For information on editing text styles see Creating and Modifying Text Styles on page 8 9 To set the link color see Editing Text Colors on page 12 11 Setting the Button Spacing You can set the pixel size of a button navigation bar s border as well as the spacing between buttons By default the spacing between buttons is zero pixels but you can increase this to let a background show through or to add visual breaks around buttons The border and spacing are measured in pixels regardless of the measurement you set in Preferences To set button spacing 1 In Page view select the navigation bar The General tab appears on the Properties palette 2 In the Display in pixels section of the General tab set display options G To increase or decrease the navigation bar border enter a new number in the Border eld G To increas
135. view in NetObjects Fusion A D D I N G A S I T E M A P B U T T O N Using NetObjects Fusion Components 18 7 G In an outline view G By searching for certain words Note Because of the security features in some browsers you cannot click a page in the Site Mapper to display the page in Preview You must publish the site before you can display a page from the Site Mapper To add a Site Map button and set its properties 1 In Page view display the page of your site where you want to include the Site Mapper component Site Mapper tool 2 Select the Site Mapper tool from the Component toolbar 3 Draw a box on the page to indicate the location of the Site Map button This site map shows a site by structure The site visitor can use these buttons to view the site three different ways Display two three or all levels of the site 18 8 Using NetObjects Fusion Components A D D I N G A M E S S A G E B O A R D The Site Map button appears on the page and the Site Mapper Properties palette appears 4 To change the image displayed for the Site Map button double click the Image row then select the image le you want from the Picture File Open dialog For information about placing an image see Adding Pictures on page 10 3 The selected image appears on the page You can add an action to a NetObjects Fusion object using the Actions tab For information about adding actions see Chapter 21 Building Dy
136. view you were working on G Use the Recent command to select from a list of the views and pages you displayed during the current NetObjects Fusion session G Use the Preview command to launch your browser and display a preview of your site Keyboard navigation shortcuts U S I N G S H O R T C U T M E N U S NetObjects Fusion Basics 1 9 Using Shortcut Menus NetObjects Fusion provides shortcut menus you open by right clicking an item in Site Page and Publish views The menu lists commands you can use on the item you clicked In all views and in dialogs and properties palettes you can right click an item and select What s This from the menu to display context sensitive help for the item Choosing Colors In NetObjects Fusion whenever the properties palette includes a Color button you can change the color of the selected object For example you can change the color of the page icons or the background in Site view objects in Page view or link text color in Style view To choose a color for a selected object 1 Click the Color button in any properties palette where it is offered or double click a text style element in Style view Shortcut menu for a text box in Page view 1 10 NetObjects Fusion Basics U S I N G C O L O R P A L E T T E S The Color Picker appears The name of the current palette is shown above the color display The last eight colors you selected from the palette are displayed in the Recent Co
137. visitors distinguish the navigation bar from the background of the page To set navigation bar background 1 In Page view select the navigation bar then click the Background tab of the Properties palette 2 In the Background Color section set a background color G To use a background color click the Color button select a color from the Color Picker then click OK See Choosing Colors on page 1 9 for information G To use no background color select None The background color appears around buttons in a navigation bar or behind text in a text navigation bar Using Banners Banners are picture title bars that display the name of the page helping site visitors understand where they are in your site You use the Banner tool to add new banners A highlighted button indicates the current page U S I N G B A N N E R S Creating Navigation Bars and Banners 13 9 Banners are just like pictures except they contain text to identify the page By default banner text is the page name but you can specify a custom name or no name for the banner as described in Using Custom Page Names and Extensions on page 2 15 You can also split the banner text into two lines by customizing the banner name The style of a banner is determined by the SiteStyle you choose in Style view You can assign an action to any banner using the Actions tab of the Banner Properties palette For example you can make a banner grow into
138. 15 font substitution 8 6 fonts in AutoFrames 6 10 frame support 6 11 frameless alternate content 23 10 24 10 new instance 24 3 opening page in new window 22 9 Previewing sites 1 13 refreshing pages 24 10 targeting full window 24 8 targeting new window 24 9 transparent gif les 10 10 using non Web standard image les 10 4 building dynamic pages 21 5 bulleted lists 8 8 Bulletin Board see Message Board button navigation bars 13 2 13 3 adding 13 3 default location 13 2 display levels 13 5 setting style 13 7 see also navigation bars buttons 13 2 changing picture on one button 13 13 default style 13 3 highlighted 12 9 restoring SiteStyle 13 15 setting custom text 2 15 text SiteStyles 12 7 C cascading actions creating 21 15 Cascading Style Sheets see CSS and Layers cell padding 10 4 cell spacing 10 4 centering page content 22 4 CGI directory for publishing 26 18 CGI script assigning to form 17 17 forms 17 17 processing data with 17 17 CGI script support 17 17 I N D E X Index 3 CGI scripts naming conventions 17 5 Perl5 18 10 CGI BIN folder 17 18 changing colors 1 9 Layout size 4 3 7 5 7 7 MasterBorder margins 4 3 6 5 MasterBorders 6 8 page properties 2 9 page size 4 3 templates 3 18 3 20 see also customizing editing modifying character sets special 26 9 check boxes 17 4 adding 17 9 checking spelling 8 18 checklist remote server access 26 29 26 31 Child Page button 4 5 child pages 2 7 CHMOD
139. 25 5 4 To force publication of the le even if it is not in use you can select Always publish le This is the asset s location This is the name that appears in the Name list in the Assets File view These are the pages on which the asset is used M A N A G I N G F I L E A S S E T S Managing Assets 25 5 If the new asset is an image le its name appears on the Image Assets tab of the Picture File Open dialog When you add an asset in this manner it is available for use in your site but it is not yet actually in use For information about placing image assets see Using Image Assets on page 10 13 Editing Asset Names and Locations Giving custom names to assets can make them easier to manage For example if you have an image le of an arrow that indicates the next page in the site you could name this asset Next Page and place it on several pages If you later decide to change the image to a pointing nger you need only edit the le asset so Next Page uses the pointing nger image le NetObjects Fusion automatically changes the image on all the pages that include the Next Page image asset To edit an asset s name 1 In Assets view double click the name in the Files list to display the File dialog 2 Type a new name into the name in the Name eld and click OK You can also edit the location directly in the File dialog For example you could enter a URL instead of a le pa
140. 3 0 NetObjects Fusion is a fully integrated visual Web site builder It provides an open environment that lets you work in your own way with a variety of tools Using NetObjects Fusion you can design and publish visually enticing dynamic content using the latest interactive technologies Work in an Open Environment NetObjects Fusion provides an open site building environment You can use a variety of other tools for specialized purposes and then return to NetObjects Fusion to integrate the content into one cohesive site Think of NetObjects Fusion as the control center where you create and manage all of the site s resources Depending on your preference you can lay out pages in graphical mode text mode or using an HTML editor In graphical mode you can place objects anywhere on the page and see exactly how they will look when you publish the site In text mode you can work on a page as if you were working in a word processor You draw a text box and then use it to contain graphics Java applets and servlets components and other objects as well as text This design method keeps your HTML code lean For more information about graphical and text layout options see Chapter 7 Laying Out the Page If you want more control over HTML you can use your favorite HTML editor for all or part of a page for as many pages as you want For more information see Chapter 19 Referencing and Editing External HTML Generate HTML That Wo
141. 4 moving copying restrictions explained 3 17 3 21 naming 2 4 3 6 opening 2 6 opening last automatically 1 13 outline options 2 19 previewing 1 7 publishing 26 24 26 28 publishing compared to preview 26 1 referencing 19 2 19 4 sample 3 2 3 4 samples provided 3 4 saving 2 7 saving automatically 1 13 setting publishing method 26 8 using sites not built with NetObjects Fusion 3 14 see also site les SiteStyle background color Layouts 7 12 SiteStyles 1 4 adding 12 14 adding all 12 15 applying 12 4 components 12 3 creating 12 12 customizing templates 3 19 de ned 12 2 editing 12 5 12 12 12 16 folder structure 12 16 importing 12 14 lines adding 11 7 lines editing 12 11 managing 12 14 removing 12 15 text color 12 11 text in banners and buttons 12 7 updating list 12 15 size requirements for Layouts 7 5 Size to Layout external HTML 19 9 sizing multiple objects 4 15 text box 7 21 7 24 smart links 14 2 creating 14 7 de ned 14 7 stacked pages 20 25 targeting to internal pages 24 5 types 14 8 snapping objects to grids guides 4 4 Solid Color background Layout Regions 7 20 Solid Color background Layouts 7 12 sorting Site Outline view 2 20 sound les inserting 15 11 15 13 sounds background 7 12 le formats 7 12 spaces in asset le names 26 13 26 17 spaces in page names 2 14 special character sets 26 9 specifying custom page names 2 15 specifying action messages 21 10 specifying targets 21 9 specify
142. 5 for more information G To change the font click the Set button next to the Font eld The Font dialog appears Select the font its style and size and script style The Script drop down list shows the available language scripts for the speci ed font Choose the appropriate script for the language you are using G Change the font color by clicking the Set button next to the Color eld and choosing from the Color Picker as described in Choosing Colors on page 1 9 G In Horizontal Position select Left Center or Right In Vertical Position select Top Center or Bottom Horizontal Position and Vertical Position specify where text appears on the button while Relative Alignment speci es how lines of text appear in relation to each other In the illustration below the rst button s Relative Alignment is set to left and its Horizontal Position and Vertical Position are set to Center The second button s Relative Alignment is set to center its Horizontal Position set to Left and its Vertical Position set to Center G In the Orientation section drag the slider to set the rotation angle of the text Zero degrees represents no rotation G Select Right angles to limit the text to right angles only clear it to permit rotation to any angle E D I T I N G S I T E S T Y L E S Using SiteStyles 12 9 2 When you nish adjusting the text click OK After you close the banner or button dialog the banner
143. 6 Transparency dropper 10 11 transparent GIF les 10 10 transparent handles 8 2 Transparent Layout Region color 7 20 trigger events 21 3 specifying 21 7 Tutorial folder 1 20 U unit of measurement 1 15 Universal Resource Locators see URLs UNIX servers publishing to 26 17 updating external links 25 10 SiteStyle list 12 15 Index 16 URLs external links 14 9 protocol 14 10 usage notes 1 19 User Resizable Frame option 6 17 User scrollable option frames 6 17 User Sites folder 1 20 2 3 user de ned variables 8 16 using banners 13 8 13 10 color palettes 1 11 components 18 1 image assets 10 13 navigation bars 13 3 13 8 shortcut menus 1 9 Site Navigation Window 4 6 tables 10 2 text boxes 7 21 7 30 V variables adding 25 12 deleting 25 14 editing 25 13 inserting in text 8 16 managing 25 12 user de ned 8 16 see also text elds verifying le assets 25 8 verifying links 25 11 Vertical Position 10 13 11 5 12 8 video le formats 15 9 video les inserting 15 9 15 11 viewing publishing properties 26 23 site map 18 6 views 1 3 Assets view 1 4 25 2 displaying previous 1 8 Page view 1 3 4 2 Publish view 1 4 26 3 Site view 1 3 2 5 Style view 1 4 12 2 folders virtual see aliased folders virtual folders see aliased folders VIV les 15 9 Vivo Active Producer les 15 9 volume QuickTime movies 15 8 VRML les 15 14 W warning icon 4 19 WAV les 15 11 Web address NetObjects xviii Web sit
144. 7 MasterBorders 4 3 6 5 MasterBorders to objects 6 5 pages 4 3 pictures 10 6 rows tables 10 7 rich media see media les Rich Music Format les 15 12 RMF les 15 12 Rotating Picture component 18 16 18 17 restriction on Preview 18 16 rotating pictures 10 8 rotating text in banners and buttons 12 8 in drawn objects 11 5 in pictures 10 13 rounded rectangles see shapes Rows HTML output option 7 9 7 18 rows tables inserting 10 7 removing 10 8 resizing 10 7 RPM les 15 9 rulers hiding 7 2 showing hiding 4 5 S sample media les 15 1 sample sites 3 2 3 4 sample sites provided 3 4 Samples folder 1 19 saving site les 2 7 saving sites 1 13 Scale options Flash and Splash les 15 6 scripted frames using 23 3 scripting custom actions 21 20 21 25 default target frame 23 8 frames overview 23 3 23 4 targeted links 23 9 scripts adding 22 2 adding to Layouts 7 11 inserting in actions 21 22 managing assets 26 29 scroll bars adding to frames 6 17 scrolling lists 17 4 17 10 scrolling messages 18 5 search engines directory structure for publishing 26 5 indexing pages 22 4 Secondary Navigation Bar 12 4 secondary navigation bars 13 6 section properties 2 9 sections 2 9 applying MasterBorders 6 8 printing structure 2 19 selected page 2 7 I N D E X Index 13 selecting Layouts 7 2 objects 4 9 table cell 10 5 tables 10 4 text boxes in tables cells 10 5 tools from yout 1 6 selecting pages 2 8
145. 75 stacked pages After you create a data list on a page NetObjects Fusion generates a stacked page as its child When you create the Layout of the rst stacked page the remaining stacked pages automatically inherit the same Layout The following illustration shows how the data list page and its child stacked pages appear in Site view Publishing Data In general when you work with data publishing you follow this three step process 1 Create a data object 2 Create a data list 3 Create a set of stacked pages When you create a data list NetObjects Fusion automatically creates the rst of your stacked pages where you create the Layout to be used for all the pages in the stack When you design a stacked page you create or identify the eld data you want to display on the page G If you are storing data internally you enter the eld data on the stacked page itself G If you are using an external source the eld data is drawn from the external database spreadsheet or ASCII text le Data list page Stacked pages 20 6 Data Publishing C R E A T I N G A D A T A O B J E C T When you use the Data List tool in Page view you can perform all three tasks within the Data Publishing dialog Creating a Data Object You can create two types of data objects G Internal data objects These objects reference simple text formatted text and picture data elds stored within your site G External data
146. A gt tags and information to any frameset or frame content pages The combination of AutoFrames and custom scripting will probably meet your needs for frame based pages To create your frames completely from scratch see Creating Custom HTML Framesets and Frames on page 23 1 The chapter includes G Targeting links in AutoFrames G Including content for frameless browsers G Scripting other custom HTML for AutoFrames G Browser refresh factors for AutoFrame pages 24 2 Working with AutoFrames T A R G E T I N G L I N K S I N A U T O F R A M E S Targeting Links in AutoFrames Before you customize AutoFrames you should understand these basics about HTML frame targeting G HTML frames divide the browser window into multiple areas When a site visitor clicks a link that s placed within a frame including the main or body frame the browser has to know where to display the results G The frame that displays the retrieved content is considered the target of the link when you specify which frame is to display the results of a link you are targeting that frame G In HTML you can set a default target for a frame that targets all its links to a speci c frame or you can de ne targets for individual links You can also do both an individual link target overrides any default target set for that page When NetObjects Fusion generates AutoFrame pages it inserts a lt base target _parent gt statement into the HTML o
147. Alignment to Left the Horizontal Position to Center and the Vertical Position to Bottom NetObjects Fusion left aligns the block of text and places it in the bottom center of the frame 9 In the Orientation section move the slider to rotate the text Select Right angles to limit the text rotation to 90 degree increments 10 Click Close to apply the text settings to the text 11 6 Drawing Shapes and Lines A D D I N G H T M L H O R I Z O N T A L R U L E S Adding HTML Horizontal Rules HTML rules are horizontal only and can appear to have beveled edges when displayed by a browser When you add an HTML rule NetObjects Fusion positions it using an lt HR gt tag in the HTML for your page When you embed an HTML rule in a text box you can set its width as a percentage of the text box width To draw an HTML horizontal rule HR Rule tool 1 In Page view select the Line tool on the Standard toolbar and choose the HR Rule tool from the yout 2 Draw the horizontal rule on the page The HR Rule Properties palette appears 3 In the Thickness box set the thickness of the rule 4 Select Shaded to create a bevel effect The standard HR rule is a shaded 2 pixel thick line 5 Click the HTML button to open the Object HTML dialog In the bottom of this dialog you can see the HTML code for the rule and its pixel length In the top of the dialog you can write JavaScript for the line or your own HTML code See Ch
148. C K E R T A P E Using NetObjects Fusion Components 18 5 The Link dialog appears For information about adding links see Working with Links on page 14 2 5 Create the link for the sub button and click Link 6 Repeat steps 3 through 5 to create and de ne each sub button Using Ticker Tape Often you want to announce a special promotion or event on your site You can use the Ticker Tape component to add a scrolling message to a page and set the colors and speed that are used to display the message To add a Ticker Tape display and set its properties Ticker Tape tool 1 In Page view select the Ticker Tape tool from the Component toolbar 2 Draw a rectangle to indicate the location of the Ticker Tape display Make the rectangle the size you want for the message background The Ticker Tape placeholder appears on the page and the Ticker Tape Properties palette appears 3 To display multiple messages in the Ticker Tape display double click the Number of Messages row specify the number and click the check mark You can specify up to 50 messages A new Text for Message and URL for Message row appears for each message you speci ed 4 Double click the Text for Message row and type the message in the Ticker Tape text entry eld Click the check mark 18 6 Using NetObjects Fusion Components A D D I N G A S I T E M A P B U T T O N 5 Double click the URL for Message row The Link dialog appears
149. Color Picker and click OK Selecting a Table Selection tool N In Page view select the Selection tool from the Standard toolbar then click the table Solid handles appear around the table With the table selected you can G Move the table on the page G Delete the table G Insert a row at the bottom of the table or delete the last row G Add a rightmost column to the table or delete the rightmost column G Resize columns and rows Borders Cell spacing Cell padding S E L E C T I N G A T A B L E C E L L Adding Tables 9 5 Selecting a Table Cell N In Page view select the Selection tool from the Standard toolbar then double click the table cell Cross hatching appears around the selected cell and dotted lines appear around the text box With the table cell selected you can G Add and format text G Specify text box properties G Insert objects G Wrap text around objects G Insert a row beneath the currently selected cell or delete the selected row G Insert a column to the right of the currently selected cell or delete the selected column Selecting a Text Box in a Cell 1 In Page view select the table cell 2 Click the boundary of the text box Solid handles appear around the text box With the text box selected you can G Delete its contents G Specify text box properties Cross hatching indicates the cell is selected Dotted line de nes the bound
150. For information about creating links see Working with Links on page 14 2 6 Create the link for this message and click Link 7 Repeat steps 4 through 6 for each message in the Ticker Tape display 8 Click the Speed row and specify the scrolling speed 1 to 50 of the message Specify a higher number to make the message scroll faster a lower number to make the message scroll slower 9 To set the frame background and LED colors click the appropriate row then select the color you want from the drop down list G Frame Color determines the border color of the Ticker Tape display The default is grey G Background Color determines the background color of the Ticker Tape display The default is black G LED Color determines the color of the message text The default is green You can add an action to an object using the Actions tab For information about adding actions see Chapter 21 Building Dynamic Pages Adding a Site Map Button Site Mapper is a Java navigation applet that site visitors can use to create an interactive map of a site If your site is large Site Mapper simpli es navigation by providing a detailed view of the site s levels Using the site map visitors can jump directly from page to page without using the page navigation controls You cannot place Site Mapper inside a frame The Site Map button provides three ways for visitors to view the site G By structure similar to the Site
151. Form Handler use a number indicating the object s order in the output text For example a eld with the name 4 that a visitor has typed in might appear as 4 Your Web site is really great Type text to appear in the eld by default Argument passed to the script processing the form 17 8 Designing and Implementing Forms A D D I N G O B J E C T S T O A F O R M G Text Type text to appear in the eld by default This text is submitted as the response if the site visitor doesn t replace it G Visible length Enter a number de ning the text eld s width in characters G Visible height Enter a number de ning the eld s height in lines up to 16 When typing exceeds this height the text scrolls 4 To label the eld use the Text tool to insert text next to it Adding Radio Buttons Use radio buttons when you want site visitors to choose one option from a group Clicking one radio button deselects all others in its group After creating the form as described on page 17 2 Radio Button tool 1 In Page view select the Radio Button tool from the Form toolbar 2 Draw a rectangle on the form 3 On the Forms Radio Button Properties palette de ne the button and group names passed to the script processing the form Value passed if this button is selected Argument passed for the group to the script processing the form This should be the same for all buttons in the group A D D I N G O B J
152. G T H E P A G E S H T M L Accessing the Page s HTML You can add HTML or script to the lt HEAD gt or lt BODY gt of the HTML NetObjects Fusion generates First select the area of the page you want to access the Layout area to access the current page s HTML or a MasterBorder or AutoFrame to access the HTML of several pages Note If your site uses frames access Master HTML to add code to the frameset NetObjects Fusion generates and access Frame HTML to customize that frame Then use the Page HTML dialog to add code between the lt HEAD gt tags inside the lt BODY gt tag or at the beginning of the lt BODY gt 1 In Page view click in the Layout area MasterBorder or an AutoFrame To select a ZeroMargins MasterBorder click outside the page See Modifying a MasterBorder on page 6 4 2 Click the HTML button on the Properties palette Click the Frame tab to locate the button for accessing AutoFrame HTML and adding code to a frame s contents To access frameset HTML select the MasterBorder or AutoFrame then click the HTML button on the General tab or right click in the Layout MasterBorder or AutoFrame and select Layout HTML Master HTML or Frame HTML from the shortcut menu The Page HTML dialog appears 3 Click a tab to indicate where in the HTML you want to add tags or script G Between Head Tags Adds code to the lt HEAD gt content inserting it just before the lt HEAD gt tag G
153. H A P T E R 4 Page View Basics 4 1 Page View Basics 4 NetObjects Fusion supports three ways to lay out your page position based text based and HTML based Once you select a layout method you either place objects within a layout container or import an HTML page to construct your page Tools properties palettes and layout aides such as rulers guides and grids help you arrange and align objects on the page This chapter describes how to use Page view features including G Displaying pages G Working in the MasterBorder and Layout areas G Moving between pages G Placing objects G Using tools G Aligning and distributing objects G Overlapping objects G Rearranging layered objects G Renaming objects 4 2 Page View Basics D I S P L A Y I N G A P A G E I N P A G E V I E W Displaying a Page in Page View From Site view there are several ways to display a page in Page view N Double click the page icon N Click the page icon then click the Page view button on the control bar N Click the page icon then from the Go menu choose Page N Click the page icon then press Ctrl 2 The page you selected appears in Page view Pages consist of a Layout area and a MasterBorder area The Layout area is the body of the page It contains objects that are unique to a page MasterBorders are optional margin sets They contain objects such as navigation bars that appear on multiple pages You can de ne
154. H O D Laying Out the Page 7 35 Delivering objects with actions or other DHTML effects to greatest number of browser versions Text box for page objects with actions in Layout Region embedded in the text box Nested Tables for site Regular Tables for Layout Region containing objects with actions Using cascading actions Text box for page embedded Layout Regions containing objects with actions grouped for cascading messages Nested Tables If your priority is Suggested page layout method Suggested HTML output method 7 36 Laying Out the Page S E L E C T I N G L A Y O U T M E T H O D C H A P T E R 8 Designing with Text 8 1 Designing with Text 8 When you want to add text to a NetObjects Fusion page you create a text box then add edit and format the text within the box You can also place objects in a text box and wrap text around the objects Any object you can place on a page you can also add to a text box including sounds videos plugins and Java applets as well as pictures and lines Using a text box as a container can help reduce the size of your HTML code See Chapter 7 Laying Out the Page for information This chapter describes how to design with text It includes G Working with text boxes G Adding text and symbols G Applying creating and modifying text styles G Formatting text G Wrapping text around objects G Inserting HTML tags and importing HTML pages G Creating and ed
155. HTML Directly E X A M P L E S O F A D D I N G P A G E H T M L Examples of Adding Page HTML Centering a Page s Contents NetObjects Fusion generates xed width pages by default As a result content doesn t widen or narrow when site visitors resize their browsers If your pages are narrow you can center them to avoid an imbalance of white space by adding the lt CENTER gt tag at the beginning of each page s lt BODY gt 1 In Page view click in the Layout area of the page you want to center in a MasterBorder to center a set of pages or in an AutoFrame to center just the contents of the frame 2 Click the Frame tab locate the HTML button for an AutoFrame The Page HTML dialog appears 3 Click the Beginning of Body tab and type lt CENTER gt 4 Click OK Preview the site and resize your browser to test the centered pages You can t use NetObjects Fusion to add a lt CENTER gt tag at the end of the page s lt BODY gt which is considered standard HTML syntax Although this breach of protocol might be noted by an HTML code checking program it doesn t cause problems in your site For information on scaling page content see Changing Layout Size on page 7 5 Indexing Pages for Search Engines To give your content the best chance of being found and ranked by search engines like AltaVista you can add Meta tag descriptions and keywords to your pages lt HEAD gt content Site visitors don t se
156. I N G O B J E C T S T O A F O R M Designing and Implementing Forms 17 5 Naming Form Objects When you add objects to a form you provide a name or argument for each object that s passed to the Form Handler component or CGI script processing responses These names can then be used to output or otherwise process the text typed in each eld or the state of each check box radio button or combo box If you re using the Form Handler to output responses you must name each form object with a sequential number beginning with 1 and continuing with 2 3 and so on Don t use text characters or punctuation as in 1 RadioButton In addition to names you might also provide a value to be sent when a site visitor selects a check box radio button or item in a combo box For example a check box named Yellow with a value of Yes might be sent to a CGI script as Yellow Yes depending on the script Actions you add with NetObjects Fusion can also use form object values to manipulate a site visitor s response For information on using actions with values see Scripting JavaScript Expressions on page 21 23 Note Avoid associating an action with an object that s inside a form Problems with some browsers can keep the form from displaying You can however use an action with an object that s outside the form If you re using a CGI script you might need to coordinate the names and values you enter with those used in the script Also
157. In Page view click the frame and select the Frame tab 2 Select User Resizable Frame if you want site visitors to be able to resize the frame Note HTML frame borders must be visible so the site visitor can drag them to specify a new size If User Resizable Frame is not available return to the AutoFrames tab and check the Generate HTML frame borders option 6 18 Managing MasterBorders and AutoFrames S E T T I N G F R A M E P R O P E R T I E S Setting the Frame Background You can set the frame s background to the current SiteStyle background a solid color or a picture 1 In Page view click the frame and select the Frame tab 2 In the Background section of the Frame properties tab set the background options G To use the background color of the current SiteStyle select SiteStyle Background G To set the frame background to a different color select Solid Color If the solid color shown is not the one you want click the Color button select a color from the Color Picker and then click OK The selected color lls the frame background G To use a picture in the frame background select Picture The Picture File Open dialog appears Navigate to and select either an image asset already included in the site or a new image le located elsewhere If the picture is smaller than the frame it is automatically tiled to ll the frame C H A P T E R 7 Laying Out the Page 7 1 Laying Out the Page 7 You h
158. K S 3 Select the Smart Link tab The Select Frame Target control appears only when the current page contains an AutoFrame For more information about link targets see Targeting Links in AutoFrames on page 24 2 4 Select the type of link you want G Home links to your Home page G Up links to the parent of the current page G Next Stacked Page links to the next page in a stack G Previous Stacked Page links to the previous page in a stack G Next Page links to the sibling to the right of this page in your site structure G Previous Page links the sibling to the left of the current page in your site structure G First Child Page links to the rst page below the current page W O R K I N G W I T H L I N K S Creating Links and Anchors 14 9 G Blank creates an empty link on the page You can use the Blank link to assign an action or to create a custom lt HREF gt tag If you want a link to trigger an action but you don t want it to lead to another page use the Blank link For more information on adding actions see Assigning an Action to a Text Link on page 21 17 5 Click Link For information about stacked pages see Chapter 20 Data Publishing For information about link targets see Targeting Links in AutoFrames on page 24 2 Creating an External Link External links are Universal Resource Locators URLs that point to other pages and items in other sites on the Web A vali
159. L G Previewing and publishing unmanaged assets G Editing referenced HTML Note You can reference les located on a hard disk CD ROM or LAN but not from a remote Web server Also lt A HREF gt links in the original HTML les should point to other HTML les and anchors within those les using relative rather than absolute path names See Managing Referenced Assets on page 19 9 for information 19 2 Referencing and Editing External HTML R E F E R E N C I N G H T M L F R O M S I T E V I E W Referencing HTML from Site View You can reference an entire site or section of a site from Site view For example you might reference an existing site you want to manage with NetObjects Fusion now and import later Or reference les you prefer to maintain in their native code such as les containing the HTML tags ROWSPAN or COLSPAN Note For links to work between the HTML les you reference use relative path names in the original lt A HREF gt tags and publish les using the same directory structure as the original site See Managing Referenced Assets on page 19 9 for information When you reference HTML from Site view NetObjects Fusion publishes the lt HEAD gt content from the original les along with lt HEAD gt content it generates 1 In Site view select the page to be the parent of the pages you reference 2 From the File menu choose Reference HTML or right click the page icon and select R
160. L tags and scripts For information about HTML in NetObjects Fusion see Chapter 22 Working with HTML Directly You can add an action to an object using the Actions tab For more information about adding actions see Chapter 21 Building Dynamic Pages Inserting a Sound File Sounds are either digital or synthesized audio les that a browser with a built in player or helper application can play To play sounds a system must have a sound card and speakers On any system the visitor s browser must be capable of playing sounds either through a built in player or helper application Typically site visitors must download and install these applications but most popular browsers have sound le players built in For example Live Audio technology is built into Netscape Navigator Visitors can also download helper applications from sound technology developers and install them in their browsers Some sound formats also require support from the Web server NetObjects Fusion supports the following popular audio le formats G Windows Wave wav format sound les that play on Windows and Macintosh For Macintosh site visitors must have Netscape 3 x or later G Audio Interchange File Format aiff with browser plugins can play on Windows 95 and Macintosh G Musical Instrument Digital Interface midi mid can play on almost all types of operating systems G AU the most common sound format found on the Web is used i
161. Layout Region grid and guides 7 16 message on mouse click 22 8 pages containing le assets 25 6 pages containing links 25 10 pages in Page view 4 2 previous view page 1 8 distributing objects 4 14 distributing sites 3 21 dithering in transparent GIF les 10 10 domain names in imported sites 3 11 3 16 Domino component Lotus 18 18 20 2 drag and drop embedding objects 7 26 objects 4 8 drawing HTML horizontal rules 11 6 lines 11 7 shapes 11 2 drop down lists 17 4 17 11 DXR les 15 2 DynaButtons component 18 2 18 5 restriction on Preview 18 2 sub buttons 18 4 dynamic content adding to pages 21 5 dynamic data publishing 18 18 dynamic HTML 21 2 dynamic pages 21 2 E edit elds 17 5 editing anchors 14 7 color palettes 1 11 data list icons 12 10 hotspots 14 14 HTML 1 18 22 3 imagemaps 14 14 images 1 18 lines 11 9 links 14 3 14 14 media les 15 17 navigation bars 12 9 objects 4 10 referenced HTML 19 13 19 15 SiteStyles 12 5 12 12 12 16 variables 25 13 I N D E X Index 5 see also changing customizing modifying editing page names Site view 2 14 ellipses see shapes email submitting data 17 16 embedded objects aligning 7 28 embedding existing objects with drag and drop 7 26 objects in containers 4 11 objects in text boxes 7 24 events mouse object page driven 21 8 Everywhere HTML 5 6 7 1 21 1 expanding sites 3 11 expanding site structure 2 18 exporting pages 3 1 3 17 3 21 sites 3 1
162. Layout from the Clipboard G Drag and drop any object that you can place with a tool For information on adding a speci c type of object to the Layout see the appropriate section for that object Setting the Layout s HTML Output Method You can specify an HTML output method that determines what type of HTML code NetObjects Fusion produces for the current Layout This Layout speci c HTML method overrides the method used to publish the site The site publishing method is assigned in the Publish Setup dialog see Setting the Site s HTML Output on page 26 7 for information See Selecting HTML Output on page 5 3 for descriptions of the HTML output options and their effects 1 In Page view click the Layout or select it from the Object Tree The General tab of the Layout Properties palette appears 2 In the HTML output section of the General tab select the HTML output method you want from the Use drop down list G Publish Setting generates the Layout using the output method speci ed for the entire site as assigned in the Publish Setup dialog This is the default output method for a Layout U S I N G L A Y O U T S Laying Out the Page 7 9 G Nested Tables uses nested table tagging and other features of the 3 2 HTML speci cation This is the default choice for the Publish Setting that controls the HTML output for the whole site G Regular Tables uses basic HTML table tagging to deliver your design and
163. O B J E C T S Page View Basics 4 9 Selecting Objects Use the Selection tool to select then move or resize objects Selection tool N Click the Selection tool on the Standard toolbar Then G Click an object to select it Click elsewhere to deselect it G Drag an object to move it G Click an object and drag the selection handles to resize the object G Drag a marquee around multiple objects or Shift Click to select multiple objects G Shift Click selected objects one by one to deselect them Zooming In and Out Zoom tools Use the Zoom tools to zoom in and out on an object or area on your page You can press Alt while using the tool to toggle between zooming in and out on an object or you can use the Zoom command on the View menu to select a magni cation Moving and Copying Objects N Click and drag an object to move it N To prevent an object from dropping into a container such as a Layout Region or text box select the object and press Alt while moving it over a container N Press Ctrl then click and drag an object to copy it 4 10 Page View Basics E D I T I N G O B J E C T S Editing Objects You can edit objects you place on your page by launching editing applications right from NetObjects Fusion To learn how to link a le type to the application of your choice see To create or modify a le type in Windows 95 or Windows NT online Help 1 In Page view select the object and
164. Pasting Text from the Clipboard 1 Cut or copy the text from its original source such as a word processing le 2 In Page view click where you want to place the text on the page 3 From the Edit menu choose Paste The text appears on the page in a text box The text box is a text editor and the Format tab of the Text Properties palette appears Setting Text Box Properties 1 In Page view double click in the text box then click the Text Box tab 2 Select None to eliminate text box background color or click Color and select a background color from the Color Picker See Choosing Colors on page 1 9 for information 3 If you added a background color to the text box specify the number of units you want to inset the text within the text box Note Insetting text from the text box boundaries creates a new table in HTML 8 6 Designing with Text A P P L Y I N G T E X T S T Y L E S 4 Select Lock height to keep the text box from contracting to t with the text This is the recommended setting Locking the height of a text box helps preserve object location when browser related font changes occur 5 Select Size to Layout to make the text box the page s Layout See Using Text Boxes on page 7 21 6 Select Text box is a form and click Settings to make the text box a form See Chapter 17 Designing and Implementing Forms Applying Text Styles Text styles are prede ned sets of font and pa
165. R I N G P U B L I S H S E T U P Publishing Your Site 26 7 4 Click OK to apply the selected directory structure type The directory structure is revised and displayed in Publish view Note If you apply the By Section directory structure shared assets are stored in the deepest folder common to all pages that use that asset This makes the shared access to those assets as ef cient as possible Setting the Site s HTML Output The wide range of browser versions and capabilities makes it dif cult to know exactly what kind of HTML tags and functions will display effectively to site visitors Advances in HTML coding and browser abilities have also made it possible to create pages using less code and more ef cient downloads if your site visitor s browser can support it To address these concerns and take advantage of these improvements NetObjects Fusion can generate any of three types of HTML output when publishing your site See Optimizing Nested Tables Output on page 5 7 for complete information on these publishing methods G Nested Tables uses nested table tagging and other features of the 3 2 HTML speci cation This is NetObjects Fusion s default output because it produces the most predictable and consistent results onscreen regardless of the type version or con guration of the site visitor s system or browser fonts Both Microsoft Internet Explorer 2 x and above and Netscape Navigator 2 x and above correctly d
166. See Publishing Unmanaged Assets on page 19 13 for information on getting these classes and other unmanaged assets to the Preview folder or Web server Note Once an external asset is imported into Assets view you can use it anywhere throughout your site Deleting referenced HTML from your site removes its assets from Assets view unless they re in use elsewhere Publishing Native HTML When you preview or publish referenced HTML NetObjects Fusion copies the HTML from the original les to html les it creates in the Preview or publish folder If it s managing external assets or including MasterBorders NetObjects Fusion also adds its own code to the published HTML Of course it never modi es your original les 19 12 Referencing and Editing External HTML P U B L I S H I N G N A T I V E H T M L If you don t want NetObjects Fusion to add HTML to the original code when it publishes you can choose these options in the Reference HTML dialog G When you reference from Site view choose the ZeroMargins MasterBorder NetObjects Fusion doesn t add MasterBorder information to the published HTML or impose a table structure G When you reference from Page view you can choose Replace Current lt HEAD gt from the Import lt HEAD gt drop down list NetObjects Fusion publishes the original lt HEAD gt as is without adding HTML of its own Don t do this if you re using actions on the page or publishing using the CSS and
167. The custom message Hide all pro les is received by each object contained in the layout Each pro le object has an Object Hide action that is triggered by the message Hide all pro les As a result each pro le object hides itself when it receives the custom message To create a custom message 4 In the Set Action dialog from the When or Message option menus select Custom Edit The Custom Messages list box appears 5 Click the plus button C U S T O M I Z I N G A C T I O N S Building Dynamic Pages 21 19 The Add Message dialog appears 6 Enter the message exactly as you want it to be used in other actions and click OK The message is added to the Custom Message list box The next time you select Custom from the When or Message option menus NetObjects Fusion displays your custom message as one of the choices Deleting a Custom Message 1 In the Set Action dialog select Custom Edit from the When or Message option menus The Custom Messages list box appears 2 Select the message you want to delete then click the minus button The custom message disappears from the Custom Messages list box 3 Click OK 21 20 Building Dynamic Pages C U S T O M I Z I N G A C T I O N S Scripting Custom Actions The action events and messages you can choose from the Set Action dialog are de ned by NetObjects Fusion in the default JavaScript Beans le NetObjects Fusion 3 0 NetObjects System NetObj
168. The name of the currently selected Layout appears in the Layout drop down list in the lower left corner of Page view In the example below BlueLayout is the current Layout if you publish this page NetObjects Fusion generates this page with that Layout s content To create a new Layout for a page 1 Go to the page in Page view 2 Select Add from the Layout drop down list A new blank Layout appears Any content on the previous Layout is stored with that Layout 3 Change the Layout name as needed See Renaming a Layout on page 7 4 for information 4 Add objects to the Layout and modify the Layout s properties such as size background or HTML output options as needed To display a different Layout for a page select it from the Layout drop down list Layout drop down list 7 4 Laying Out the Page U S I N G L A Y O U T S Renaming a Layout Each Layout you add to a page is given the name of PagenameLayout NetObjects Fusion does not require Layout names to be unique but you might nd it easier to keep track of multiple Layouts if they have meaningful names To rename a Layout 1 If the Layout currently displayed in Page view is not the one you want to rename select the correct Layout from the Layout drop down list at the bottom left of the NetObjects Fusion window 2 Click the Layout or select it from the Object Tree The General tab of the Layout Properties palette appears 3 Enter
169. Vivo Active Producer viv supported by Windows and the Macintosh with browser plugins G Rapid Prototyping Module rpm 15 10 Placing Media I N S E R T I N G A V I D E O F I L E To insert a video le Video tool 1 In Page view select the Video tool from the Media yout on the Advanced toolbar 2 Click where you want to position the video placeholder A box with handles appears on the page and the Open dialog appears 3 Select a video le from your hard disk CD ROM or LAN 4 Click Open The video icon appears on the page and the Video Properties palette appears The selected le name appears in the File eld on the General tab 5 To provide text that the browser displays if it cannot display the video enter the text in the AltTag eld 6 In the Display section select the display option for this video G To display the rst frame of the video inside the browser window click Inline The image is the placeholder for the movie The site visitor can start the movie by clicking the image G To select a different NetObjects Fusion image to represent the video on the page select Icon then click the image you want I N S E R T I N G A S O U N D F I L E Placing Media 15 11 G To use another image le you previously created such as a gif or jpeg le to represent the video select File Click Browse and choose the image le to use 7 Click the HTML button to insert HTM
170. When you have embedded form objects in the page s Layout or Layout Region G When you have objects with actions on the page and you choose not to use CSS and Layers as the output method Publishing with CSS and Layers CSS and Layers is an application of CSS concepts that NetObjects Fusion uses to express the location of content in terms of absolute positioning For example instead of using HTML workarounds such as empty table rows and transparent gifs to position a line of text a certain amount of space below the top of the page the absolute positioning supported by CSS and Layers de nes placement of the text box a speci c distance from the top left corner of the page in a simple statement of x y coordinates 5 6 Planning Your Site S E L E C T I N G H T M L O U T P U T CSS and Layers uses a combination of CSS positioning code JScript and browser speci c codes such as Netscape s lt LAYER gt tag to control the placement and delivery of content Pages published using CSS and Layers can only be viewed accurately in Microsoft Internet Explorer 4 0 or higher or Netscape Communicator 4 0 or higher Older browsers can view the pages but their results will be unpredictable in most cases the page content is stacked ush left down the page When you select CSS and Layers as your output method NetObjects Fusion generates Everywhere HTML HTML code that produces the same results in either browser You can use this to take advant
171. a column between two existing columns double click a cell in the column to the left of where you want to add the new column 2 From the Object menu choose Table Add Column Removing a Column 1 In Page view select the column you want to remove G To remove the rightmost column select the table G To remove a column from between two columns double click a cell in the column you want to remove 2 From the Object menu choose Table Remove Column C H A P T E R 1 0 Placing Pictures 10 1 Placing Pictures 10 Pictures are essential building blocks for any page design This chapter describes how to add pictures to your site then modify them It includes G Adding a picture G Resizing a picture G Cropping a picture G Tiling a picture G Rotating a picture G Creating a border around a picture G Creating a transparent GIF G Moving and copying pictures G Adding text to a picture G Using image assets 10 2 Placing Pictures C H O O S I N G A N I M A G E F O R M A T Choosing an Image Format To display a picture most browsers require that the picture is stored in a Web standard format When you place an image on a page NetObjects Fusion offers the following standard formats G Joint Photographic Experts Group jpeg jpg supports 24 bit true color G Graphics Interchange Format gif supports 8 bit 256 color images NetObjects Fusion also supports GIF 89 a format for transparency int
172. a new Layout name in the Name eld of the General tab Use letters and numbers only Layout names cannot have spaces hyphens underscores or other special characters and they cannot begin with a number 4 Press Enter or click elsewhere on the page The name of the Layout changes and the Layout drop down list is updated You can also use the Object Tree window to change the name of the Layout See Locating and Renaming Objects on page 4 12 for information U S I N G L A Y O U T S Laying Out the Page 7 5 Changing Layout Size There are four ways to change the size of a Layout You can G Set its Width and Height properties to speci c values on the Layout Properties palette G Show Rulers and Guides and drag the Layout handles into place at the width and height you want G Automatically limit the size of the Layout to be no larger than the size required by the objects it contains Regardless of the method you choose there are a few guidelines for controlling Layout dimensions G The minimum allowable size of a Layout is controlled by two things the location and size of any objects placed on the page and the location and size of any objects in the MasterBorder You can t make a Layout smaller than the space required by its current contents in their current locations You also can t make a Layout smaller than the space required by the size and location of its MasterBorder contents G The unit of measurement
173. ackground color 7 12 size requirements 7 5 Solid Color background 7 12 table formatting preferences 7 9 text based 7 1 levels of sites 3 8 lines drawing 11 7 editing 11 9 SiteStyle editing 12 11 Link icon 14 2 linking to new browser window 22 9 to from frameset 23 3 links 14 2 14 12 adding 25 10 adding anchors 14 5 adding HTML 14 12 adding JavaScript 14 12 anchors in frames 6 17 broken resolving 25 11 Current Page option 14 3 deleting 25 11 editing 14 3 14 14 external 14 2 external creating 14 9 external updating 25 10 le 14 2 le creating 14 11 le targeting 24 7 hotspots 14 13 imagemaps 14 13 internal 14 2 internal creating 14 3 managing 25 9 25 12 removing 14 3 smart 14 2 smart creating 14 7 smart targeting to internal pages 24 5 smart types 14 8 speci c targeting 24 3 targeted scripting 23 9 targeting in AutoFrames 24 2 targeting to external pages 24 5 targeting to internal pages 24 4 text assigning actions 21 17 untargeted browser refresh 24 10 verifying 25 11 within a frame 6 10 see also anchors Live Audio 15 11 Live Video 15 9 loading custom color palettes 1 11 Local Stage Server pro le 26 10 locating objects 4 12 locking text box size 5 12 5 13 M Machine Data Source external data objects 20 15 Macintosh computers text size in browsers 5 3 Macromedia Director see Director Macromedia Shockwave see Shockwave Macromedia Web site 15 2 managing data objects 25 12 le as
174. action click OK The new action appears in the list box of the Action tab of the object s Properties palette 12 Repeat steps 3 through 11 to assign additional actions to this object 13 Preview or publish the site locally and view the results in your browser To ensure the best experience for your site visitors test your dynamic pages in both Microsoft Internet Explorer 4 and Netscape Navigator 4 Specifying a Trigger Event The rst component of an action is its trigger event or condition when the trigger event occurs or the trigger condition is met the action begins The trigger event is de ned by its subject and its condition an action s trigger might occur when the page is loaded or when a transition is started Your choices for trigger events and conditions vary depending on the type of object to which you re adding the action For example if you are adding an action to a picture object there are ve potential mouse driven trigger events to choose from clicked down up over and out 21 8 Building Dynamic Pages A D D I N G A C T I O N S T O O B J E C T S Keep in mind that the trigger event is itself expressed as a message in a literal sense the action is kicked off when the object receives the message that the trigger event occurred The picture object in the example below won t know that the mouse was clicked until it receives a message to that effect from the browser This is what happens wh
175. add other objects to the Layout area Or conversely size a referenced object to ll the Layout area Use the Lock to Layout option on the External HTML Properties palette 1 In Page view click in the referenced Layout area or object you want to resize 2 Click the General tab on the External HTML Properties palette 3 Select or clear Size to Layout Clearing this option adds resize handles to a referenced Layout area so you can resize it move it and add other objects to the Layout area Selecting the option removes resize handles from an object which snaps to ll the Layout Note Avoid locking a referenced object to a Layout if there are other objects in the Layout area You might get unexpected results in some browsers Managing Referenced Assets When you reference an external HTML le NetObjects Fusion lists the HTML le in Assets view Unless you choose otherwise it imports into Assets view pictures applets media and most other external assets the le references Adds or removes resize handles from referenced HTML 19 10 Referencing and Editing External HTML M A N A G I N G R E F E R E N C E D A S S E T S You can move external assets around in your directory structure in Publish view while maintaining paths When you publish NetObjects Fusion edits paths to the assets so they can be found For example depending on your original and published directory structures NetObjects Fusion might change the
176. ag To constrain the line to vertical or horizontal hold down the Shift key while dragging 11 8 Drawing Shapes and Lines D R A W I N G L I N E S A N D A R R O W S The Line Properties palette appears 3 In the Line width box set the width of the line 4 In the Color section click the Color button for the line head and tail choose a color and click OK To set all three to the same color the Line setting select All parts use one color See Choosing Colors on page 1 9 for information 5 In the Style section select a style for the head and tail from the appropriate drop down list If you want the head and tail to share the same style select the style from one of the drop down lists then select Head Tail same style Select Outline so the head and tail have the line color for their outlines regardless of their ll colors 6 Type an alt tag in the AltTag eld See Adding and Modifying Alt Tags on page 4 10 for information When you publish a page with drawn lines NetObjects Fusion generates each one as a gif le D R A W I N G L I N E S A N D A R R O W S Drawing Shapes and Lines 11 9 Editing Lines and Arrows By dragging you can change the length and width of a line or change the shape and size of the line s head and tail 1 In Page view select the line Selection handles appear Place the pointer over a selection handle the pointer changes to a crosshair and do
177. age button to display its child page N Click the Previous page button to move to the preceding sibling page N Click the Next page button to move to the next sibling page Using the Site Navigation Window 1 In Page view click the Site Navigation window button The Site Navigation window appears 2 Double click the page you want to open or select the page and press Enter to open it Importing HTML Pages In Page view you can import an HTML page authored elsewhere and convert it to NetObjects Fusion format so you can visually edit its contents as you would any other page You can import HTML documents with htm or html extensions If you prefer not to convert the HTML page to NetObjects Fusion format place it as an object as described in Referencing HTML from Page View on page 19 4 P L A C I N G O B J E C T S Page View Basics 4 7 Note Because of variations in HTML code not all pages import exactly as you see them especially if their content is not in de ned tables Unpredictable results can occur if the page contains incorrect HTML Non HTML such as JavaScripts and CGI scripts do not import 1 In Page view display the page on which you want to import the HTML page It is easiest to import an HTML le onto a Layout that contains no content because objects from the HTML le overlay any existing objects 2 From the File menu choose Import HTML Page The Open dialog appears 3 Selec
178. age of the advanced capabilities built into newer versions of Microsoft Internet Explorer and Netscape Communicator without worrying about browser compatibility issues Like the other two HTML output methods you can apply CSS and Layers as G The default output method for your site Note that this makes a 4 0 level browser the minimum requirement for viewing your entire site which can exclude site visitors who use older browsers G The HTML output method override for a speci c Layout When you publish selected pages in CSS and Layers while publishing the rest of the site in one of the table based formats you can keep the bulk of your site accessible to most browsers while providing specialized content to those with browsers that support it G The HTML output method override for a speci c Layout Region Publishing a selected Layout Region in CSS and Layers while publishing the rest of the page and site in a table based format makes an even ner distinction between the content available in basic HTML format and specialized content for newer browsers CSS and Layers Pros G Pages published using CSS and Layers as the output method are typically more compact and download faster than table based HTML pages G You can overlap objects on Layouts or Layout Regions that are published with CSS and Layers Because CSS and Layers includes a way to express depth NetObjects Fusion can generate code that designates one object to display
179. aligned with Left Wrap setting U S I N G T E X T B O X E S Laying Out the Page 7 27 Creating New Embedded Objects 1 In Page view select the Text tool from the Standard toolbar and create a text box 2 Select the tool for the object you want to create and embed Note Because the Text tool defaults to edit mode when you select it and click within a text box you can t draw a text box inside another text box If you want to embed a text box within a text box you have to either insert the text box using the Object menu or create it outside the text box and then drag it into place 3 Position the starting point of the object at the position in the text where you want to insert the object then draw its outline The Open le dialog appropriate for that type of object appears 4 Select the object source le that you want to embed and click OK 5 Position the object within the text box where you want it See Aligning Objects in a Text Box on page 7 28 for more information Inserting Objects into Text Boxes 1 In Page view select the Text tool from the Standard toolbar and create a text box 2 To insert a new object click the insertion point at the position in the text where you want to insert the object 3 From the Text menu select Insert then select the type of object you want to insert The Open le dialog appropriate for that type of object appears 4 Select the object source le y
180. aligns centers or right aligns two or more lines of text It has no effect on single lines of text The Horizontal Position and Vertical Position settings place the text block within the picture box For example if you set the Relative Alignment to Left the Horizontal Position to Center and the Vertical Position to Bottom NetObjects Fusion left aligns the block of text and places it in the bottom center of the box 10 In the Orientation area move the slider to rotate the text Select Right angles to limit the text rotation to 90 degree increments 11 Click Close to apply the text settings to the picture s text Using Image Assets By treating image les as assets NetObjects Fusion provides you with a convenient way to replace or update multiple instances of an image Using Image Assets can also reduce the number of image les included in your site Instead of adding multiple copies of an image le in several locations you add the image asset once and then select from the list of existing image assets when you want to place another instance of the picture When you export a template NetObjects Fusion copies your image le assets from wherever they are located on your hard disk to an Assets folder within your template folder 10 14 Placing Pictures U S I N G I M A G E A S S E T S Whenever you place a picture on the page as described on page 10 3 you add a le asset You can also add image le assets in As
181. alog appears Because the entire image is treated as one object you can link it to another page le smart link or external link such as another site For information about adding links see Working with Links on page 14 2 7 Create the link for the image and click Link The details of the link appear in the right column of the button row Adding Time Based Pictures You can use the Time Based Picture component to display different pictures at the same location on your page at different times You select the image to display and specify the hour at which to display it The browser automatically displays the picture at the speci ed time The picture remains on the page until it is time for the next picture to be displayed NetObjects Fusion supports the most popular graphics formats used on the Web including gif and jpeg For information about these formats see Adding Pictures on page 10 3 Note Because of the security features in certain browsers NetObjects Fusion cannot display the Time Based Picture component in Preview You must publish the site to see how this component works To add time based pictures and set the properties Time Based Picture tool 1 In Page view select the Time Based Picture tool from the Component toolbar 2 Draw a box on the page where you want to locate the picture 18 14 Using NetObjects Fusion Components A D D I N G T I M E B A S E D P I C T U R E S A picture plac
182. ame the home page drop down list You can select G Index which is the default page name automatically recognized by most current servers This is the default C O N F I G U R I N G P U B L I S H S E T U P Publishing Your Site 26 13 G Current Page Name which is set by the value of the Name property for the Home page G Home G Default which literally uses the name default as in default html 7 Set the default le name extension applied to each page in your site by either G Selecting htm html or shtml from the drop down list G Entering an extension of your choice For local publishing be sure to use a page extension that your browser recognizes or it might not display the page properly If you de ned a le name extension for an individual page in the Custom Names dialog that extension overrides the site default for that page 8 To convert all spaces and most non alphanumeric characters in asset le names to underscore characters _ select Replace spaces and other special characters with underscores NetObjects Fusion does not replace periods or hyphens because all servers understand those characters 9 Click OK to complete the con guration of the local server pro le De ning a Server Pro le for Remote Publishing The information needed to connect to a remote server is speci c to your server Contact your ISP or server administrator for the precise information to enter in
183. and all other pages on the same level with the same parent page G Child Level generates links to the children of the current page 13 6 Creating Navigation Bars and Banners U S I N G N A V I G A T I O N B A R S Open Site view or the Site Navigation window if you are unsure about which level of the site you want to link 4 To include your Home page as a link in this button bar select Include Home Page By default Include Home Page is selected to provide quick access to the hub of your site 5 To change the orientation of the bar select Horizontal or Vertical in the Display section Setting the Navigation Bar Type On the Properties palette for navigation bars you can choose whether the selected navigation bar displays text or picture buttons Text navigation bars provide navigation for visitors whose browsers cannot display picture buttons Primary and secondary navigation bars offer different sets of button pictures Other than the pictures displayed primary and secondary navigation bars function the same way Because secondary button pictures are typically different in size shape or color you can use a secondary navigation bar to visually distinguish links to different parts of your site For example to help your site visitor understand your site s structure you might use the secondary navigation bar for the lower levels of your site To see the difference between primary and secondary navigation bars go to Style
184. and click Link The details of the link appear in the right column of the button row You can add an action to an object using the Actions tab For information about adding actions see Chapter 21 Building Dynamic Pages 18 4 Using NetObjects Fusion Components A D D I N G D Y N A B U T T O N S Adding Sub Buttons If a DynaButton contains sub buttons the sub buttons appear when a site visitor clicks the DynaButton The sub button shows information about the link associated with the button For example if the sub button is linked to an external link the sub button displays the asset name for the external link To add sub buttons and set the properties 1 In Page view create a DynaButton as described in Adding DynaButtons on page 18 2 2 Double click a Use Sub Buttons row and Yes appears in the right column NetObjects Fusion adds a Number Sub Buttons row under the Use Sub Buttons row 3 To specify the number of sub buttons select the Number Sub Buttons row enter the number of buttons and click the check mark The limit is 20 sub buttons The appropriate number of sub button rows appear numbered in sequential order 4 To de ne the link for each sub button double click the appropriate sub button row such as Sub Button 1 2 The rst number in this case the 1 identi es the button for which the sub button was created and the second number is number of the current sub button U S I N G T I
185. and click the Print to t option in the Print Setup dialog Working in Site Outline View Site Outline view displays the site structure in outline format including a table of the properties child name page type status publishing status and comments of the child pages of the currently selected page If the selected page has no children the table describes the selected page itself To see the site as an outline 2 20 Creating and Managing Sites W O R K I N G I N S I T E O U T L I N E V I E W N Click the Outline tab Like Site Structure view Site Outline view shows if a branch of the site is collapsed A collapsed branch is indicated by a plus sign to the left of the page icon an expanded branch is indicated by a minus sign N To expand a branch click the plus sign to the left of a page N To collapse a branch click the minus sign to the left of a page You can select sections in Site Outline view See Working with Sections on page 2 9 Sorting the Display in Outline View In Outline view you can sort the child pages by their properties so you can quickly identify pages with common characteristics N Click the heading of the column you want to use to sort the list NetObjects Fusion sorts the list in ascending A Z order To sort the list in descending Z A order point to the column heading and press Shift Click For information about managing your site see Chapter 25 Managing Assets Th
186. and test your targeted links T A R G E T I N G L I N K S I N A U T O F R A M E S Working with AutoFrames 24 9 See Chapter 22 Working with HTML Directly for information on scripting techniques and requirements Targeting a New Browser Window To display a linked resource in a new browser window you can script the necessary targeting HTML 1 In Page view select the object or text that you want to link The object s Properties palette appears 2 Click the Link button The Internal Link tab of the Link dialog appears 3 Select the tab for the type of link you want Internal Smart Link External or File 4 Select or enter the page or resource that you are linking to your selected object 5 Make sure the Select Frame Target is set to none 6 Click the HTML button The Before Tag tab of the Page HTML dialog appears 7 Select the Inside Tag tab In the text eld enter target _blank This inserts your target statement inside the link tag that NetObjects Fusion creates for your object The value _blank is an HTML default that displays the retrieved resource in a new browser window 8 Click OK to close the Page HTML dialog 24 10 Working with AutoFrames A D D I N G C O N T E N T F O R F R A M E L E S S B R O W S E R S 9 Click Link to create the targeted link 10 Preview or publish locally and test your targeted links See Chapter 22 Working with HTML Directly
187. apter 22 Working with HTML Directly for information A D D I N G A S I T E S T Y L E L I N E Drawing Shapes and Lines 11 7 Adding a SiteStyle Line Use SiteStyle lines to embellish your page or divide it into sections The line is a part of the current SiteStyle See Chapter 12 Using SiteStyles for information To place a SiteStyle line SiteStyle Line tool 1 In Page view select the Line tool on the Standard toolbar and choose the SiteStyle Line tool from the yout 2 Draw a box starting where you want to position the upper left corner of the line The SiteStyle line appears You can drag the line to reposition it and add HTML and Actions to it When you change SiteStyles NetObjects Fusion automatically updates the line with the line picture for the new SiteStyle In your published site a SiteStyle line is a gif le Drawing Lines and Arrows You can draw a line on your page and specify its attributes such as width color and the style of the head and tail An arrow is simply a line that uses the Arrow or Point head tail style Line Draw tool 1 In Page view select the Line tool on the Standard toolbar and choose the Draw tool from the yout 2 Drag from one point to another to set the position length and orientation of the line The point where you start dragging is the head of the line The point where you nish is the tail of the line regardless of the direction you dr
188. ar Adding Text and Images for Stacked Pages When a stacked page displays data from an internal data object you can enter text and add pictures in elds on the stacked page You cannot edit text on stacked pages that reference external data To enter text in a text eld N Double click the eld Or press Tab or Shift Tab to move the selection from eld to eld To edit a selected eld press Enter A dotted outline with hollow handles highlights the eld and an insertion point appears inside Type the text you want then click outside the eld to deselect it To add an image in an image le eld N Double click the eld and select the image you want in the dialog that appears When you add data to the stacked pages the data list can display it Preview the data list page to see how it will look in your browser C H A P T E R 2 1 Building Dynamic Pages 21 1 Building Dynamic Pages 21 Thanks to continuing advances in HTML speci cations and browser development you can now make pages dynamic enlivening objects with movement and function and using interaction to help deliver your site s message and content Using NetObjects Fusion you can add animations actions messages and behaviors to any object on the page or to the page itself There s no programming required NetObjects Fusion provides all the ingredients for a wide range of actions presented in a standard selection dialog If you
189. arget frame that you de ne for a particular frame content page If you set a default target for the page in left_frame for example all links on that page retrieve their content into the target frame unless you de ne a different speci c target for individual links G A speci c target de ned only for that link This target can be Any other frame in the current frameset A full browser window with no frames This replaces the frameset with the retrieved content displayed in the full browser window A new additional browser window also known as a browser instance This leaves the original browser window open and the original frameset intact 23 8 Creating Custom HTML Framesets and Frames S C R I P T I N G A N D T A R G E T I N G L I N K S Note If you do not specify any default or speci c targets links within your frames follow the default browser behavior the retrieved content displays in the same frame as the link overwriting the page containing the original link Scripting a Default Target Frame You can set the default target frame for any content page whether it s the original content for that frame the page entered as the value of src in the lt FRAME gt tag or simply another content page If for example you create a frame intended to provide site navigation then you set its default target to be the body or main frame so all links display their content in the proper frame To script a defau
190. ary of text box 9 6 Adding Tables M A K I N G A T A B L E C E L L A F O R M Making a Table Cell a Form 1 In Page view double click in the table cell The Text Properties palette appears 2 On the Text Box tab select the Text box is a form option See Chapter 17 Designing and Implementing Forms for instructions Adding Text and Objects to a Table Cell 1 In Page view select the cell 2 Type or paste text in the cell and format the text The Text Properties palette appears Text automatically wraps to t the column size of the cell the cell expands vertically to accommodate the text See Formatting Text and Paragraphs on page 8 6 for information 3 Embed objects and align them in the cell For example center a picture using options on its Align tab See Embedding Objects in a Text Box on page 7 24 for information Modifying a Table You can modify a table by changing the cell properties adding and removing rows and columns and resizing rows and columns Modifying Cell Properties 1 In Page view select the table The Table Properties palette appears 2 In the Cell section of the General tab adjust the border size padding between the cell boundary and cell contents and spacing between cells 3 To modify the cell s background color select the Background tab then click Color select a color from the Color Picker and click OK M O D I F Y I N G A T A B L E Ad
191. at the site visitor sees nor does it affect the relationships or links between pages and assets It simply de nes how your pages and assets are stored on the server and what URL is required to access them For example some servers require a one level structure with all pages images and other assets in the same directory others let you set up your own directories NetObjects Fusion supports three types of server directory structures G Flat directories for servers that require all resources and assets to be in a single directory Many commercial Internet Service Providers ISPs require this kind of structure G By Asset Type arranges your site contents into folders according to their asset type This is the structure generated by earlier versions of NetObjects Fusion For C O N F I G U R I N G P U B L I S H S E T U P Publishing Your Site 26 5 example if your site contains a typical mix of text and media a structure set By Asset Type arranges your contents into the structure shown below G By Site Section arranges your site contents into a directory structure that looks like your site in Site view Your Home page and its assets are stored in the site s root directory Each rst level page is stored in its own folder with its assets Any child page is stored with its assets in a subfolder beneath the folder that contains its parent page For example a structure set By Site Section would have this director
192. ates such as the AutoSites provided with NetObjects Fusion You can expand an existing site quickly by importing page or section templates You can import existing HTML sites and pages and convert them to NetObjects Fusion format You can also expand your site by referencing external HTML resources see Chapter 19 Referencing and Editing External HTML for information You can export your completed NetObjects Fusion site as a site template so you can share your work with other NetObjects Fusion authors or move your site to another computer system This chapter describes NetObjects Fusion s import and export capabilities including G Creating new sites from AutoSite templates or existing sites G Expanding your site by importing sites sections pages or other content G Exporting all or part of your site for use by others 3 2 Importing and Exporting U S I N G T E M P L A T E S A N D S A M P L E S I T E S Using Templates and Sample Sites A NetObjects Fusion template is a prede ned set of pages and assets that you can modify to meet your needs A template folder contains G The source site s collected assets stored in a TemplateName Assets folder A site s assets are its pages pictures media and other content sources any les other than the Sitename nod le that make up the site G The SiteStyles used by the source site stored in a TemplateName Styles folder SiteStyles are discussed in Using SiteStyle
193. ation is not caused by NetObjects Fusion it s a consequence of site visitors controlling their browser environment It might not be an issue when you preview but when you publish your site you should be aware of potential problems Page view at 10 point Times Roman Browser view at 14 point Arial C H A P T E R 5 Planning Your Site 5 3 G If a site visitor has a different browser base font setting the text boxes on your page change size and other objects are re arranged around them G Microsoft Internet Explorer places slightly more blank space between text lines than the Netscape browsers do If you design your page using one browser as a preview tool visitors using the other browser see different results You can set WYSIWYG optimization for either Netscape or Microsoft Internet Explorer to account for the browser differences See Setting Preferences on page 1 12 for information G There are differences in font display between operating systems if your site visitor is using a Macintosh for example its version of 14 point Arial is physically smaller than yours Using the Nested Tables output method you can control this rearrangement of content See Publishing with Nested Tables on page 5 4 for information You can also specify the horizontal or vertical formatting priority so resized text impacts your page design in predictable ways See Optimizing Nested Tables Output on page 5 7 for information Selec
194. atted using Nested Tables Site visitors with advanced browsers get the overlapped effect without making the rest of your page or site incompatible with older browser versions U S I N G L A Y O U T R E G I O N S Laying Out the Page 7 15 See Selecting HTML Output on page 5 3 for an explanation of these HTML output methods See Setting the Layout Region s HTML Output on page 7 17 for information on assigning an HTML output method to a Layout Region G You can designate a Layout Region as a form and embed form objects within it You can create multiple forms on a single page by placing each form in its own Layout Region See De ning the Layout Region as a Form on page 7 19 for more information Creating Layout Regions Layout Region tool 1 In Page view select the Layout Region tool from the Standard toolbar 2 Draw the Layout Region at the place you want it on the Layout Nudge or drag it into position as needed To resize the Layout Region select it then drag its object handles as needed 3 Embed objects in the Layout Region A Layout Region is an object you can manipulate it or set its properties like other objects You can G Set background properties such as background color or transparency See Setting Layout Region Background Properties on page 7 19 G Align distribute arrange and size Layout Regions in relation to other objects on the page See Aligning and Distributing Objects
195. ave three options for designing pages and laying out your content G You can design your pages by positioning content with pixel level precision The position based approach uses Layouts and Layout Regions as content containers and preserves your position based layout by generating pages consisting of either HTML or CSS code G You can lay out pages using a text based approach With text based design you can preserve the ow of content by embedding objects in text boxes or table cells Text based page layout generates lean and ef cient HTML code that responds effectively to variations in browser and font size If your page design is based on rows of content as in a spreadsheet or other tabular arrangement you can lay out all or part of your page in tables Each table cell functions as a text box into which you can embed any kind of object G You can include hand coded HTML pages in your NetObjects Fusion site In the HTML based approach you incorporate external HTML pages as part of your site by referencing them as objects on a page or the page itself NetObjects Fusion can manage the assets required by the original page See Chapter 19 Referencing and Editing External HTML for information No matter which approach you take you don t have to worry about differences among browsers NetObjects Fusion publishes your site using Everywhere HTML generated HTML that displays correctly in both Microsoft Internet Explorer and Netsca
196. ayout Regions for selected content Layout Region Advantages G You have pixel level control of the layout and design of content within the Layout Region G You can embed the Layout Region within a text box which combines the bene ts of both containers G You can specify the HTML output type for any individual Layout Region so you can isolate advanced content that can exclude site visitors who are using lower version browsers G Layout Regions support the column or row priority for page formatting this means that selected sections of your page when contained in a Layout Region can adjust more predictably to your site visitor s font and display con guration Layout Region Limitations G NetObjects Fusion has to generate much more HTML code to achieve pixel level placement of content Your page les are signi cantly larger and download more slowly to site visitors G Text cannot ow around other objects unless they are embedded in a text box If you want to create the text wrap effect you have to create multiple text boxes within the Layout Region G You can size the Layout Region as you see t but you cannot maximize it to the full Layout size nor can you set the Layout Region to wrap to the width of your site visitor s browser 7 34 Laying Out the Page S E L E C T I N G L A Y O U T M E T H O D Design Priorities and Method Choices Use the table to determine which combination of layout methods and HTML
197. bes effective applications of CSS and Layers output CSS and Layers is also the best output method to use for dynamic pages and objects with actions See Chapter 21 Building Dynamic Pages for more information NetObjects Fusion gives you several options for applying these HTML output methods You can G Publish your entire site with any method G Override the site publishing method for a speci c page G Override the site or page publishing method for a speci c Layout Region The rest of this chapter describes the differences between these formatting options and the results they deliver For additional information on setting output methods in speci c situations see G Selecting Layout Output Options on page 7 33 for the steps necessary to set a page speci c publishing method G Selecting Region Output Options on page 7 43 for the steps to set the publishing method for a Layout Region G Setting the Site s HTML Output on page 26 7 for the steps to set the publishing method for the entire site Publishing with Nested Tables When NetObjects Fusion publishes your site Layout or Layout Region using the Nested Tables method it places all your content in nested table cells This method has several advantages G You get relative placement of your content as you designed it in Page view with relative spacing preserved regardless of the site visitor s display con guration such as browser fonts
198. bjects Fusion such as DynaButtons or the Message Board Any other components appear in the list in the Installed Components dialog 5 To add the component to your page select the component in the Installed Components dialog and click OK The new component appears on your page and the component s properties palette appears 6 Specify the properties for the component Because each component has different properties check the information included with the component for help C H A P T E R 1 9 Referencing and Editing External HTML 19 1 Referencing and Editing External HTML 19 In addition to content you create and maintain in Page view your site might also include pages that require special hand coded HTML Instead of importing and converting this HTML you can reference HTML les externally and place them anywhere in your site NetObjects Fusion doesn t parse the HTML when it publishes your site ensuring that your HTML is kept pure You can edit referenced les externally using any HTML editor such as Allaire HomeSite 3 0 which is included with NetObjects Fusion Plus you can manage external assets in Assets view and apply a consistent look to the published pages by assigning a MasterBorder This chapter describes how to work with external HTML by G Referencing HTML from Site view G Referencing HTML from Page view G Referencing HTML as an object G Managing referenced assets G Publishing native HTM
199. bjects Fusion Window When you start NetObjects Fusion and create a new site you see a window containing a Home page icon a Standard toolbar docked at the left side of the screen and a properties palette N E T O B J E C T S F U S I O N W I N D O W NetObjects Fusion Basics 1 5 The title bar menu bar and control bar are at the top of the application window The title bar shows name of the current site About the Properties Palette When you click an object in Site or Page view the properties palette changes to display the properties available for that object Properties appear on tabs that also might change when the selected object changes For example when you select a text box in Page view the Text Properties palette includes Text Box and Actions tabs When you double click in the text box to edit the text the Format tab is added to the display You might not always be aware of making a selection but in NetObjects Fusion something is always selected For example when you switch from Site view to Page view the Layout Properties palette appears You might not immediately see evidence that the Layout is selected but it is indicated on the properties palette To check what is selected at any time look at the properties palette Title bar Menu bar Properties Standard toolbar Control bar 1 6 NetObjects Fusion Basics N E T O B J E C T S F U S I O N W I N D O W To shrink the properties palette to display just it
200. bjects to your form along with images and other content as described in Adding Objects to a Form You can also turn an existing Layout or object into a form Click the Layout area Layout Region text box or table and select the form option on the Properties palette for example Text box is a form Form in a table Another form in a Layout Region 17 4 Designing and Implementing Forms A D D I N G O B J E C T S T O A F O R M Adding Objects to a Form You can add any standard form objects to a form including single and multiple line text elds check boxes radio buttons scrolling lists and drop down lists You add objects to a form using the Form toolbar This toolbar appears when you rst create the form or you can open the toolbar from the View menu by choosing Toolbars Form Tools Arrange and align the elds check boxes and other objects in a form just as you would objects in a Layout area table or text box You must place form objects inside a form to make them work as part of the form To minimize the amount of HTML generated by a Layout Region form align its objects by selecting them and using the Multi Object Palette Browsers display form objects differently so test your form on all the browsers and platforms you plan to support Edit elds Radio buttons Multi line text eld Form buttons Check boxes Drop down list The Form toolbar appears when you create a form A D D
201. ble invisible condition or some other state G Responses attached to form objects that cause other actions in response to the site visitor s selection or entry The action mechanism is message based each action is triggered by a speci c message and it sends a speci c message in response to that trigger Because of their capability for animation or interaction pages with dynamic objects are considered to be coded in dynamic HTML DHTML DHTML is not a new HTML standard of speci c tags and attributes it s a general term to describe pages that use JavaScript or other supported scripting languages operating within the browser to provide animation and interactivity The templates provided with NetObjects Fusion include an example of a page written in DHTML that has objects on it with pre built actions See Expanding Your Site on page 3 11 for information Note For reliable performance actions should be viewed in Internet Explorer 4 or Netscape Navigator 4 The HTML tags that make actions possible are not always supported in earlier versions T H E B A S I C S O F D Y N A M I C P A G E S Building Dynamic Pages 21 3 Objects Actions and Messages At their most basic level actions are composed of a trigger event an action message and one or more message targets G A trigger event causes an action to start Trigger events are expressed as Messages about site visitor actions such as a mouse click or mouse ov
202. blishing your site to a Macintosh Web server Message Board Macintosh CGI requires a Webstar 2 0 Web server running on a PowerPC computer with Mac Perl5 installed 6 If you are publishing to a Unix server Perl5 must be installed on the server Click the PerlPath for Unix row then type the path name to the Perl 5 interpreter The path name is relative to the base publishing directory You can obtain the path name from your Internet service provider Or if you want to get the Perl5 path yourself you can type which perl or which perl5 at the Unix command line prompt 7 To specify the CGI bin directory where the BBS CGIs are to reside double click the CGI bin Directory row type the path name for the directory and click the check mark You can obtain the path from your Internet service provider You can add an action to an object using the Actions tab For more information about adding actions see Chapter 21 Building Dynamic Pages Adding Pictures That Roll Over You can use the Picture Rollover component to create JavaScript rollovers for any image on your site Because this component uses JavaScript the colors of your images are not compromised in any image To view a rollover picture site visitors must use Netscape Navigator 3 x or 4 x or Microsoft Internet Explorer 3 x or 4 x You can also create rollovers for any image by using NetObjects Fusion actions however this only works in Netscape Navigator 4 x or Microsoft
203. browser window NetObjects Fusion launches the le when the site visitor clicks the plug in icon By default the Plugin gif icon represents the le on your page If you want to use a different image you can click the Browse button and select another image le 7 Click the HTML button to insert HTML tags and scripts For information about HTML in NetObjects Fusion see Chapter 22 Working with HTML Directly 8 Select the Advanced tab The Advanced options appear 15 16 Placing Media I N S E R T I N G O T H E R T Y P E S O F F I L E S 9 Set the parameters Because you can add different parameters for different les see the associated user guide G To edit parameters that appear in the Parameters section double click the parameter Enter the value in the Add Plug In Parameter dialog G To add a parameter click the plus button and enter the parameter name and value in the Add Plug In Parameter dialog G To remove a parameter select it and click the minus button G To change the order of the parameters click the Up or Down arrow buttons The selected parameter moves up or down in the parameters list You can add an action to an object using the Actions tab For more information about adding actions see Chapter 21 Building Dynamic Pages Use the Parameters section to add custom settings to the plugin You cannot change the plugin s standard parameters such as height and width
204. button or banner as described in Customizing Banners and Buttons on page 13 11 12 18 Using SiteStyles S T Y L E S F O L D E R S T R U C T U R E C H A P T E R 1 3 Creating Navigation Bars and Banners 13 1 Creating Navigation Bars and Banners 13 NetObjects Fusion includes tools you can use to create banners and navigation bars that help site visitors understand and navigate the structure of your site A new blank site includes a navigation bar and banner in the MasterBorder You can create your own banners and navigation bars and place them in any MasterBorder or Layout area You save time using banners and navigation bars because NetObjects Fusion automatically places page names on the banner and navigation bar pictures and automatically links buttons to pages in your site New banners and navigation bars you create use picture elements of the currently selected SiteStyle However you can customize the banners and buttons after you create them by assigning other styles or labels or by replacing their pictures with your own pictures This chapter tells you how to use navigation bars and banners including G Creating navigation bars G Setting navigation bar options G Creating banners G Customizing banners and navigation bars 13 2 Creating Navigation Bars and Banners W O R K I N G W I T H B A N N E R S A N D N A V I G A T I O N B A R S Working with Banners and Navigation Bars NetObjects Fusion makes it easy
205. by planning the appearance and use of frames G Determine which pages within your site you want to display in frames If you want the entire site framed for example then you create your frameset on the site s Home page If you only want certain sections such as technical publications or references displayed in frames then you can create your frameset as the top page of that section and arrange the content pages as child pages beneath it G If you apply frames only to a section of your site decide how you want site visitors to navigate in and out of the framed section You can link to the frameset from other pages in the site with the normal methods using either navigation bars or speci c object links To link from the frameset back to the non framed parts of the site you must include a properly targeted link on one or more of the content pages of the frameset If you don t create an exit link you might leave your site visitor with no way to navigate out of your frameset 23 4 Creating Custom HTML Framesets and Frames D E F I N I N G A F R A M E S E T G Plan in which frame your links will display retrieved results You might want to de ne default link targets for certain content pages and speci c target frames for selected links De ning a Frameset 1 In Site view create and name a new page at the location where you want the frameset 2 Go to the page in Page view and select the Layout The Gen
206. ch as CGI scripts or other executables that have to be placed in a speci c CGI directory so they run properly G You can place an order form or other pages in a secure location that requires authorized access without restricting access to the rest of your site G You can link to images or other assets that are maintained or controlled by others and stored in a protected location To do this you create alias folders using a process in which you de ne two locations the actual physical location where you want to FTP the pages or assets and the URL or logical address that you want NetObjects Fusion to use when referring to that object On some servers this is referred to as creating virtual folders Once the site is published you or your server administrator must con gure the server to look in the FTP location for assets that are described as being in the URL location 26 18 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P For example your site might include several stock images from your company s marketing department such as the company logo and other approved art work When you create your site you use copies of the art work that you stored on a local disk When you publish and upload your site to the company server however you want to use the of cial images that have been approved and maintained by the marketing department Check with your server administrator to see if your site contents or
207. ck the Source button G In Assets view click the Data Objects tab and then click New on the control bar The Data Object dialog appears Select External and then click the Source button The Data Source Type dialog appears 2 Select the data le type from the drop down list NetObjects Fusion always lists Access 3 0 Additional data types are available if ISAM drivers are installed ISAM drivers are automatically installed when you install Microsoft FoxPro Microsoft Visual FoxPro Paradox Microsoft Excel or dBASE Note If the data is in Microsoft Excel 97 Workbook format use an ODBC driver See Creating an External Data Object from a SQL Data Source on page 20 14 3 Click the Browse button locate the database and open it C R E A T I N G A D A T A O B J E C T Data Publishing 20 13 If the le is a multiple le database or a spreadsheet with multiple tabs the Select dialog appears 4 Select the le or tab you want to use and click OK NetObjects Fusion creates the data object and makes it an asset of your site The data object contains all elds in the external source and takes the name of the selected le or tab All elds are Simple text elds regardless of their type in the source The data object is now an asset of your site and you can continue as follows G If you re working in Page view the Data Publishing dialog is still open You can select elds and format the data lis
208. click the Layout or select it from the Object Tree The General tab of the Layout Properties palette appears 2 Click the HTML button The Page HTML dialog appears 3 Enter your HTML or scripts in the text box of the appropriate tab then click OK See Chapter 22 Working with HTML Directly for a full explanation of custom scripting Setting Layout Background Properties You can control the appearance of each Layout by setting its background properties You can assign a background color place an image in the background or attach a background sound that plays when a visitor views the page Setting the Layout Background Color 1 In Page view click the Layout or select it from the Object Tree The General tab of the Layout Properties palette appears 7 12 Laying Out the Page U S I N G L A Y O U T S 2 Select the Background tab 3 Select a Background Color option SiteStyle sets this Layout background to the default background color speci ed by the current SiteStyle which you selected in Style view Solid Color sets this Layout background to a solid color of your choice The current color appears in the sample box To select a different color click Color select a color from the Color Picker and click OK Picture speci es the image le that displays as the background of the Layout The current selection if there is one displays in the sample box To select a new or different image click Bro
209. creating placing Adobe Acrobat PDF les 15 14 Advanced toolbar 4 16 AIFF les 15 11 aliased folders 26 17 26 20 26 22 aligning embedded objects 7 28 objects 4 14 Alignment options Flash and Splash les 15 6 Allaire HomeSite 3 0 19 13 alt tags 4 10 Always publish le option 25 4 Anchor icon 14 2 anchors adding 14 5 adding HTML 14 14 deleting 14 7 editing 14 7 from hotspots 14 14 see also links animated gif les 10 2 18 16 SiteStyles 12 12 animation see video les 15 9 anti aliasing options Flash and Splash les 15 6 applying MasterBorders to sections 6 8 SiteStyles 12 4 text styles 8 6 arrows see lines assets 1 4 custom names 25 5 customized 26 23 data objects managing 25 12 displaying pages containing le assets 25 6 Index 2 displaying pages containing links 25 10 le types 25 3 le adding 25 4 le deleting 25 7 le deleting unused 25 8 le managing 25 3 25 9 le opening 25 9 le replacing 25 6 le verifying 25 8 importing limitations 3 8 links adding 25 10 links deleting 25 11 links managing 25 9 25 12 links verifying 25 11 location changing 25 5 referenced managing 19 9 19 11 script managing 26 29 special publishing 26 28 types 25 2 unmanaged publishing 19 13 variables adding 25 12 variables deleting 25 14 variables editing 25 13 variables managing 25 12 Assets folder 1 20 Assets view 1 4 25 2 asset type directory structure publishing 26 4
210. cript yourself For example you can add META tags to index your site for search engines power content with JavaScript or Visual Basic routines center pages throughout your site or do whatever else you can when coding raw HTML You can t edit the HTML NetObjects Fusion generates but you can add your own code virtually anywhere Before working with HTML directly you should be familiar with HTML tags and page structure There are many books and Web sites to learn from If you re not familiar with HTML you can still complete the tasks in Examples of Adding Page HTML on page 22 4 and Examples of Object HTML on page 22 8 This chapter tells you how to add HTML or scripts by G Accessing the page s HTML G Accessing an object s HTML G Inserting HTML in a text box G Coding your own objects You can also code custom frames and framesets insert code within link tags and add your own actions See Chapter 23 Creating Custom HTML Framesets and Frames Adding HTML to a Link on page 14 12 and Customizing Actions on page 21 17 Note NetObjects Fusion doesn t verify HTML you add so be sure to use valid syntax enclosing scripts within lt SCRIPT gt and lt SCRIPT gt tags and so on Also assets referenced in your HTML aren t managed in Assets view If you move the HTML or its assets in your directory structure edit paths in the HTML accordingly 22 2 Working with HTML Directly A C C E S S I N
211. cted To add a MasterBorder click Add The New MasterBorder dialog appears 4 Type a name for the new MasterBorder select an existing MasterBorder to base it on and click OK NetObjects Fusion creates a new MasterBorder based on the selected MasterBorder The new MasterBorder is applied to the current page and its name is added to the drop down Name list in the MasterBorder Properties palette 5 From this point create the MasterBorder by following the steps in Modifying a MasterBorder on page 6 4 Type a name for the new MasterBorder Select a MasterBorder to base the new one on 6 8 Managing MasterBorders and AutoFrames M O D I F Y I N G A N D C R E A T I N G M A S T E R B O R D E R S Changing MasterBorders 1 In Site view or Page view navigate to a page where you want to apply a different MasterBorder and display the page in Page view 2 Click inside the MasterBorder area The MasterBorder Properties palette appears 3 Select the MasterBorder you want from the Name drop down list The margins of the page now display the contents of the selected MasterBorder Applying a MasterBorder to a Section You can apply a MasterBorder to a section of pages in Site view A section is any page and all its children their children and so on 1 In Site view select a section of pages G Hold down the Shift key as you click the parent page of the section G With the keyboard select the parent page
212. ctiveX controls on your system you can get ActiveX controls from the Microsoft site You can also check at www netobjects com and www microsoft com for links to archives of free ready to use ActiveX controls To insert an ActiveX control ActiveX Control tool 1 In Page view select the ActiveX Control tool from the Advanced toolbar 2 Draw a box to indicate the position of the ActiveX control 16 6 Adding Java and ActiveX I N S E R T I N G A N A C T I V E X C O N T R O L The Insert ActiveX Control dialog appears listing the ActiveX controls currently installed on your system The bottom section shows the selected ActiveX control which has an ocx extension 3 To display the le name of the control in the Codebase eld of the ActiveX Properties palette select Set Codebase 4 Select the control you want and click OK The ActiveX placeholder appears on your page and the ActiveX Control Properties palette appears The General tab displays the options for the selected control If you selected Set Codebase the path name and le name of the ActiveX Control appear in the Codebase eld I N S E R T I N G A N A C T I V E X C O N T R O L Adding Java and ActiveX 16 7 Because the options vary depending on which ActiveX control is selected this guide does not describe all the options Step 6 explains how to change them 5 To provide text that the browser displays if it cannot launch the ActiveX control en
213. cts Fusion Basics 1 17 4 To set Backup preferences click the Backup tab G Automatic Backup This option is selected by default When you close NetObjects Fusion the program automatically backs up your nod le and saves it in the backups subfolder under the User Sites sitename folder If you need to use one of these backup les drag it from the backups folder into the User Sites sitename folder before you open it so the asset paths will be correct If you do not want NetObjects Fusion to automatically back up your sites clear the check box G Backup Settings NetObjects Fusion saves backup les in the User Sites sitename folder by default To change the location of the backup les type a new path name in the Backup location eld or click Browse and select a new location Select a backup le name convention from the drop down list you can choose a plain format or one that includes the date and time 1 18 NetObjects Fusion Basics E D I T I N G O B J E C T S A N D A S S E T S Indicate the number of backups you want NetObjects Fusion to keep The oldest backups are overwritten as newer backups are created G Compact database upon exit This option is selected by default Compacting the les can save you substantial hard disk space In addition when this option is selected NetObjects Fusion performs an error checking procedure to verify your database as it compacts the les It is recommended that you do
214. cture After you place a picture you can rotate it in 90 degree increments When you rotate a picture NetObjects Fusion creates a new image le that contains the rotated image It does not change your original image le 1 In Page view select the picture you want to rotate The Picture Properties palette appears 2 Select the Effects tab M O D I F Y I N G A P I C T U R E Placing Pictures 10 9 3 In the Rotate eld select the desired rotation Creating a Border Around a Picture You can add a border of a speci ed thickness around a picture 1 In Page view select the picture for which you want to create a border The Picture Properties palette appears 2 Select the Effects tab 3 Use the Border eld to specify the thickness of the border 10 10 Placing Pictures M O D I F Y I N G A P I C T U R E Creating a Transparent GIF When you place a gif image on a page you can select one of its colors and make every pixel of that color transparent Browsers display all pixels in the image except pixels marked transparent Although only part of the image becomes transparent a gif with a transparent color is called a transparent gif You can use transparent gifs to achieve a natural image shape rather than a rectangular one or to silhouette an image against the page background Only pixels of exactly the same color can be transparent If the image background color is dithered it might contain a m
215. ctures media a text box or any other object to modify or control that object You can enclose the object in HTML tags or add HTML or script inside the object s tag You can add code before and after a text box s HTML as described here For information on inserting code inside the contents of a text box see Inserting HTML in a Text Box on page 22 10 1 In Page view select the object you want to add code to and click the HTML button on the Properties palette You can also click HTML on the Object menu or right click the object and select Object HTML from the shortcut menu The Object HTML dialog appears A C C E S S I N G A N O B J E C T S H T M L Working with HTML Directly 22 7 2 Click the tab to indicate where you want to insert HTML or script G Before Tag Adds code just before the object s tag as in your_code lt IMG SRC gt if the object is a picture G Inside Tag Adds code inside the object s tag as in lt BODY SRC Image gif attribute gt where attribute is your code G After Tag Adds code just after the object s tag for example to insert a closing HTML tag for any opening tag inserted before the object 3 Enter your code in the white area of the dialog Your typing shown in blue appears in the dialog s grey area where you can preview its location in the object s HTML You can click the Insert button to insert contents of an HTML script or other text le C
216. d II Creating and Modifying Text Styles You can create your own text styles and add them to the Styles list or modify the default text styles included with NetObjects Fusion Text styles can be based on other text styles For example if you create text styles for headings you could specify the formatting for the H1 style then create an H2 text style that is based on H1 You would only have to specify formatting that differs from H1 for example the font size or style Creating a Text Style 1 In Page view from the Text menu choose Edit Text Styles 8 10 Designing with Text C R E A T I N G A N D M O D I F Y I N G T E X T S T Y L E S The Text Styles dialog appears 2 Click New The New Style dialog appears 3 Enter a name for the new text style and if you like select a text style on which to base this new style from the Based on drop down list 4 From the Following Paragraph drop down list select the text style you want to appear automatically after the style you are creating Leave it blank if you want the following paragraph to be the same style as the one you are creating 5 Click Paragraph to modify paragraph settings C R E A T I N G A N D M O D I F Y I N G T E X T S T Y L E S Designing with Text 8 11 The Paragraph dialog appears Set the options you want G Specify the number of units you want to indent the paragraph in the Indent Level section G If you are creating a text style fo
217. d URL can include the protocol host name or DNS path name and sometimes a le name such as http www netobjects com products fusion html Each external link you create becomes an asset of the site that you can easily update in Assets view To create an external link 1 In Page view select an object to link G If you are linking text select the text you want the browser to display as linked G If you are linking a picture or other object click to select it 2 In the Properties palette for that object click Link The Link dialog appears 14 10 Creating Links and Anchors W O R K I N G W I T H L I N K S 3 Select the External Link tab The Select Frame Target control appears only when the current page contains an AutoFrame For more information about link targets see Targeting Links in AutoFrames on page 24 2 The External Link tab shows a list of external links you previously entered in the current site 4 Select a protocol from the URL drop down list If you re creating a link that does not require a protocol select the existing protocol and press Delete If you want to use a protocol that is not in the drop down list simply type it 5 Either enter a new URL or if you already created a link asset for this URL select it from the list When the site visitor clicks the selected object this link target is displayed If you select a link target from the list of assets its URL and name a
218. d assets have a black lock image on their icons signifying that they cannot be renamed or rearranged The Contents pane on the right displays the contents of the folder currently selected in the Directory pane For each folder page or asset the Contents pane displays its name type attributes and the last date each page or asset le was published locally and remotely You can sort the content les and folders by clicking a column heading and you can resize the columns by dragging the column heading border to the left or right The icons displayed for different le types are set in the File Types Registry of the Windows 95 options 26 4 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P Click a folder s plus sign to expand the display to show the subfolders beneath it Click a folder s minus sign to collapse the display and hide the subfolders beneath it You can also resize the Directory and Contents panes by dragging the divider bar in either direction Con guring Publish Setup Before you can publish you should con gure three publishing settings the directory structure the type of HTML output and the server locations where you want to store the published results Setting the Directory Structure When you publish your site you control the directory structure NetObjects Fusion uses to arrange your les and assets on the server Setting the directory structure does not change the site structure th
219. de ned variable 8 18 Designing with Text C H E C K I N G S P E L L I N G 2 From the Text menu choose Insert Field The Insert Field dialog appears 3 Select User de ned Variable from the Type drop down list 4 Click New The New Variable dialog appears 5 Type a name and value for the eld and click OK The eld appears highlighted in the Field list of the Insert Field dialog 6 Click OK Formatting a Date amp Time Field 1 In Page view click the Date amp Time eld 2 From the Text menu choose Edit Field The Edit Field dialog appears 3 Click Date Format on the Edit Field dialog then select a new format from the Select format list Click OK in the Date Format dialog 4 Click OK in the Edit Field dialog Checking Spelling You can check the spelling of English language words using the spelling checker that is included with NetObjects Fusion You can add words to a personal dictionary so they will no longer be agged as misspelled Your personal dictionary is a simple text le so you can use any text editor to add or delete words The spelling checker checks one page at a time 1 In Page view choose the text you want to check G To check all text boxes and tables on the page select nothing G To check a particular block of text or an individual word select it 2 From the Edit menu choose Spell Check F I N D I N G T E X T Designing with Text 8 19
220. ding Tables 9 7 Modifying a Cell s Text Box Properties 1 In Page view select the cell The Text Properties palette appears 2 Click the text box boundary Solid handles appear around the text box and the Text Properties palette displays the Text Box tab and the Action tab 3 Modify Text Box properties See Working With a Text Box as an Object on page 8 3 Resizing Columns and Rows 1 In Page view select the table 2 Point to the column or row you want to resize The pointer changes to a horizontal arrow 3 Click and drag the cell boundary to the new size Inserting a Row 1 In Page view select the item above where you want the row to be inserted G To insert a row at the bottom of the table select the table G To insert a row between two existing rows select a cell in the row you want to be on top of the row you re inserting 2 From the Object menu choose Table Add Row 9 8 Adding Tables M O D I F Y I N G A T A B L E Removing a Row 1 In Page view select where you want to delete the row G To remove the last row in a table select the table G To remove a row from between two existing rows double click a cell in the row that you want to remove 2 From the Object menu choose Table Remove Row Inserting a Column 1 In Page view select where you want to insert the column G To insert a rightmost column to your table select the table G To insert
221. dit Text Styles The Text Styles dialog appears 2 Select the style you want to modify then click Change The Change Style format name dialog appears 3 In the Change Style dialog you can change any of the options assigned to the paragraph For information on this dialog see Creating a Text Style on page 8 9 4 When you are nished click OK in the Change Style dialog 5 In the Text Styles dialog click Close NetObjects Fusion updates any paragraph to which you applied the style with the new description Modifying Styles by Example You can also modify a text style by formatting a paragraph then reapplying the style 1 In Page view select a paragraph that is in the style you want to modify so the style name is selected in the Style list on the Text Properties palette 2 Select the text and use the Properties palette to change it to the font size style color and alignment you want 3 Now select the style again from the Style list The Reapply Style dialog appears showing the name of the selected style 4 Select Rede ne the style using the selection as an example and click OK I N S E R T I N G S Y M B O L S Designing with Text 8 13 Note If you select Reapply the formatting of the style to the paragraph you lose all your changes and the paragraph returns to its original settings for that style The selected style now has the changed format and all paragraphs with that styl
222. e are updated Inserting Symbols You can insert special symbols such as an em dash copyright symbol registered trademark symbol and so on 1 In Page view if necessary double click inside a text box to put it in text edit mode 2 Click where you want to insert the symbol 3 Select Insert Symbol from the Text menu 4 Select the symbol you want to insert from the Insert Symbol dialog then click Insert The symbol appears in the text Wrapping Text around Objects You can wrap text around objects by embedding the object in a text box Text tool 1 In Page view select the Text tool from the Standard toolbar and draw a box on the page 2 Select the appropriate tool from the Standard toolbar and embed the object in a text box See Embedding Objects in a Text Box on page 7 24 for information 8 14 Designing with Text W R A P P I N G T E X T A R O U N D O B J E C T S The Picture Properties palette appears 3 Click Align The Align tab appears 4 Set the wrap options you want G In the Alignment section select the appropriate wrap option If you select Left wrap the text wraps around the right side of the object if you select Right wrap the text wraps around the left side of the object G In the Space around object section specify the amount of space you want to leave between the image and the text 5 Enter the text W R A P P I N G T E X T A R O U N D O B J E C T S D
223. e design includes multiple objects you can group those objects within a Layout Region When you move a Layout Region on the page all its embedded objects move with it and maintain their positions relative to each other and the Layout Region This makes it easier to design manipulate and manage multiple objects or multiple groups of objects on a page You can also send cascading action messages to the Layout Region and it will pass the message to all of objects embedded within it This makes it easier to create and manage groups of objects with similar or related actions and to use actions ef ciently See Building Dynamic Pages on page 21 1 for information on adding and cascading actions G You can embed a Layout Region within a text box This gives you position based placement of the objects within the Layout Region while the rest of the page is arranged in a text based layout The embedded Layout Region can be aligned within the text box just like any other embedded object This combines precise positioning of key content with the ef cient HTML output of a text based layout taking advantage of both alternatives See Embedding Objects in a Text Box on page 7 24 for speci c information G You can assign to a Layout Region a different HTML output method from that used for its parent Layout For example you can overlap objects within a Layout Region set for CSS and Layers output while the rest of your page or site is form
224. e following HTML lt target framename gt using the actual name of your target frame For example you might use the following HTML for a link to a secondary menu page 6 Click OK and the Link dialog appears Click Link to complete the link 23 10 Creating Custom HTML Framesets and Frames A D D I N G C O N T E N T F O R F R A M E L E S S B R O W S E R S Adding Content for Frameless Browsers Some site visitors may have browsers that don t support frames so you should include unframed content to give them some information when they access your site Site visitors using browsers that do support frames do not see this content To de ne this alternate content for frameless browsers you can use the HTML lt NOFRAMES gt lt NOFRAMES gt tag to add text pictures and links to the frameset that you created by modifying the layout HTML and the contents of your frameset page 1 In Page view open the frameset page 2 Click the Layout The General tab of the Layout Properties palette appears 3 Click the HTML button to display the Between Head Tags tab of the Page HTML dialog 4 Select the Beginning of Body tab In the text eld of this tab enter lt noframes gt your message to frameless site visitors using any valid HTML tagging lt noframes gt A D D I N G C O N T E N T F O R F R A M E L E S S B R O W S E R S Creating Custom HTML Framesets and Frames 23 11 For example your message might look
225. e full URL to the site s top level source page in the Home Page URL eld To ensure accuracy navigate to the site or page using your browser then cut and paste the URL from the browser The starting page of your site import does not have to be the source site s Home page usually named index htm or index html it can be any page of any accessible Web or intranet site 4 From the Assign MasterBorder drop down list select the MasterBorder you want to apply to the imported site or section NetObjects Fusion displays the list of MasterBorders available in the current site if there is no site currently open the MasterBorder Import is applied by default 5 Set the limits for the number of pages and number of levels you want to apply to the import process E X P A N D I N G Y O U R S I T E Importing and Exporting 3 11 6 If you are importing and converting a local site enter the domain name for the site s Home page in the Domain name eld If the local site was ever published on the Web use the domain name that was used to access it if not leave the placeholder www domain com in the eld When it imports a local site NetObjects Fusion needs to know the home base domain of that site so it can tell whether to convert the links it nds into external or internal links It does that by comparing the targeted domain if there is one to the domain name you entered 7 If you are importing and converting a remo
226. e in browser is selected If you want this object to be hidden when the page is loaded clear the check box Add Action button 4 To add a new action click the plus button in the lower left corner The Set Action dialog appears Use this dialog to con gure the action by specifying its trigger target message and parameters 5 To override the default action name enter a descriptive name for the action in the Name eld A D D I N G A C T I O N S T O O B J E C T S Building Dynamic Pages 21 7 6 Specify the triggering event for this action in the When eld See Specifying a Trigger Event on page 21 7 for information 7 Specify the target for this action in the Target eld The default target is always the object itself See Specifying an Action Target on page 21 9 for details 8 Specify the message you want this action to send to the target object in the Message eld See Specifying an Action Message on page 21 10 for information 9 Specify the appropriate parameter for this message in the Parameter eld See Specifying an Action Parameter Value on page 21 12 for information 10 If your target object is a text box Layout Region or Layout you can send this message to all objects contained within the target object To do so select Cascade Action See Creating Cascading Actions on page 21 15 for details about cascading actions 11 When you nish con guring your
227. e or decrease the spacing between buttons enter a new number in the Spacing eld Setting the Navigation Bar Style By default new navigation bars take on the style of the currently applied SiteStyle but you can set individual navigation bars to any available SiteStyle If a SiteStyle works for most but not all pages in your site use a different SiteStyle for the exceptional pages You can also choose whether the button for the current page will be highlighted or not Use button highlighting to show site visitors which page they are on The highlighted button picture is different from the regular button so a glance at the buttons quickly indicates the current page If you are using AutoFrames be aware that highlighting can affect the way the browser refreshes your page See AutoFrames and Browser Refresh on page 24 10 for more information 13 8 Creating Navigation Bars and Banners U S I N G B A N N E R S To set a button style 1 In Page view select the navigation bar The General tab appears on the Properties palette 2 In the Button Style section of the General tab select Other and choose a different style from the drop down list 3 To turn off highlighting clear the Use Highlighting checkbox Setting the Navigation Bar Background You can set a background color for a text or button navigation bar A background color can visually unify a navigation bar if buttons are widely spaced it can also help site
228. e text box without text wrapping left center or right G Horizontal alignment of the object to the text box with text wrapping left align plus text wrap and right align plus text wrap The name refers to the placement of the object not the location of the text wrap If you want the object to be embedded at the top left of the container move the pointer to the absolute beginning of the text in the text box G Blank space around the object in horizontal vertical or both dimensions Aligning Embedded Objects 1 In a text box in Page view select an embedded object The General tab of the object s Properties palette appears U S I N G T E X T B O X E S Laying Out the Page 7 29 2 Select the Align tab of the palette The gure below shows the Align tab for a picture object 3 Select a vertical alignment option as appropriate for the object type 4 Select a horizontal alignment option that is either wrapped or not wrapped as appropriate for the object type 5 Enter a spacing value for the object if appropriate De ning the Text Box as a Form You can set any text box that contains form objects to function as an HTML form If you have form objects in a text box that is not de ned as a form the red exclamation point error signal appears in the corner of the form objects To de ne a text box as a form 1 In Page view select the text box The General tab of the text box Properties palette appea
229. e this information but search engines require it to index your site Note Search engines index frameset les so if your site uses frames be sure to access MasterBorder HTML so your tags are added to the frameset le E X A M P L E S O F A D D I N G P A G E H T M L Working with HTML Directly 22 5 1 In Page view click in the Layout area of the page you want indexed or in the MasterBorder or AutoFrame to index a set of pages 2 Click the HTML button on the General tab of the Properties palette or right click and select Layout HTML or Master HTML from the shortcut menu The Page HTML dialog appears 3 Click the Between Head Tags tab and enter Meta tags that describe your content For example type lt META NAME DESCRIPTION CONTENT Large selection of valuable high quality antiques and collectibles for any budget gt where the content is a one sentence description containing the most important keywords site visitors might search for Then type lt META NAME KEYWORDS CONTENT antiques quality antiques valuable antiques low cost antiques collectibles jewelry furniture novelties gt where the content lists all important keywords 4 Click OK 5 Register your site with search engines You must do this separately with each search engine for it to nd your site Visit AltaVista Excite Lycos Yahoo and so on for information To see the resulting HTML you must publish the site locally
230. eating and Editing Fields NetObjects Fusion provides a list of elds you can include on your pages such as the date and time the site was created or last modi ed the site name and author and so on You can also de ne your own elds to include on your pages Inserting a NetObjects Fusion De ned Field 1 In Page view double click in the text box then put the pointer where you want to insert the eld 2 From the Text menu choose Insert Field The Insert Field dialog appears 3 Select the type of eld you want to insert from the Type drop down list If you select Date amp Time select a date format by clicking Date Format Then select a format from the list displayed in the Date Format dialog Click OK 4 Click OK in the Insert Field dialog Creating a User De ned Variable A user de ned variable is text or a phrase that is subject to change For example you might refer to a product in development that has only a code name The name appears on many pages in your site By creating a user de ned variable you can C R E A T I N G A N D E D I T I N G F I E L D S Designing with Text 8 17 insert the product name as a eld When the product name changes you can edit the eld as described in Editing a Variable on page 25 13 Then NetObjects Fusion automatically updates all the instances of the name in your site 1 In Page view double click in the text box where you want to insert a user
231. ected page 3 Type a name for the anchor in the Name eld The name cannot contain spaces Choose an appropriate name because you reference this anchor by name later and the name appears in the browser when the pointer passes over it 4 Click OK Anchor icon If Object Icons is checked in the View menu the Anchor icon appears at the anchor location on the page W O R K I N G W I T H L I N K S Creating Links and Anchors 14 7 To edit an anchor click the Anchor icon and change its name in the Change Anchor dialog To delete an anchor click the Anchor icon and click Remove in the Change Anchor dialog Creating a Smart Link Smart links lead to a page in your site based on its relative position in the structure rather than its name These links automatically adjust when you change your site structure For example if your smart link leads to the parent of the current page and you later move the current page to a different parent NetObjects Fusion updates the link to point to the new parent Sometimes a smart link is called a structural link To create a smart link 1 In Page view select an object to link G If you are linking text select the text you want the browser to display as linked G If you are linking a picture or other object click to select it 2 In the Properties palette for that object click Link The Link dialog appears 14 8 Creating Links and Anchors W O R K I N G W I T H L I N
232. ects Fusion jsb You can also use the Set Action dialog to script your own actions for any object You can de ne these actions in any valid scripting language JavaScript JScript VBScript or CGI To add a scripted action to an object 1 In Page view select the object The object s default Properties palette appears 2 Select the Actions tab The Action tab displays the Object ID for the current object 3 By default the Object initially visible in browser option is checked If you want this object to be hidden when the page is loaded clear the check box Add Action button 4 Click the plus button in the lower left corner to add an action C U S T O M I Z I N G A C T I O N S Building Dynamic Pages 21 21 The Set Action dialog appears 5 Check the Scripted action option in the bottom left corner NetObjects Fusion modi es the Set Action dialog to display the Action scripting text box 6 Use the Action text entry eld to enter your scripted action NetObjects Fusion gives you three methods for building a custom script G You can enter script or paste any valid JavaScript JScript or CGI coding directly into the text entry eld NetObjects Fusion does not validate or otherwise check the code you enter 21 22 Building Dynamic Pages C U S T O M I Z I N G A C T I O N S G You can insert a prede ned script from another le G You can insert any action you have already de ned for t
233. ed from the Open dialog This le appears in the Action eld When visitors click Submit their Web server executes the CGI script at this URL Note If the URL isn t to your server s cgi bin folder you also have to customize your site s published directory structure by renaming cgi bin appropriately See Customizing Your Directory Structure on page 26 21 G Method Select the method for sending form data to the Web server Select Post which is the preferred method to send data as a standard stream of name value pairs separated by an ampersand amp Select Get to send data using environment variables Use Get with care as some Web servers truncate data sent via this method G Encoding Type If your Web server requires data to be encoded in a particular format such as MIME or BinHex type the format here 4 Click OK A D D I N G H I D D E N F I E L D S Designing and Implementing Forms 17 19 Adding Hidden Fields If a CGI script is processing your form you probably need to use hidden elds to pass additional information to it such as which elds must be lled out to display the success page or where to return data once it s been processed for example to your email address Site visitors don t see these elds but their values are submitted to the script along with form responses Note If you re not sure what hidden elds a CGI script requires ask the script author or your Web ad
234. ee this content To de ne alternate content for frameless browsers you can use the HTML lt NOFRAMES gt lt NOFRAMES gt tag to add text pictures and links to the frameset that you created with AutoFrames A D D I N G C O N T E N T F O R F R A M E L E S S B R O W S E R S Working with AutoFrames 24 11 1 In Page view click a border of the frameset page The General tab of the MasterBorder Properties palette appears 2 Click the HTML button The Between Head Tags tab of the Page HTML dialog appears 3 Select the Beginning of Body tab In the text eld of this tab enter lt noframes gt your message to frameless site visitors using any valid HTML tagging lt noframes gt For example your message might look like the gure below 4 Click OK to close the dialog 24 12 Working with AutoFrames A D D I N G C O N T E N T F O R F R A M E L E S S B R O W S E R S A site visitor with a browser that supports frames sees the framed site as you designed it A site visitor with an older frameless browser sees the lt NOFRAMES gt message A D D I N G O T H E R S C R I P T S T O A U T O F R A M E S Working with AutoFrames 24 13 Adding Other Scripts to AutoFrames You can use the Page HTML dialog to add custom HTML or scripts to any frame in the frameset or to the frameset itself 1 In Page view click a border of the frameset page The General tab of the MasterBorder Properties palette appears
235. eference HTML from the shortcut menu The Reference HTML dialog appears 3 Click Browse The Open dialog appears 4 Select the top level HTML le you want to reference and click Open to return to the Reference HTML dialog 5 Choose which les to reference and assign a MasterBorder NetObjects Fusion adds the top level page you re referencing here and its children below Select an existing page and choose the Reference HTML command R E F E R E N C I N G H T M L F R O M S I T E V I E W Referencing and Editing External HTML 19 3 G Assign MasterBorder Choose a MasterBorder from this drop down list Each HTML le you reference occupies the Layout area of a page while the MasterBorder gives pages the consistent look of your site To display external content with its original look choose ZeroMargins Note If any external HTML you re referencing contains frames you must choose the ZeroMargins MasterBorder G Limit number of pages to You can select this option to enter a number of les to reference NetObjects Fusion begins with the Home page you select and stops referencing when it reaches the end of the site or the number of pages entered here G Down to structural level Select this option to enter how many levels of your site structure to reference NetObjects Fusion references as many pages as possible at a higher level before going to a lower level G Do not manage or move assets If you
236. egion s HTML Output on page 7 17 for information To set the publishing method for your site 1 In Publish view click the Setup button on the control bar or choose Publish Setup from the Publish menu The Publish Setup dialog appears C O N F I G U R I N G P U B L I S H S E T U P Publishing Your Site 26 9 2 Select the HTML Output tab 3 Select the publishing method you want to use from the Output Type drop down list When you select an option NetObjects Fusion displays a short description of that option s effect The selected output method becomes the default for all the pages in the site unless overridden in a speci c Layout or Layout Region 4 In the Options section of the dialog G To include comments in the HTML le created for each page select the Generate HTML comments option The comments identify the beginning and ending of each page s head and body as well as objects G If you are working with special character sets such as Japanese or Chinese and are familiar with their related coding issues and trade offs you can prevent NetObjects Fusion from converting high ASCII characters to their HTML equivalents To do so select Skip High ASCII character set conversion The default is to leave ASCII character set conversion turned on this is the correct setting for most sites 26 10 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P G Use the Quote Type drop down li
237. eholder appears on your page and the Time Based Picture Properties palette appears 3 Double click the Number of Images row and specify the number of images you want to rotate You can use up to 24 images NetObjects Fusions adds an Image Start Time for Image and URL for Image row for each image 4 To select an image double click the Image row select the image from the Picture File Open dialog and click Open For information about adding an image to your site see Adding Pictures on page 10 3 5 Double click the URL for Image row then select the type of link For information about creating links see Working with Links on page 14 2 6 Specify the link information and click Link 7 Double click the Start Time for Image row and select a starting time from the drop down list The start time determines when the image is displayed on your site You can select one hour increments from 12 a m to 12 p m The image is displayed until the next image s starting time 8 Repeat steps 4 through 7 for each image you add The number of images is 3 by default L O A D I N G P I C T U R E S O N T O Y O U R S I T E Using NetObjects Fusion Components 18 15 Loading Pictures onto Your Site Use the NetObjects Picture Loader Component to load an image from a site other than your own You can use this to place advertising banners if the banners are located on a server other than your Web server To load a
238. elf or your co workers about the status or content of individual pages Section Properties G Custom Names You can only set a custom le extension See Using Custom Page Names and Extensions on page 2 15 G Color Applies a color to the section G Status Marks the section as Done or Not Done G Publish Don t Publish Sets the publication ag for the section G MasterBorder Sets a MasterBorder for a section of pages Setting a MasterBorder for a section is described in Applying a MasterBorder to a Section on page 6 8 Zooming In and Out You can select the Zoom In or Zoom Out tool from the toolbar The Zoom In tool is a magnifying glass with a plus sign the Zoom Out tool has a minus sign For information on using the toolbar see About Toolbars on page 1 6 Zoom Out tool Zoom In tool 2 12 Creating and Managing Sites A D D I N G D E L E T I N G A N D M O V I N G P A G E S You can reverse the function of the current Zoom tool by holding down the Alt key For example if the current tool is Zoom In pressing Alt makes it Zoom Out As soon as you release the Alt key it becomes Zoom In again Adding Deleting and Moving Pages In Site view you can modify the structure of a site at any time by adding deleting and moving pages NetObjects Fusion automatically changes the links between pages when you modify the structure Adding Pages 1 In Site view select the page you want to be the par
239. en you chain actions together in a sequence you use a message from one action to trigger the next action Use the When message menus in the Set Action dialog to select the triggering message that kicks off this action When eld menu button 1 In the Set Action dialog open the When menu A list of the event subjects that you can use to de ne the trigger event appears Mouse driven events for example can be triggered when the site visitor clicks the mouse or moves the mouse pointer over the object Object driven events can be triggered when the object is hidden shown generates an error or is loaded on the page Page driven events can be triggered when the page nishes loading in the browser or when the site visitor leaves the page 2 Point to the trigger category then click the event or condition you want To select a custom message point to Custom and select from the list displayed See Creating Custom Messages on page 21 18 The name of the trigger event appears in the When eld The When menu displays trigger categories Choose an event or condition for a trigger A D D I N G A C T I O N S T O O B J E C T S Building Dynamic Pages 21 9 3 Continue setting the action target message and parameters as needed Specifying an Action Target The target of an action is the recipient of the action s message An action can target any one of the other objects or containers on the current page If
240. ent of the new page 2 Do any of the following G Click the New button on the control bar G From the Edit menu choose New Page or press Ctrl N G Right click the parent page and choose New Page from the shortcut menu In Site view the new page appears beneath the selected page The new page is named Untitled A D D I N G D E L E T I N G A N D M O V I N G P A G E S Creating and Managing Sites 2 13 Deleting Pages 1 In Site view select the page you want to delete and do any of the following G From the Edit menu choose Delete Page G Right click the page and choose Delete Page from the shortcut menu G Press the Delete key 2 Click Yes in the NetObjects Fusion warning dialog to con rm the deletion Note Deleting a page removes all its child pages and cannot be undone You cannot delete the Home page Moving Pages When you move pages in Site view NetObjects Fusion automatically updates all affected links within the site 1 In Site view select the page you want to move You cannot move the Home page 2 Drag the page to the target page where it becomes either a sibling or a child in its new location As you drag the page a colored outline highlights the target page The outline is red unless you change the Site view background color A triangle to the left or right of the target page s border indicates the moved page will be a sibling a triangle below the target page s border
241. er Messages about conditions such as the page loading or a particular state of the server Messages sent from or by other objects G An action message is the information that gets passed from the source object to the target object An action message can be a statement or a conditional expression G A target is any object that receives the message and acts upon it Triggering Actions There are a variety of ways that you can de ne the triggering event for an action You can G Set the state of the browser as a triggering event so actions are triggered when the page loads or when the browser leaves the page You might for example de ne one set of actions to occur when the page loads and have another set of actions triggered to reset the objects or the page to their original state when the browser exits G Set actions to respond to various forms of onscreen interaction including clicking hovering over or dragging objects on the page For example images are frequently used as buttons to launch actions when the site visitor clicks them G De ne custom messages and then use them as the triggering event for other actions This lets you link actions together that do not require onscreen interaction or changes to object states G Use completion messages from one action to trigger another action For example you can have one image y in to your page from top right its completion triggers the y in of the second
242. eral tab of the Layout Properties palette appears 3 Click the HTML button The Between Head Tags tab of the Page HTML dialog appears 4 In the text eld of the tab enter the HTML code that de nes the page as a frameset and de nes the size names and con guration of the frames it contains For example the HTML code to create two horizontal frames one body frame called main and one footer frame called menu might look like this 5 You can include other HTML frame attributes as needed For example to set a frame to have zero margins enter this HTML between the frameset tags lt frame name menu src html menu html scrolling no marginwidth 0 marginheight 0 gt 6 Click OK and your frameset is established D E F I N I N G A F R A M E S E T Creating Custom HTML Framesets and Frames 23 5 Frameset Paths and File Names The src attribute of a lt FRAME gt tag identi es the URL of the source le that rst displays in that frame This can be a relative path like the one shown above or an absolute URL If the source le for your frame is an internal page you must make sure the src attribute exactly matches the le name that NetObjects Fusion assigns when it creates the page For example if your source page name has spaces or special characters NetObjects Fusion converts those special characters and spaces to underscores when it generates the page When you script your
243. ere to specify a custom name 2 16 Creating and Managing Sites R E N A M I N G P A G E S 3 Set the Custom Names options G Page Title Appears in the title bar of the browser s window when it displays this page When your site visitors creates a bookmark on this page it is named from the page title The title is also emphasized in search engines queries G Navigation Button Appears in navigation buttons leading to this page useful when your page s name is too long for a button To add a second line to the button text press Enter after the rst line G Banner Appears in the page s banner makes possible a banner with a longer name than practical for a le name or button To add a second line to the banner text press Enter after the rst line G File Extension Speci es a custom extension for your page le Page les usually have an htm or html extension In some special cases a page requires a different extension to function with some server software For example pages for secure locations use the extension shtml For information on changing the default extension for pages see De ning Server Pro les on page 26 10 When a section is selected you can only set a custom le extension which applies to the whole section 4 When you nish click OK S E T T I N G S I T E V I E W P R O P E R T I E S Creating and Managing Sites 2 17 Setting Site View Properties The Site tab of
244. erlacing and animation If your gif is interlaced or transparent NetObjects Fusion parses this information NetObjects Fusion also supports animated gifs An animated gif le contains multiple images that a browser plays in sequence It adds movement to your pages without requiring browser plugins You use a gif animation program to create an animated gif image and place it as you would any gif G Portable Network Graphics png supports any color depth image Web browsers require a plugin called PNGLive to view the image NetObjects Fusion includes sample pictures in the NetObjects Fusion 3 0 Samples Content Images folder When you place a picture NetObjects Fusion offers to convert image les that are not in a Web standard format such as Photoshop bmp and so on to either png or jpg format Use the Picture tool to place Flashpix fpx images in a Layout in Windows NT only Use the Media Plug in tool as described in Inserting Other Types of Files on page 15 14 to place an fpx image in either Windows 95 or Windows NT A D D I N G P I C T U R E S Placing Pictures 10 3 Adding Pictures Picture tool 1 In Page view choose the Picture tool from the Standard toolbar and draw a box where you want to place the picture The Picture File Open dialog appears 2 Select the image le you want from your hard disk CD ROM or LAN NetObjects Fusion provides lters so you can view only the type of le
245. ert HTML tags See Inserting HTML in a Text Box on page 22 10 for information G Import an HTML page G Link text to images or other text See Chapter 14 Creating Links and Anchors Working With a Text Box as an Object When the text box is selected as an object the handles are solid and NetObjects Fusion only displays the Text Box and Actions tabs on the Text Properties palette Solid handles 8 4 Designing with Text A D D I N G T E X T When the text box is an object you can G Cut copy and move the text box G Place objects in the text box G Delete the text box and all its contents Adding Text You add text to a page in one of three ways G Using the Text tool G Dragging and dropping a text le G Pasting text from the Clipboard Using the Text Tool Text tool 1 In Page view select the Text tool from the Standard toolbar then draw a box on the page The text box appears on the page in text edit mode and the Format tab of the Text Properties palette appears 2 Type or paste text in the text box Text wraps to the width of the text box S E T T I N G T E X T B O X P R O P E R T I E S Designing with Text 8 5 Dragging and Dropping a Text File N In Windows Explorer locate the text le select it then drag and drop it onto the page The text appears on the page in a text box The text box is a text editor and the Format tab of the Text Properties palette appears
246. erties palette where it is offered The Color Picker appears with a blank palette 2 Select Custom Palette from the drop down list at the top of the dialog 3 Click Load 4 In the Open dialog navigate to the palette you want to use then click Open This palette is displayed in the Color Picker until you change it 5 Click OK to close the Color Picker Creating or Editing a Color Palette 1 Click the Color button in any properties palette where it is offered The Color Picker appears with a blank palette 2 Select Custom Palette from the drop down list at the top of the dialog 3 Click a blank box in the palette area 4 Set the RGB values for the color you want to add to the palette or type the hexadecimal HTML value for the color 5 Repeat step 4 for each color you want to add to the palette 1 12 NetObjects Fusion Basics S E T T I N G P R E F E R E N C E S 6 Click Save 7 In the Save As dialog type a le name for the palette and click Save 8 The new palette is displayed in the Color Picker until you change it To reload this palette follow the steps in Loading a Custom Color Palette on page 1 11 Setting Preferences You can change your preferences from any view at any time Changes take place as soon as you click OK to close the Preferences dialog General and Backup preferences apply throughout NetObjects Fusion and affect all sites Page preferences affect the current s
247. erver which some administrators or ISPs might not support To nd out what s required see the usage note at www netobjects com support Submitting Data to a Text File To use the Form Handler component to copy site visitors responses to a text le on your server use the component s tool to create the form s Submit button After creating the form as described on page 17 2 Form Handler tool 1 In Page view select the Form Handler tool from the Component toolbar and draw a rectangle on the form for the Submit button 2 On the Form Handler Properties palette identify the type of server and rename the Submit button if you want Click each row in the palette and enter information as follows G Button Name Type another name for the button s label or use the one that s there Click a Form Handler property here to enter its value in this eld S U B M I T T I N G R E S P O N S E S A S P L A I N T E X T Designing and Implementing Forms 17 15 G Publish to From the drop down list choose the type of Web server you re publishing to Windows Mac or UNIX G Success URL Double click this row and in the Link dialog select the page to display when a site visitor accurately completes the form Click the Link button when you re done G Error URL Double click this row and in the Link dialog select the page to display when the submission fails for example if the site visitor doesn t
248. es 2 Press Delete and click OK in the warning message that appears 3 Switch to Assets view 4 Click the Data Objects tab 5 Select the data object and press Delete You see a warning that the deletion cannot be undone 6 To continue with the deletion click OK Creating Stacked Pages Stacked pages correspond to records in a database When you store information internally in NetObjects Fusion each stacked page lets you enter data for one record If you are drawing information from an external data le each stacked page automatically displays information from a record Note You can add or delete stacked pages for internal data as described in Adding Stacked Pages for Internal Data on page 20 25 To add or delete records for external data you must make the changes in your external database or spreadsheet application and then republish your site Designing the Stacked Page Layout The stacked page Layout determines the appearance of all the stacked pages Data elds and non data objects text pictures or other assets added to the stacked page C R E A T I N G S T A C K E D P A G E S Data Publishing 20 23 Layout are repeated across all the stacked pages In addition Layout changes made to any stacked page are automatically applied to all pages in the stack Unless you selected the Display All Fields option when you created your data list your stacked page Layout is blank You can add text and grap
249. es on page 18 13 for information Picture Loader tool Picture Loader loads an image dynamically at browser request from a URL See Loading Pictures onto Your Site on page 18 15 for information Rotating Picture tool Rotating Picture displays several images in a continuous loop See Adding Pictures That Roll Over on page 18 11 for information NetObjects Fusion Components tool Use the NetObjects Fusion Components tool to add components to your site See Adding Other NetObjects Fusion Components on page 18 18 for information Using the Form Toolbar A form provides a way for you to collect information from site visitors and provides the visitor with a way to request information You use the Form tools to design forms after you designate an area of the page as the form area Forms Button tool Use this tool to add a reset button or if your form will use either your own or a third party s CGI script to add a submit button See Adding Submit Reset and Custom Buttons on page 17 12 for information Check Box tool Check boxes provide site visitors with a way to select one or more items from a group of items or to toggle a single item on and off See Adding Check Boxes on page 17 9 for information Radio Button tool Radio buttons limit the site visitor to selecting one item at a time See Adding Radio Buttons on page 17 8 for information Edit Field tool Single line text elds acce
250. es see NetObjects Web Site Webstar 2 0 Web server 18 11 When message menus 21 8 window components illustrated 1 4 window size at startup 1 13 Windows ODBC Data Source Administrator 20 14 word count 8 20 wrapping text around objects 8 13 wrapping text boxes to browser window 5 12 5 13 WYSIWYG text in browsers 1 14 Z ZeroMargins MasterBorder 6 2 6 9 7 24 7 31 19 12 selecting 6 4 Zoom tools 2 11 4 9
251. es and assets in this base directory This path statement is the value you enter for Base Directory in the Location Properties palette for remote server publishing However the host and base directory might not look anything like the URL that your site visitors use to access your site For security and other reasons service providers frequently name their host machines and user directories according to their own needs My Base Directory or path to my site folder _______________________________________________________ Note If you have your own domain such as www mycompany com and are logging in directly to the account that owns that domain you might not need to specify a base directory because the home directory of that account might be the same location as the base directory 4 What is the name and password for your account You need these so NetObjects Fusion can log on to the server and store your site les My account name ______________ Password _______________ 5 What is the preferred name for the default Home page Your service provider determines what le name the server displays by default for each directory on the server Some servers are con gured to display by default any le named index others default to home or default You must match this preferred name in the Location Properties dialog for remote server publishing My server s default le name is ____________________________ 6 What HTML le na
252. es associated with your site appears including external les and those generated by NetObjects Fusion File types include G images G audio G video G applets plugins G Java scripts G HTML In Assets view you can add new assets and edit the names of assets You can go directly to the page containing a selected asset You can replace assets delete selected assets or delete all unused assets in a single action You can verify the locations of assets in your site and you can open an asset le for editing in the application that created it 25 4 Managing Assets M A N A G I N G F I L E A S S E T S The File dialog displays an asset s name location and the pages on which it is used To display the File dialog double click the asset s name in the Assets Files view Note Image les that you place on stacked pages to populate an internal data object are not listed in Assets view You can manage such les directly on the stacked pages For information about data objects and stacked pages see Chapter 20 Data Publishing Adding File Assets 1 In Assets view from the Assets menu choose New File Asset or click New on the control bar The File dialog appears 2 In the Location eld of the File dialog type the path and le name of the asset you want to add or click Browse and select a le 3 If you want edit the asset name and click OK See Editing Asset Names and Locations on page
253. es for the object Select this to also publish the le s lt HEAD gt content either in addition to or instead of any lt HEAD gt contents NetObjects Fusion generates If you select this NetObjects Fusion doesn t edit path names in the published HTML but you have to manage images and other assets yourself 19 8 Referencing and Editing External HTML R E F E R E N C I N G H T M L A S A N O B J E C T G Do not manage or move assets If you select this NetObjects Fusion doesn t copy any external assets into Assets view Do this if you prefer that path names in the published HTML not be edited from your native code However you then have to manage images and other assets yourself See Publishing Unmanaged Assets on page 19 13 Preview the page to see the object If necessary go back and adjust the box s position in Page view to get the actual spacing you want As with other objects you can drag a referenced object around the page drag it inside other objects or even layer it Add other referenced objects as well as pictures media and objects created in NetObjects Fusion Double click an external object to edit the HTML See Editing Referenced HTML on page 19 13 T O G G L I N G R E F E R E N C E D L A Y O U T S A N D O B J E C T S Referencing and Editing External HTML 19 9 Toggling Referenced Layouts and Objects You can convert a referenced layout into an object for example to
254. ese steps 20 16 Data Publishing C R E A T I N G A D A T A O B J E C T Select a le in the dialog and click OK If the source refers to a multiple le database or a spreadsheet with multiple tabs the Select dialog appears Select the le or tab and click OK NetObjects Fusion creates the data object gives it the name of the selected le or tab and imports its elds as simple text elds The data object is now an asset of your site and you can continue as follows G If you re working in Page view the Data Publishing dialog is still open You can select elds and format the data list as described in Creating a Data List on page 20 18 and lay out your stacked pages as described in Creating Stacked Pages on page 20 22 G If you re in Assets view take these additional steps a Switch to Page view Data List tool b Select the Data List tool from the Advanced toolbar and draw a rectangle on the page The Data Publishing dialog appears c Select the newly created data object from the drop down list You can now select elds and format the data list as described in Creating a Data List on page 20 18 and lay out your stacked pages as described in Creating Stacked Pages on page 20 22 To create a new data source N Click New in the Select Data Source dialog The Windows Add Data Source wizard takes over Follow the steps in the wizard or refer to the online Help
255. esigning with Text 8 15 The text wraps around the object according to your speci cations For example Setting Paragraphs to Clear Wrapped Objects You can force the paragraph that follows a wrapped paragraph to clear the wrapped object Text tool 1 In Page view select the Text tool from the Standard toolbar and draw a box on the page 2 Select the appropriate tool from the Standard toolbar and embed the object in a text box Specify how you want the text to wrap around the object in the Align tab on the Picture Properties palette 3 Enter the text and press Enter To embed another object continue to step 4 Otherwise skip to step 5 4 If you want embed another object and specify how you want the text to wrap around it Enter the text and then press Enter 5 In the Paragraph section of the Format tab of the Text Properties tab do one of the following G Select the Left check box to restart the text at the rst left margin that is clear of a picture G Select the Right check box to restart the text at the rst right margin that is clear of a picture G Select both check boxes to restart the text when both the left and right margins are clear of a picture 8 16 Designing with Text C R E A T I N G A N D E D I T I N G F I E L D S The following is an example of how a paragraph following a wrapped paragraph looks when it is set to appear when the left and right margins are clear of pictures Cr
256. esktop Database on page 20 11 or Creating an External Data Object from a SQL Data Source on page 20 14 Link it to the table that contains your image eld 3 Switch to Assets view and click the Data Objects button 4 Open the data object for editing by double clicking it 5 In the Data Objects dialog that appears double click the name of the eld that contains your images 6 In the Data Field dialog that appears select the Image File option 7 Close both dialogs and switch to Page view G If you have not created the data list and stacked pages see Creating a Data Object for External Data on page 20 10 G If you have created the data list and placed the image eld on your stacked pages manually or by selecting the Display All Fields option in the Data Publishing dialog when you created the data list go to a 20 18 Data Publishing C R E A T I N G A D A T A L I S T stacked page delete the placed image eld then place it again using the Data Field tool as described in Adding Stacked Pages for Internal Data on page 20 25 Each image from the external data le appears on the appropriate stacked page Creating a Data List Once you create a data object you can create a data list on any page You create a data list and one or more stacked pages at the same time NetObjects Fusion automatically includes linked data list icons in the rst column in the data list The data list thus ac
257. ess xviii NetObjects Component Development Kit CDK 18 1 NetObjects Fusion folder structure 1 19 preferences 1 12 Site view 2 1 starting 2 2 views 1 3 NetObjects Fusion components seecomponents 18 1 NetObjects Fusion Connector component Lotus 18 18 20 2 NetObjects System folder 1 19 Netscape Navigator ActiveX support 16 5 text line spacing 5 3 new browser instance 24 3 New button 1 4 New External Data Source tool 20 7 New Site command 2 4 newspaper quotes 26 10 Next Page button 4 5 nft extension 3 2 NFX components see components 18 1 nod extension 2 2 nod les backing up 2 21 non alphanumeric characters in asset le names 26 13 26 17 non alphanumeric characters in page names 2 14 numbered lists 8 8 O object HTML examples 22 8 object icons hiding 7 2 Object Initially Visible in Browser 21 20 Object initially Visible in Browser option 21 6 Object Tree 4 12 21 10 object driven events 21 8 objects accessing adding HTML 22 6 adding actions 21 5 21 16 adding to table cells 10 6 aligning 4 14 aligning in text boxes 7 28 coding your own 22 11 copying 4 9 distributing 4 14 drag and drop 4 8 Index 10 editing 4 10 embedded aligning 7 28 embedded creating 7 27 embedding 4 11 embedding in text boxes 7 24 embedding with drag and drop 7 26 nding 1 7 inserting into text boxes 7 27 layered rearranging 4 13 locating 4 12 making same size 4 15 moving 4 9 optimizing placement on page 5 8 overla
258. eting 20 22 external 20 6 external creating 20 10 20 18 internal 20 6 internal creating 20 7 20 10 managing 25 12 with external data source 20 4 with internal data source 20 4 data publishing 20 1 data lists creating 20 18 20 22 process 20 5 stacked pages 20 22 20 26 data sources de ned 20 11 Date amp Time eld 8 16 formatting 8 18 date property published sites 26 23 DCR les 15 2 default display font 5 2 default page size 4 3 DefaultMasterBorder 6 4 6 6 de ning framesets 23 4 Layout Regions as forms 7 19 Layouts as forms 7 10 server pro le for local publishing 26 10 server pro le for remote publishing 26 13 text boxes as forms 7 29 deleting anchors 14 7 custom messages 21 19 data objects 20 22 le assets 25 7 folders 26 22 guides 4 4 links 25 11 MasterBorders 6 9 unused le assets 25 8 variables 25 14 deleting pages 2 13 deleting stacked pages 20 26 Developer folder 1 19 DHTML 21 2 DIR les 15 2 Director ActiveX control 15 3 Netscape plug in 15 3 setting properties 15 5 WYSIWYG height and width parameters 15 3 Director les 15 2 directory structure customizing 26 21 26 24 publishing setting 26 4 26 7 Display all elds stacked pages 20 21 display levels button navigation bars 13 5 Display options plug in media les 15 15 QuickTime movies Controls tab 15 8 QuickTime movies General tab 15 7 sound les 15 13 video les 15 10 displaying grids rulers and guides 4 5
259. ette appears The name of the le you selected appears in the File eld on the General tab You can use the Browse button to select a different sound le 5 To provide text that the browser displays if it cannot play the sound type a description in the AltTag eld 6 In the Display section set the display options for this sound G To use the audio player for your browser select Inline If site visitors have Headspace Beatnik installed on their system the browser will use that player to play the sound G To change the sound icon select Icon and click one of the three images The selected image represents a link to the sound on the page G To use another image le as an icon linking to the sound select File click Browse and select an image le 7 Click the HTML button to insert HTML tags and scripts For information about HTML in NetObjects Fusion see Chapter 22 Working with HTML Directly You can add an action to an object using the Actions tab For more information about adding actions see Chapter 21 Building Dynamic Pages 15 14 Placing Media I N S E R T I N G O T H E R T Y P E S O F F I L E S Inserting Other Types of Files Although NetObjects Fusion supports a wide variety of media les you might have other formats such as Adobe Acrobat PDF les that you want to include on your site You can place other les on your site including an Adobe Acrobat VRML RealSpace FlashPix
260. existence when the site visitor goes to the page by assigning this action to it On Page Loaded do Transition with the transition type set to Iris For information on assigning actions to objects see Chapter 21 Building Dynamic Pages Adding a Banner 1 In Page view go to the page on which you want to place the banner Banner tool 2 Choose the Banner tool from the Standard toolbar 3 Drag a box in the MasterBorder or Layout area where you want to place the banner G Drag in a horizontal direction to create a horizontal banner G Drag in a vertical direction to create a vertical banner Set the Banner style in Style view Set the Page name in Site view or in the Custom Name dialog 13 10 Creating Navigation Bars and Banners U S I N G B A N N E R S A new horizontal or vertical banner appears in the current SiteStyle and contains the page name or the text speci ed in the Custom Name dialog The Banner Properties palette displays options for the banner 4 To change the banner orientation select Horizontal or Vertical in the Display section of the General tab Setting the Banner Style and Orientation By default new banners take on the style of the currently applied style but you can set individual banners to any available style If you change the style of a banner in a MasterBorder it changes on every page using that MasterBorder 1 In Page view select the banner The General tab of the Ban
261. ext box or create a new text box using the Text tool from the Standard toolbar 2 Embed all Layout objects in the text box or place them in the MasterBorder Note Layout objects left outside the text box will be overlapped by the text box when you size it to the Layout Unless you want this overlap and use CSS and Layers HTML output to support it you must clear the Size to Layout option resize the text box and embed move or remove the objects Then you can reselect the Size to Layout option 3 Select the text box The Text Properties palette appears 4 Select the Text Box tab if it s not already shown 5 Select Size to Layout The text box expands to ll the Layout Scaling Text Box Contents to the Browser Window To make your text based layout as exible as possible you can also con gure NetObjects Fusion to format the content of a text box so it maximizes itself within the site visitor s browser window To scale a text box s content to the browser window 1 In Page view click any visible MasterBorder or select the MasterBorder from the Object Tree 7 24 Laying Out the Page U S I N G T E X T B O X E S The General tab of the MasterBorder Properties palette appears 2 Using the MasterBorder name drop down list select the ZeroMargins Master Border This MasterBorder is provided by default with NetObjects Fusion if it has been deleted you must create a new MasterBorder of your own
262. f each frame This de nes the frameset as the default target for any links within each frame You can override this default by de ning an individual link to target a speci c frame You cannot reset the default target in AutoFrames however if your page design requires that you set a speci c default target you have to script the frames yourself See Scripting a Default Target Frame on page 23 8 for information When NetObjects Fusion generates the AutoFrames it names the frames Left Right Header Footer and Body The read only Frame name eld on the Frame tab of the MasterBorder Properties palette displays the name of the currently selected frame in grey text T A R G E T I N G L I N K S I N A U T O F R A M E S Working with AutoFrames 24 3 If the framed MasterBorder contains a dynamic element such as a banner highlighted navigation buttons or a smart link NetObjects Fusion names the source page for that frame one of the following G Left_PageName htm G Right_PageName htm G Bottom_PageName htm G Top_PageName htm where PageName is the name of the page that forms the frameset The dynamic element by de nition changes from page to page so NetObjects Fusion has to create separate pages for each MasterBorder If the MasterBorder does not contain any dynamic elements NetObjects Fusion names the source page for that frame one of the following G Left_MasterBorderName htm G Right_MasterBorderName htm
263. focuses exclusively on AutoFrames G Custom frames NetObjects Fusion gives you direct access to HTML so you can manually code frames using the HTML page description language This method requires knowledge of HTML codes and the NetObjects Fusion HTML access interface If you prefer the exibility of creating frames yourself refer to Chapter 23 Creating Custom HTML Framesets and Frames Links within a frame can display a page or display information in the same frame or a different frame Frames can also reduce the amount of refreshing your visitor s browser must do To learn how you can take advantage of these frame features using AutoFrames see Chapter 24 Working with AutoFrames Within a frame you can in uence how variations in browser fonts affect your design using the Rows and Columns option on the Frame properties tab These options work within a frame the same way they do within a Layout For more U S I N G A U T O F R A M E S Managing MasterBorders and AutoFrames 6 11 information about selecting a table structure see Preserving Your Design Intentions on page 5 2 and Optimizing Nested Tables Output on page 5 7 Note Although Netscape Navigator and Microsoft Internet Explorer support frames not all browsers do If you use frames you might want to consider creating an alternate site for visitors with browsers that do not support frames Looking at AutoFrames The following examples illustrate
264. folder See Chapter 2 Creating and Managing Sites for information about templates 1 20 NetObjects Fusion Basics N E T O B J E C T S F U S I O N F O L D E R S T R U C T U R E G Tutorial contains the assets you need for the lessons in NetObjects Fusion Getting Started G User Sites contains all the sites you create NetObjects Fusion automatically creates a new subfolder within User Sites to keep your projects organized Each NetObjects Fusion site is saved with a nod extension The site folder also includes an assets folder where all the assets used in the site are saved and a backups folders where backup nod les are saved You can also save sites in other locations C H A P T E R 2 Creating and Managing Sites 2 1 Creating and Managing Sites 2 Site view is where you create view and maintain the architecture of your site Site view frees you from the details of le and link management so you can focus on organizing and updating your site For example you can drag a page or section to any location in Site view and NetObjects Fusion updates the links to other pages automatically This chapter describes Site view and its automated site building capabilities including G Starting NetObjects Fusion G Starting with a blank site G Opening an existing site G Using Site view tools to select pages and create sections G Setting properties G Adding deleting and moving pages G Renaming pages G Printing
265. for information To create a data object from a SQL data source 1 Create an external data object by doing any of the following New External Data Source tool G In Page view select the New External Data Source tool from the Advanced Tools toolbar and draw a rectangle on the page Data List tool G In Page view select the Data List tool from the Advanced toolbar and draw a rectangle on the page The Data Publishing dialog appears Click the New button The Data Object dialog appears Select External and then click the Source button G In Assets view click the Data Objects tab and then click New on the control bar The Data Object dialog appears Select External and then click the Source button The Data Source Type dialog appears C R E A T I N G A D A T A O B J E C T Data Publishing 20 15 2 Click ODBC and then the Select button The Select Data Source dialog appears It displays all the ODBC data sources stored on your computer You can select an existing data source or you can create a new data source To select an existing data source N To select an ODBC source on your system you can use the File Data Source tab or the Machine Data Source tab G File Data Source Select from the list of data sources and click OK G Machine Data Source Select from the Data Source Name list and click OK Depending on the data source type you choose the Select Workbook or Select Database dialog appears Follow th
266. for information Once the data object becomes an asset of your site you can continue as follows G If you re working in Page view the Data Publishing dialog is still open You can select elds and format the data list as described in Creating a Data List on page 20 18 and lay out your stacked pages as described in Creating Stacked Pages on page 20 22 G If you re in Assets view take these additional steps C R E A T I N G A D A T A O B J E C T Data Publishing 20 17 a Switch to Page view Data List tool b Select the Data List tool from the Advanced toolbar and draw a rectangle on the page The Data Publishing dialog appears c Select the newly created data object from the drop down list You can now select elds and format the data list as described in Creating a Data List on page 20 18 and lay out your stacked pages as described in Creating Stacked Pages on page 20 22 Importing Images from an External Data Source NetObjects Fusion can import images referenced in an external data source A eld in the external data source must provide paths for the location of each image 1 In your database application such as Microsoft Excel or Access create a simple text eld In each record enter the full path to each image for example c my documents images photo gif 2 In NetObjects Fusion create an external data object as described in Creating an External Data Object from a D
267. frame to use that page as its source you must also use an underscore in the source le name so the frame can nd the le You also have to de ne the relative path to the source le correctly NetObjects Fusion determines the relative path to an internal page at the time you are prepared to publish the site The directory structure you select before you preview or publish your site de nes the relative paths between the les NetObjects Fusion offers three prede ned site structures and you can also customize the structure yourself Customizing Your Directory Structure on page 26 21 describes these choices in detail Relative Path Scenarios If you use one of NetObjects Fusion s directory structure choices consider these relative path scenarios when you de ne your frameset For these examples page html stands for any content page section_name refers to any site section and index html represents your Home page Your own le names may be different G If you publish with a Flat directory structure NetObjects Fusion puts all content les including the Home page in the same directory Relative paths in a at structure are always expressed as page html or index html G If you publish with By Asset Type directory structure NetObjects Fusion puts the Home page in the top directory and all content pages in the html subdirectory 23 6 Creating Custom HTML Framesets and Frames C R E A T I N G F R A M E C
268. from a database or spreadsheet NetObjects Fusion publishes the data on your site where it remains unchanged static until the source data is changed and the site is re published Static data publishing which is the focus of this chapter uses data objects that can derive their data from internal or external sources G Dynamic data publishing makes it possible to refresh the data each time a visitor goes to the site When the browser requests the data it is assembled on the spot it does not depend on re publishing the site Dynamic data publishing requires third party components such as Allaire s Cold Fusion and Fusion2Fusion components http www allaire com Selective Server from Fundere http www fundere com Lotus Domino and NetObjects Fusion Connector http www lotus com For information on additional third party components see Adding Other NetObjects Fusion Components on page 18 18 or visit the NetObjects Fusion Web site at www netobjects com Storing Data with NetObjects Fusion Using the data publishing capabilities of NetObjects Fusion you can store text and pictures in a database internal to your site or import data from external sources such as Microsoft Excel Access and ODBC databases In both cases NetObjects Fusion publishes your data in standard HTML pages This makes it easy to add listings such as product and service catalogs employee directories and event schedules to your site
269. g lower version browsers from the rest of your site G Layouts support the column or row priority for page formatting this means your pages will adjust more predictably to your site visitor s font and display con guration Layout Limitations Using the Layout as your page container has the following limitations G Position based pages require more HTML code to achieve pixel level placement of content so your HTML les will be larger G Text cannot ow around other objects unless they are embedded in a text box If you want to create the text wrap effect you have to create multiple text boxes G You can size the Layout as you see t but you cannot set the Layout to wrap to the width of your site visitor s browser If the browser window is wider than your page the page s background will ll in if the window is smaller than your page width your site visitor has to scroll right or left S E L E C T I N G L A Y O U T M E T H O D Laying Out the Page 7 33 Layout Region Considerations In some respects Layout Regions represent a best of both worlds option for laying out your page Like Layouts Layout Regions offer pixel precise placement and a choice of HTML output methods but they can be embedded in text boxes So if you need precise placement or speci c output for some content but want NetObjects Fusion to generate ef cient lean pages you can use text boxes as your main layout container and embed L
270. g Text Colors 12 11 Creating a SiteStyle 12 12 Managing SiteStyles 12 14 Adding a SiteStyle 12 14 Adding All Available SiteStyles 12 15 Removing SiteStyles 12 15 Styles Folder Structure 12 16 13 Creating Navigation Bars and Banners Working with Banners and Navigation Bars 13 2 Using Navigation Bars 13 3 Adding Button Navigation Bars 13 3 ix Setting the Display Options 13 4 Setting the Navigation Bar Type 13 6 Setting the Button Spacing 13 7 Setting the Navigation Bar Style 13 7 Setting the Navigation Bar Background 13 8 Using Banners
271. g Words Lines and Paragraphs 8 20 vii 9 Adding Tables Working with Tables 10 2 Adding a Table 10 3 Selecting a Table 10 4 Selecting a Table Cell 10 5 Selecting a Text Box in a Cell 10 5 Making a Table Cell a Form 10 6 Adding Text and Objects to a Table Cell 10 6 Modifying a Table 10 6 Modifying Cell Properties 10 6 Modifying a Cell s Text Box Properties 10 7 Resizing Columns and Rows 10 7 Inserting a Row 10 7 Removing a Row 10 8 Inserting a Column 10 8 Removing a Column
272. g the use of uppercase and lowercase names and spaces For example if you create a custom folder called companypix and placed it under your assets folder then the URL Path would be assets companypix 13 Enter the FTP path that you want to use to actually store that folder and its contents This FTP location must be on the same server as the rest of the site because your server pro le only logs on to one server at a time 14 Click OK The Location Properties dialog appears 15 If you need to add additional aliases return to step 11 When you publish your site NetObjects Fusion keeps all links and references to your aliased content pointing toward the URL path but actually stores the pages and assets in the FTP location you speci ed Note The server must be con gured to support this alias This is a system administrator task outside NetObjects Fusion s responsibility so you or your server administrator must de ne the alias on the server C U S T O M I Z I N G Y O U R D I R E C T O R Y S T R U C T U R E Publishing Your Site 26 21 Customizing Your Directory Structure Although NetObjects Fusion offers three directory structures you might need to customize your site s directory structure further You can do this in Publish view by renaming rearranging or deleting site folders creating custom folders or changing the publishing properties for folders pages and assets NetObjects Fusion s database keeps t
273. ge images and other assets yourself See Publishing Unmanaged Assets on page 19 13 6 Click OK NetObjects Fusion places this le s lt BODY gt in the Layout area of your new page Check here to also publish the le s lt HEAD gt content either in addition to or instead of the lt HEAD gt NetObjects Fusion generates If you check here NetObjects Fusion doesn t edit path names in the published HTML but you have to manage images and other assets yourself 19 6 Referencing and Editing External HTML R E F E R E N C I N G H T M L A S A N O B J E C T In Page view the referenced HTML lls the Layout area Referencing HTML as an Object You can reference an external le as an individual object on a page Reference an ad banner for example an applet created by a Java generator such as Lotus Bean machine or any other object requiring special code You can even put several external les on a page For example you might construct a front page for a company newsletter that includes a slot for each of several externally maintained story leads and add pictures actions or media created with NetObjects Fusion As when you reference HTML as a Layout area you can incorporate each le s lt HEAD gt tags and script de nitions to include existing Meta tag and script de nitions Information about the referenced le You can double click the Layout area to open the le and edit it
274. get eld s Object Tree to select the target for an action Target Browse button 1 In the Set Action dialog click the Target Browse button The Object Tree shows the hierarchy of all the objects on the current page The Object Tree shows the page s containers MasterBorder Layouts Layout Regions and text boxes with their objects listed below You can expand or contract the Object Tree by clicking the plus or minus sign for each level 2 Select the object you want to designate as the target for this action and click OK The name of the object is displayed in the Target eld 3 Continue setting the action message and parameters as needed Specifying an Action Message The action message is the heart of the action it de nes what the action really does what effect it has and what conditions or behaviors it establishes An action message is essentially an instruction to the target object telling it to behave in a certain way it might for example carry instructions for the target object to Fly In from Top Right when triggered A D D I N G A C T I O N S T O O B J E C T S Building Dynamic Pages 21 11 Your choices for action messages vary depending on the type of object you are targeting For example if you target an action at the Layout there are three potential dialogs that you can display alert con rm and prompt Keep in mind that the action message is itself a trigger that kicks off the action
275. h is helpful if you are adding the template to your site as a page or section However if you want the root page of your template to be the Home page of your site you must create a new site based on the template rather than importing it See Creating New Sites on page 3 4 for information G Although this information refers to the templates provided with NetObjects Fusion the procedure is the same for importing custom templates G You can also reference external HTML pages as a part of your NetObjects Fusion site NetObjects Fusion attaches referenced pages to the site but does not import or convert their contents to NetObjects Fusion format See Chapter 19 Referencing and Editing External HTML for information E X P A N D I N G Y O U R S I T E Importing and Exporting 3 13 G If a template contains a data object NetObjects Fusion stores its image elds only as path names to the image les Therefore if you import a template created on your computer the image elds on stacked pages will still display the image but if you move the template to another computer and import it the image elds will be empty G If you add custom actions to a site save the site as a template and then import the template into a new site the custom actions will not display in the custom actions menu in the new site To import a site or page template 1 In Site view right click the page under which you want to import the template
276. he Properties palette 2 Select Remove Customization 13 16 Creating Navigation Bars and Banners C U S T O M I Z I N G B A N N E R S A N D B U T T O N S C H A P T E R 1 4 Creating Links and Anchors 14 1 Creating Links and Anchors 14 In addition to navigation bars and banners NetObjects Fusion makes it easy to create any kind of navigation aid you might want using links You can link page objects to any other point on the Web including points within your site For example you can make any text image draw object or area of an image into a navigation aid by adding a link You can also create anchors markers at a speci c location on a page to aid navigation in long pages NetObjects Fusion offers several types of links You use internal links to link to pages within the site Smart links are based on the site s structure NetObjects Fusion manages both internal and smart links for you updating them as you change your site structure and page names Use external links to link to other sites on your intranet or on the Internet File links let you link to a le This chapter tells you how to create G Internal links G Anchors G Smart links G External links G File links G Links with added HTML G Imagemaps G Links with actions 14 2 Creating Links and Anchors W O R K I N G W I T H L I N K S Working with Links You can use the linking techniques described in this chapter to manually link objec
277. he data list 8 In the Fields list select elds to include in the data list by clicking the check boxes to the left of the elds As a shortcut you can click the Add All button which marks all elds for display Typically however you display only a subset of elds in the data list and display all elds on stacked pages 9 To link a eld to its stacked page select the eld in the Data Publishing dialog and click the Link Unlink button A data list automatically includes at the left of each row a navigation button that links to the record s stacked page When you link a eld your site visitor can click either the button or the linked eld to jump to the record s stacked page 10 To change the order in which elds appear left to right in the data list click a eld and then click the up and down arrow buttons Continue to select elds and press the up and down arrow buttons until the list is in the order you want 11 Set the following options for creating stacked pages C R E A T I N G A D A T A L I S T Data Publishing 20 21 G Display all elds Places all elds available in the data object in a simple Layout when NetObjects Fusion creates the rst stacked page This shortcut can save you the effort of placing elds individually as described in Designing the Stacked Page Layout on page 20 22 G Add navigation buttons Places relative navigation buttons in a simple Layout when
278. he page select Auto Start 6 To replay the movie when it ends select Loop Inserting a QuickTime Movie QuickTime developed by Apple Computer is a multimedia software architecture used to create and deliver graphics sound video text music and 3D media You can use the QuickTime tool to place QuickTime movies To view QuickTime movies site visitors must have the QuickTime plugin installed in their browsers For more information on QuickTime visit Apple Computer s site at www quicktime apple com I N S E R T I N G A Q U I C K T I M E M O V I E Placing Media 15 7 To insert a QuickTime movie QuickTime tool 1 In Page view select the QuickTime tool from the Media yout on the Advanced toolbar 2 Draw a box where you want to locate the QuickTime movie An Open dialog appears 3 Select the QuickTime le from your hard disk CD ROM or LAN QuickTime media has a mov extension 4 Click Open The QuickTime placeholder appears on the page and the QuickTime Properties palette appears The name of the le you selected appears in the File eld on the General tab To select a different movie le click the Browse button 5 To provide text for the browser to display when it cannot play a movie enter a description in the AltTag eld 6 In the Display section select the option you want G To play the movie in your site select Play Inline G To open a new browser window in wh
279. he page the Select tool automatically becomes active If you want to use a tool repeatedly to add several objects you can double click it to keep it active To hide and show toolbars from the View menu choose Toolbars Name of toolbar A check mark on the menu indicates that a toolbar is displayed P R E V I E W I N G Y O U R S I T E NetObjects Fusion Basics 1 7 Previewing Your Site As you build your site to see how it will appear in the browser of your choice click the Preview button on the control bar NetObjects Fusion generates HTML from your pages and displays your site in the browser speci ed in the Preferences dialog In the Preferences dialog you can also choose to preview the whole site or just the page you are working on For information see Setting Preferences on page 1 12 Although previewing creates folders and les on your disk they do not comprise a working site Certain information critical to a published site for example relative paths to assets are not included in preview les By not including this information previewing displays your site quickly When you re satis ed with your preview go on to publish your site as described in Chapter 26 Publishing Your Site Navigating in NetObjects Fusion NetObjects Fusion offers several navigation tools including the Go menu and buttons on the control bar You use the buttons on the left side of the control bar to move between views For an
280. here to The default value for this parameter in this instance is In from Top However the Fly message has other parameters as well such as speed duration and action repeat All these parameters have default values you can also set new values 1 Select Values from the Parameter drop down list in the Set Action dialog 21 14 Building Dynamic Pages A D D I N G A C T I O N S T O O B J E C T S The Parameter Values dialog appears listing all the parameters prede ned for this message and their default values 2 Select a parameter whose value you want to change The value for that parameter appears in the edit eld at the top of the dialog 3 Set the parameter value G If the potential value choices for this parameter are prede ned the edit eld might offer a means to select your choice such as a drop down list the Color Picker a Picture File Open dialog or a Link dialog Select the parameter value you want from the available list or dialog G If the parameter accepts any values enter one in the edit eld 4 Repeat steps 2 and 3 for other parameter values you want to set 5 Click OK after you set all parameter values The Set Action dialog appears A D D I N G A C T I O N S T O O B J E C T S Building Dynamic Pages 21 15 Creating Cascading Actions If you target an action at a container object such as a Layout or a Layout Region you can instruct the target to forward that action s
281. hes the site without that page or asset To suppress publishing for a page or asset 1 In the Contents pane of Publish view right click the page or asset and select Properties from the shortcut menu The Publication properties dialog appears 2 Select Don t Publish then click OK NetObjects Fusion displays a red slash through the page or asset icon and suppresses it from the site when published To re enable publishing for a suppressed page or asset repeat step 1 then clear Don t Publish and click OK Publishing Your Site When your publishing con guration settings are complete you are ready to publish your site 1 In Publish view click the Publish button on the control bar P U B L I S H I N G Y O U R S I T E Publishing Your Site 26 25 The Publish dialog appears 2 Use the Location drop down list to select a server pro le 3 To con rm or change the server pro le properties such as the directory name for local publishing or the target directory for remote publishing a Click Edit The Locations Properties dialog is displayed b Make necessary changes to the server pro le See De ning a Server Pro le for Local Publishing on page 26 10 or De ning a Server Pro le for Remote Publishing on page 26 13 for information c Click OK to close the Locations Properties dialog 4 To publish only the assets that changed since the last time you published select P
282. hic objects to this page just like any other page The key items to be added however are the data elds you de ned in the data object To design stacked pages 1 Switch to Site view or use the Site Navigation window in Page view to navigate to the rst stacked page If you are working with external data the stacked page navigation button bar indicates this is 1 of as many records as were imported from the external source If you are working with an internal data object the stacked page navigation button bar indicates this is 0 of 0 because you have not created any records yet Data Field tool 2 In Page view select the Data Field tool from the Advanced toolbar and draw a rectangle in the body of the stacked page Drawing a data eld 20 24 Data Publishing C R E A T I N G S T A C K E D P A G E S The Data Field dialog appears so you can choose which eld you want to display in the area you drew The elds available are those in the data object you selected in the Data Publishing dialog when you created the stacked pages 3 Select a eld and click OK G If you are using external data NetObjects Fusion displays simple text eld data from the rst record in the data le To import images see Importing Images from an External Data Source on page 20 17 G If you are using internal data and selected an image le eld the eld area is marked with an X Double click the X
283. his object Use all three methods as needed to create a scripted action Inserting a Script in a Scripted Action 1 In the Set Action dialog click the Scripted action option and then click Insert Script to display a File Open dialog 2 Use the dialog to navigate to and select the source le for your script Change the Files of type setting to All Files if necessary 3 Click OK to insert the contents of the selected le NetObjects Fusion inserts the script from the selected le This is particularly helpful if you are sharing scripts with other developers or if you are implementing a script that someone else developed Inserting an Existing Action 1 In the Set Action dialog click the Scripted action option and then click Insert Action C U S T O M I Z I N G A C T I O N S Building Dynamic Pages 21 23 The list of the Actions assigned to the current object appears 2 Select the Action you want to insert and click OK NetObjects Fusion inserts a call to the selected action in the form Actionn where n is the number of the action as it was created and places the statement in the text box Actions are numbered when you create them 3 Insert other scripts or actions as needed 4 Click OK when you nish scripting the action NetObjects Fusion adds the scripted action to the Action list box Scripting JavaScript Expressions You can script your own JavaScript expressions to use as para
284. ible pro le and display the one linked to the selected location Cascading messages make this manageable G Without cascading messages you d have to include 10 actions with each location button 9 actions to hide other location pro les Hide Pro le1 Hide Pro le2 and so forth and 1 action to display that location s pro le object 21 16 Building Dynamic Pages A D D I N G A C T I O N S T O O B J E C T S G Using cascading actions each location button sends one Hide all pro les message to the Layout That message is then forwarded by the Layout to each object within that Layout in effect the message cascades down the Layout s object tree In this case Hide all pro les is a custom message that is not provided with NetObjects Fusion see Creating Custom Messages on page 21 18 for more information Note that the Layout doesn t command its objects to hide It simply passes along the Hide all pro les message and any object that understands that message because it has an action of its own that is triggered by a Hide all pro les message acts on it The selected location button then sends one Show message to its corresponding location pro le and that pro le object displays itself The net result you assign 20 actions not 100 and when a new of ce location opens in Quebec all you add is one location button one pro le object and two actions instead of having to add the hide Quebec pro le
285. ich to play the movie select Play in new browser window 15 8 Placing Media I N S E R T I N G A Q U I C K T I M E M O V I E By default NetObjects Fusion represents the movie on the page with the QuickTime icon If you want to use a different icon you can click the Browse button and select another image le to represent the movie The name of the image le appears in the Launch from picture eld 7 Click the HTML button to insert HTML tags and scripts For information about HTML in NetObjects Fusion see Chapter 22 Working with HTML Directly 8 On the Controls tab set the sound volume for the movie You can enter a number from 0 to 256 9 In the Display options section select the options you want G If you don t want to show the movie but want to use it only as background sound select Hide all G To display a control bar that the site visitor can use to start or stop the movie select Controller This option is not available when Hide all is selected G To automatically start playing the movie when the page loads select Auto start G To replay the movie when it comes to the end select Loop You can replay the movie from the end to the beginning by selecting Back and forth I N S E R T I N G A V I D E O F I L E Placing Media 15 9 10 To store the movie in the cache on the site visitor s system select Keep movie in user s cache If the visitor leaves the page and comes back the movie d
286. if le use the Picture tool to place the le Note Because of the security features in certain browsers NetObjects Fusion cannot display a rotating picture in Preview You must publish the site locally or remotely to view rotating pictures To add pictures that rotate and set their properties Rotating Picture tool 1 In Page view select the Rotating Picture tool from the Component toolbar 2 Draw a box on the page to indicate where you want to place the picture A D D I N G R O T A T I N G P I C T U R E S Using NetObjects Fusion Components 18 17 A rotating picture placeholder appears on the page and the Rotating Picture Properties palette appears 3 To set the number of seconds each picture is displayed before moving to the next one double click the Pause Time Seconds row specify the number of seconds and click the check mark 4 To set how many different images to display in the rotating picture double click the Number of Images row specify the number of images and click the check mark You can display up to 50 images for your rotating pictures An Image row and URL for Image row for each image you speci ed appears 5 Double click an Image row select an image le from the Picture File Open dialog and click Open For information about placing images see Adding Pictures on page 10 3 6 To create a link for this image double click the image s URL for Image row then select the ty
287. igate to the site or page using your browser then cut and paste the URL from the browser The starting page of your site import does not have to be the source site s Home page usually named index htm or index html it can be any page of any accessible Web or intranet site 4 From the Assign MasterBorder drop down list select the MasterBorder you want to apply to the imported site or section NetObjects Fusion displays the list of MasterBorders available in the current site if there is no site currently open the MasterBorder Import is applied by default 5 Set the limits for the number of pages and number of levels you want to apply to the import process 6 If you are importing and converting a local site enter the domain name for the site s Home page in the Domain name eld If the local site was ever published on the Web use the domain name that was used to access it if not leave the placeholder www domain com in the eld When it imports a local site NetObjects Fusion needs to know the home base domain of that site so it can tell whether to convert the links it nds into external or internal links It does that by comparing the targeted domain if there is one to the domain name you entered 7 If you are importing and converting a remote site make sure your system is connected to the Internet or intranet so NetObjects Fusion can link to and import the site 8 Click OK NetObjects Fusion imports
288. ign and lay out your page G The Layout is the body of the page surrounded on all four sides by the MasterBorder Each page has at least one Layout although you can create additional layouts as needed G Text boxes are a special class of objects because you can embed other objects within them You can also maximize a text box so it lls the entire Layout in effect using a single text box to lay out the entire page G Layout Regions are mini layouts that you can use to subdivide the page You can draw and place Layout Regions anywhere on the page and place any kind of objects including text boxes or other Layout Regions within their borders G Tables serve as containers for objects If your page design calls for a tabular design you can create a table to ll the page and lay out your content within the cells of the table Each cell of a table is a text box so you can embed any other objects in the cell Note If your page design requires hand coded HTML pages you can incorporate them as is into your NetObjects Fusion page by referencing them See Referencing HTML from Page View on page 19 4 for information N To embed an object in a container select it and drag it over the container into which you want to embed it The object automatically drops into the container For details see Chapter 7 Laying Out the Page 4 12 Page View Basics C R E A T I N G O V E R L A P P I N G O B J E C T S Creating Overla
289. image only the rst frame of the animation displays on the image G Text labels for buttons and banners are placed on top of images If you want the label to appear below the image leave space above or below the image when you create it in your image editing application C R E A T I N G A S I T E S T Y L E Using SiteStyles 12 13 G If you plan to use your SiteStyle on a page with a background color or image and you want the background to show through your image use your image editing application to set transparency in your image You can check the NetObjects Web site at www netobjects com for more guidelines on creating SiteStyles To create your own SiteStyle 1 Create or collect images for your banner buttons lines icons and background Use an image creation application to create the images To be included in a published site they must be in gif or jpeg format If you use an image in bmp pcx pct png or psd format a message asks you if you want to convert the image to gif or jpg format If you choose to convert NetObjects Fusion converts a copy of the image for you 2 In Style view on the control bar click the New button or choose New Style from the Style menu The New Style dialog appears 3 Enter a name for your new SiteStyle and click OK NetObjects Fusion displays rectangular placeholders to indicate where you click to de ne the graphic images It also displays the default text colors
290. indicates the moved page will be a child A triangle on the side of the target page icon shows that the moved page will be a sibling A triangle on the bottom of the target page icon shows that the moved page will be a child 2 14 Creating and Managing Sites R E N A M I N G P A G E S If the moved page will be the child of a page that already has children the moved page becomes a sibling of those children In that case the outline and triangle appear on the target sibling page Renaming Pages You can rename a page to suggest its contents By default NetObjects Fusion uses the page name on banners and navigation buttons that identify the page When you publish your site NetObjects Fusion uses the page name as the HTML le name for the page It also uses the page name when it creates links to the page NetObjects Fusion converts spaces and non alphanumeric characters except periods and hyphens in the page name to underscores _ in the HTML le name To change this default see De ning Server Pro les on page 26 10 If you give two pages the same name NetObjects Fusion adds a numeral to the le name when it creates the HTML les for the second and any additional pages For example if you have two pages named Great NetObjects Fusion creates great html and great1 html You can change the name directly on the page icon or in the Name eld on the Page tab of the Properties palette To rename a page on
291. ing Targeted Links 23 9 Adding Content for Frameless Browsers 23 10 24 Working with AutoFrames Targeting Links in AutoFrames 24 2 Targeting Speci c Links 24 3 Targeting the Full Browser Window 24 8 Targeting a New Browser Window 24 9 AutoFrames and Browser Refresh 24 10 Adding Content for Frameless Browsers 24 10 Adding Other Scripts to AutoFrames 24 13 25 Managing Assets Working in Assets View 25 2 Managing File Assets 25 3 Adding File Assets 25 4 Editing Asset Names and Locations 25 5 Displaying Pages Containing File Assets 25 6 Replacing File Assets 25 6 Deleting File Assets 25 7 Deleting All Unused File Assets
292. ing individual paragraphs and words and specifying paragraph alignment font font size and font style and effect G Embed objects in a table cell See Embedding Objects in a Text Box on page 7 24 for information G Wrap text around objects See Wrapping Text around Objects on page 8 13 for information G Create a form See Chapter 17 Designing and Implementing Forms for information The following is an example of a table with text and embedded objects A D D I N G A T A B L E Adding Tables 9 3 Adding a Table When you add a table to a page you place it specify the number of rows and columns and de ne its appearance Table tool 1 In Page view choose the Table tool from the Standard toolbar then draw a box where you want the table to appear on the page The Table dialog appears 2 Select the number of columns and rows you want then click OK The table appears on the page and NetObjects Fusion displays the Table Properties palette 3 In the Cell section of the General tab de ne the appearance of the table Specify G The size of the border surrounding the table G The padding the amount of space you want to leave between the contents of a table cell and the cell boundaries G The distance between cells 9 4 Adding Tables S E L E C T I N G A T A B L E 4 To modify the cell s background color click the Background tab then click Color select a color from the
293. ing its own content including links form objects regions or any text graphic or media objects you want The combination of frames that completes the browser window is called a frameset Frames can take on properties not available to standard MasterBorders 6 10 Managing MasterBorders and AutoFrames U S I N G A U T O F R A M E S G The scrolling properties of a frame are independent of other areas of the page If the site visitor scrolls the Layout the frame doesn t scroll with it This makes it possible among other things to keep navigation buttons in view at all times regardless of where the visitor is in the Layout Conversely you can make a frame scrollable so the site visitor can scroll the frame without affecting the Layout G You can specify whether the site visitor can resize the frame making it wider or narrower taller or shorter This enlarges the visible content area of the frame It has nothing to do with scrolling which brings another part of the frame into view G You can specify a background for the frame the current SiteStyle background a solid color or even a picture G You can de ne targets for the links contained in one frame so they retrieve content into another frame NetObjects Fusion supports two ways of creating frames G AutoFrames AutoFrames gives you a graphical interface to set frames and then to add navigation controls banners text graphics links and scroll bars This section
294. ing trigger events 21 7 spell check 8 18 SPL les 15 2 Splash les 15 2 setting properties 15 5 SQL data sources creating external data objects 20 14 20 17 stacked pages 20 22 20 26 Add navigation buttons option 20 21 adding for internal data 20 25 adding navigation buttons 20 25 adding pictures 20 26 adding text 20 26 de ned 20 3 deleting 20 26 designing 20 22 Display all elds option 20 21 image les and Assets view 25 4 using smart links 20 25 see also pages Standard toolbar 4 15 standard toolbar 1 5 starting a blank site 2 4 starting NetObjects Fusion 2 2 Status property pages 2 10 Status property sections 2 11 straight quotes 26 10 structural links see smart links 14 2 Structured Query Language SQL 20 14 style elements 12 3 Style view 1 4 12 2 example of 12 3 Styles Folder 1 19 sub buttons 18 4 Submit button 17 12 suppressing actions 21 26 suppressing page or asset properties 26 24 SWA les 15 2 SWF les 15 2 symbols inserting in text 8 13 T Tab character in text boxes 8 8 table cells adding objects 10 6 adding text 10 6 modifying properties 10 6 modifying text box properties 10 7 previewing 5 9 selecting 10 5 selecting text boxes 10 5 Table tool 10 3 tables adding 10 3 de ned 10 2 forms 17 3 inserting columns 10 8 inserting rows 10 7 modifying 10 6 modifying cell properties 10 6 modifying cell text box properties 10 7 removing columns 10 8 removing rows 10 8 resizing col
295. ion does not include it when the site is published clear that action s check box on the Actions tab A suppressed action can however be inserted in a scripted action 5 To change the properties of an action the name trigger target message parameters or cascade setting double click the action you want to modify The Set Action dialog appears with the current action con guration shown You can change any of these settings as needed C U S T O M I Z I N G A C T I O N C H O I C E S Building Dynamic Pages 21 27 Customizing Action Choices The Set Action dialog is dynamically built when NetObjects Fusion starts up based on the contents of the NetObjects Fusion jsb le located in the NetObjects Fusion 3 0 NetObjects System folder The NetObjects Fusion jsb le in turn is based on the JavaScript Beans speci cation If you are experienced in JavaScript programming you can edit this le to G Add delete or modify the choices available from the Set Action dialog G Change the default or potential values of parameters G Replace or supplement the jsb le with your own les 21 28 Building Dynamic Pages C U S T O M I Z I N G A C T I O N C H O I C E S C H A P T E R 2 2 Working with HTML Directly 22 1 Working with HTML Directly 22 In addition to adding content links and Dynamic Actions to your site using NetObjects Fusion s tools you can work directly with the code to insert HTML and s
296. is branch of the site is collapsed Click the plus sign to expand it Click the minus sign to collapse this branch of the site B A C K I N G U P Y O U R S I T E Creating and Managing Sites 2 21 Backing Up Your Site You can back up your site manually or automatically To make a manual backup 1 From the File menu choose Save Site As The Save Site As dialog appears 2 Type a descriptive le name for your backup le and select a location 3 Click Save NetObjects Fusion creates a copy of your nod le in the location you speci ed and automatically opens that le Note The backup you make with the Save Site As command does not collect all assets and make all links relative Your backup will still refer to assets and components in the original site le folder To make a backup with assets and relative links export your site le as a template as described in Chapter 3 Importing and Exporting For information on automatic site le backups see Setting Preferences on page 1 12 Type your backup le s name here Select a location for your backup le The User Sites folder is the default 2 22 Creating and Managing Sites B A C K I N G U P Y O U R S I T E C H A P T E R 3 Importing and Exporting 3 1 Importing and Exporting 3 NetObjects Fusion offers several ways for you to create or expand the structure and content of your site You can create new sites from templ
297. ish pages 2 11 Publish Don t Publish sections 2 11 site 2 17 Site view 2 17 Status pages 2 10 Status sections 2 11 text boxes 8 5 Properties palette 1 5 4 2 MasterBorders 6 4 Site tab 2 17 Properties palettes font size 1 13 Protected Director les 15 2 publication properties customized 26 23 publication forcing 25 4 Publish Setting HTML output option 7 8 Publish view 1 4 26 3 Publish Don t Publish property pages 2 11 Publish Don t Publish property sections 2 11 publishing aliased folders 26 17 26 20 26 22 asset type directory structure 26 4 base directory 26 29 CGI directory 26 18 compared to previewing 26 1 con guring setup 26 4 creating custom folders 26 21 CSS and Layers 5 5 customizing directory structure 26 21 26 24 data see data publishing deleting folders 26 22 directory structure setting 26 4 26 7 external HTML 19 11 rewalls 26 27 at directory structure 26 4 guidelines 26 26 HTML comments 26 9 HTML output types 26 7 HTML output setting 26 7 26 10 JScript 5 5 nested tables 5 4 overlapping objects 26 8 overview 26 2 properties suppressing page asset 26 24 properties viewing setting 26 23 proxy servers 26 27 quotation marks selecting 26 10 read only folders pages assets 26 23 Index 12 rearranging directory structure 26 22 regular tables 5 5 remote host 26 29 remote server access checklist 26 29 26 31 renaming custom les 26 21 renaming custom folders 26
298. isplay pages published in Nested Tables format G Regular Tables uses basic HTML table tagging to deliver your design and content Both Microsoft Internet Explorer 2 x and above and Netscape Navigator 2 x and above correctly display pages published in Regular Tables format although site visitors results might vary according to their system and browser font settings 26 8 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P Note If you select either form of table based output be sure your pages do not have overlapping objects or your published results will not be what you expected See Interpreting the Warning Icon on page 4 19 for information G CSS and Layers uses Cascading Style Sheet Positioning code layers and scripts to position and publish your layout and content Both Microsoft Internet Explorer 4 x and Netscape Communicator 4 x correctly display pages published in CSS and Layers format although the site visitors results might vary according to their system and browser font settings On the HTML Output tab of the Publish Con gure dialog you designate which type of HTML output NetObjects Fusion generates This setting determines the site preference for HTML output You can override this site preference for individual Layouts and Layout Regions so NetObjects Fusion generates their HTML using a different method See Setting the Layout s HTML Output Method on page 7 8 and Setting the Layout R
299. ite only and are saved with the site 1 From the Edit menu choose Preferences The Preferences dialog appears 2 Set the preferences on the General tab S E T T I N G P R E F E R E N C E S NetObjects Fusion Basics 1 13 G Auto Save When this option is selected your site is saved each time you change views or pages If you clear the Auto Save check box be sure to save your site periodically by choosing Save Site from the File menu G Application window maximized at startup If you clear the check box for this option the NetObjects Fusion window opens in the last size you set rather than full screen size G Open to most recently used le at startup If you select this option when you start NetObjects Fusion the last site you worked on opens automatically displayed in the last view you worked in G Use Small Fonts in Properties Palette If you clear this check box you see larger properties palettes in Page view To maximize the area available for your page Layout leave this option selected G Preview Choose the Web browser you want to use for previewing sites by selecting it from the Browser drop down list If you have more than one version of a browser installed when you select Preview NetObjects Fusion launches the version that was most recently opened To use other versions you must launch them manually from the Windows Start menu For example suppose you have both Netscape Navigator 3 0 and 4 0 ins
300. iting elds G Checking spelling G Finding and replacing text G Counting words lines paragraphs and characters 8 2 Designing with Text W O R K I N G W I T H T E X T B O X E S Working with Text Boxes In NetObjects Fusion a text box is a container into which you can add text and embed other types of objects How you select a text box determines what you can do with it To select a text box for text editing Text and Selection tools N Choose the Text tool from the Standard toolbar then double click in the text box Or using the Selection tool either select the text box and press Enter or double click in the text box To select a text box as an object N Using the Selection tool click inside the text box Working with a Text Box as a Text Editor When a text box is a text editor the handles around the text box are hollow and NetObjects Fusion displays the Format tab as well as the Text Box and Actions tabs on the Text Properties palette Hollow handle W O R K I N G W I T H T E X T B O X E S Designing with Text 8 3 When a text box is a text editor you can G Add edit and format text G Add edit and format paragraphs including creating simple and multi level bulleted and numbered lists G Change the appearance of text by selecting font font size and font style and assigning a color to the text G Create text styles so you can replicate and update paragraph formatting easily G Ins
301. its arrow on the ruler and drag it G To delete a guide click its arrow and drag it off the ruler Showing and Hiding Rulers Guides and Grids Grids rulers and moveable guides help you place and align objects in the MasterBorder and Layout areas Guides associated with a MasterBorder appear on all pages that use that MasterBorder You can set the size of the grid in the Preferences dialog as described on page 12 To show and hide rulers guides and grids in Page view do one of the following N Select Rulers amp Guides from the View menu to show and hide rulers and guides N Select Grids from the View menu to show and hide grids Moving Between Pages In Page View You can easily move between pages in Page view using the page navigation buttons the Site Navigation window or the Go To command on the Go menu For information about the Go To command see Using the Go Menu on page 1 8 The Page Navigation buttons and button for displaying the Site Navigation window are at the bottom of the NetObjects Fusion window Parent page button Previous page button Next page button Child page button Site Navigation window button 4 6 Page View Basics I M P O R T I N G H T M L P A G E S Using Page Navigation Buttons To move between pages using the page navigation buttons do one of the following N On a child page click the Parent page button to display its parent page N On a parent page click the Child p
302. ixture of different shades to approximate a color An image without dithering in the background works best Note Transparency only works with gifs You cannot set a transparency for a jpeg or other image le format To create a transparent gif 1 In Page view select the picture for which you want to create a transparent gif The Picture Properties palette appears 2 Select the Effects tab M O D I F Y I N G A P I C T U R E Placing Pictures 10 11 3 Click the Transparency dropper then click the color in the picture that you want to make transparent The Use Color check box is selected and NetObjects Fusion displays the color you selected in the box next to it 4 To make a transparent color opaque clear the Use Color check box Moving or Copying Pictures You can move or copy pictures from layout to layout in Page view using the Cut Copy and Paste commands on the Edit menu or by using the shortcut menu You can also copy a picture by holding down Ctrl while you drag To move or copy a picture onto a different layout 1 In Page view select the picture you want to move or copy 2 From the Edit menu choose Cut or Copy 3 Locate the target layout The target layout can be on another page or it can be a different layout on the same page 4 From the Edit menu choose Paste NetObjects Fusion pastes the picture into the new layout 5 Reposition the picture as necessary Transparenc
303. ize and alignment The text you add becomes part of a new image le when the page containing the shape is published Because the text is part of the image your site visitor s browser can display it even if the font you chose is not installed 11 4 Drawing Shapes and Lines D R A W I N G S H A P E S To add text to a shape 1 In Page view select the shape to which you want to add text The shape s Properties palette appears 2 On the General tab under Text in element select Enable and click Settings The Text in Element Settings dialog appears 3 Replace the highlighted text with the text you want to add D R A W I N G S H A P E S Drawing Shapes and Lines 11 5 4 Click the Set button for fonts to open the Font dialog 5 Select the font its style and size and click OK 6 In the Text in Element Settings box click the Set button for colors 7 In the Color Picker select the color you want to apply to the text and click OK See Choosing Colors on page 1 9 for information 8 In the Text in Element Settings dialog select the Relative Alignment Horizontal Position and Vertical Position for the text The Relative Alignment left aligns centers or right aligns two or more lines of text It has no effect on single lines of text The Horizontal Position and Vertical Position settings place the text block within the shape s rectangular frame For example if you set the Relative
304. justing the Size of the Layout and MasterBorder Areas 4 3 Forcing Objects to Snap to Grids Guides and Each Other 4 4 Adding Moving and Deleting Guides 4 4 Showing and Hiding Rulers Guides and Grids 4 5 Moving Between Pages In Page View 4 5 Using Page Navigation Buttons 4 6 Using the Site Navigation Window 4 6 Importing HTML Pages 4 6 Placing Objects 4 7 Dragging and Dropping Objects 4 8 Selecting Objects 4 9 Zooming In and Out 4 9 Moving and Copying Objects 4 9 Editing Objects 4 10 Adding and Modifying Alt Tags 4 10 Embedding Objects in Containers 4 11 Creating Overlapping Objects
305. keeps text together in a horizontal orientation when text size changes rearrange the page In addition to selecting the formatting priority that best supports your design you can also make your pages more ef cient and more predictable by optimizing the placement of objects particularly text objects within the site s underlying table structure There s no xed standard but as a general rule it s best to align objects to The page with a Columns setting in Page view at left adjusts vertically to changes in browser text size as shown at right The page with a Rows setting in Page view at left adjusts horizontally to changes in browser text size as shown at right C H A P T E R 5 Planning Your Site 5 9 each other and to isolate text boxes in their own cells within the underlying table structure so they can resize themselves as necessary in response to browser font changes To help you determine the best alignment you can preview the underlying table row and column structure to see if NetObjects Fusion can divide your Layout into cells ef ciently or if you need to rearrange some objects To preview NetObjects Fusion s arrangement of underlying table cells on your page and set your table alignment setting 1 In Page view select the Layout or Layout Region you want to preview The General tab of the appropriate Properties palette appears By staggering the text boxes and image objects as shown in the diagram
306. l in a multi level numbered list G This an example of the rst level in a multi level numbered list C R E A T I N G A N D M O D I F Y I N G T E X T S T Y L E S Designing with Text 8 9 To create a multi leveled numbered or bulleted list 1 In Page view double click in the text box then type the text you want to include in the list Make each item in the list a separate paragraph 2 Click in the rst paragraph of the list then select a list type from the Bullet drop down list If you select a numbered list and want to start the list with a value other than 1 or A click Start Value and enter a number in the Start Value of Numbered List dialog Then click OK 3 If you want this paragraph to be indented click the right indent arrow 4 Select the paragraph or paragraphs you want to make subordinate to the one you selected in the previous step 5 Use the right indent arrow to indent the subordinate paragraph so it is to the right of the superior paragraph Then select a list type from the Bullet drop down list 6 Select the next paragraph you want to be a superior paragraph Indent it to the same level as the paragraph you formatted in step 2 The paragraph adapts the list style you selected in step 2 to the current paragraph If you selected a numbered list style the paragraph is numbered sequentially For example if you selected a roman numeral list style starting at 1 in step 2 the current paragraph is numbere
307. l of the dialog displays your code as it will appear in the HTML NetObjects Fusion generates 7 Click OK in the Object HTML dialog 8 Click Link in the Link dialog When you preview or publish the site the link opens in a new browser window Creating an Imagemap An imagemap contains several links in a single picture You create an imagemap by drawing hotspots on a picture You can link as many hotspots as you like in a single image but the hotspots cannot overlap or extend beyond the edge of the picture Because the imagemaps you create with the following procedure do not require a CGI script running on the server they are called client side imagemaps Server side imagemaps require setup on a Web server to run properly To create a client side imagemap 1 In Page view select a picture Hotspot tool 2 Press the Hotspot tool in the Standard toolbar and select the appropriate tool to create a rectangular circular or polygon hotspot 3 Draw a hotspot on the image If you are using the Polygon Hotspot tool you must click to establish each vertex of the polygon then double click to complete the hotspot shape The Link dialog appears 4 In the Link dialog select the type of link by clicking a tab 5 Select a destination for the link or type a URL For more information about creating links refer to one of the following sections G For information about internal links see Creating an Internal Link
308. ld the JavaScript expression you want to use to determine the value of this parameter 6 If you want to build your expression around or with existing actions click the Insert Action button NetObjects Fusion displays a list of actions you already de ned for this object Select the action you want to insert and click OK Note Expressions must be written in valid JavaScript NetObjects Fusion does not perform any error or syntax checking of your expression 7 When the expression is completed click OK The parameter is set to the value generated by the expression and the Set Action dialog appears 8 Repeat steps 1 through 4 for other parameter values you want to set to expressions 21 26 Building Dynamic Pages M O D I F Y I N G E X I S T I N G A C T I O N S Modifying Existing Actions 1 In Page view select the object that has the action you want to modify The default tab of the object s Properties palette appears 2 Select the Actions tab The actions you added to this object are listed 3 To change the sequence of actions for this object a Select an action that s out of sequence b Press the up or down arrows in the bottom right corner to move the selected action c Repeat as needed Actions are launched by their trigger events or messages If two or more actions share the same trigger action they are run in the order in which they appear 4 To suppress an action so NetObjects Fus
309. le 1 Double click the variable in Assets Variables view The Edit Variable dialog appears 2 Edit the name and value of the variable and click OK If you edit the value of the variable NetObjects Fusion updates all text blocks containing that variable with the new value 25 14 Managing Assets M A N A G I N G V A R I A B L E S Deleting a Variable 1 In Assets Variables view select the variable you want to delete 2 From the Edit menu choose Delete User De ned Variable or press Delete 3 Click Yes to con rm the deletion Note You cannot undo this operation You must use the New Variable command to recreate the variable Do not delete a variable that is in use If you do it will be replaced with Unde ned User variable variable name in the text where it was used C H A P T E R 2 6 Publishing Your Site 26 1 Publishing Your Site 26 When you complete your site design and development you re ready to publish the results as a collection of HTML pages and associated assets Publishing is similar to previewing your site with one major difference G When you preview your site NetObjects Fusion automatically generates and stores your site in the Sitename Preview folder and creates absolute paths to your site s assets G When you publish you can control the location of your published site directing NetObjects Fusion to store your site on a local disk or a remote server This chapter tells you ab
310. lick Replace to replace it or click Replace All to replace all instances of the found text with the replacement text Counting Words Lines and Paragraphs N To get a word count for the current page in Page view choose Word Count from the Edit menu N To get a word count for a section of text highlight the text then choose Word Count from the Edit menu The Page Word Count dialog appears displaying a list of word line paragraph and character counts If your text box includes embedded objects the line count is incremented for each embedded object C H A P T E R 9 Adding Tables 9 1 Adding Tables 9 When you want to add a table to a page place the table de ne its appearance then add text in table cells which are text boxes You can embed objects in table cells as you would in text boxes This chapter includes information about G Adding tables to your pages G Selecting a table a table cell and a text box in a table cell G Adding text and pictures to tables G Modifying a table s appearance 9 2 Adding Tables W O R K I N G W I T H T A B L E S Working with Tables Presenting information in tabular form is often an effective way to convey complex concepts and ideas NetObjects Fusion makes it easy to add tables to a site Table cells are text boxes in which you can add text and embed objects In table cells you can G Add text by typing or pasting it G Format text using text styles or by select
311. lick the Field button to insert a eld For more information on elds see Managing Variables on page 25 12 4 Click OK To add HTML or script before the object s HTML tag To add code inside the object s tag To insert a closing HTML tag for any opening tag you inserted before the object Type or paste your HTML or script in the white part of the dialog Click to insert contents of an HTML script or other text le Click to insert a eld See the object s HTML and preview your code as you type 22 8 Working with HTML Directly E X A M P L E S O F O B J E C T H T M L HTML icon Preview the site to test your code and view the source from your browser to see the resulting HTML To edit your code open the Object HTML dialog again click the tab where you entered code and make your changes Examples of Object HTML Displaying a Message on Mouse Click You can display a message when site visitors click an image or text link One way to do this is by creating a Blank link and inserting an onClick JavaScript in the link s opening lt A HREF gt tag 1 In Page view select the image or exact text site visitors are to click and click the Link button on the Properties palette The Link dialog appears 2 Click the Smart Link tab and select a Blank link See Creating a Smart Link on page 14 7 for information 3 Click the HTML button in the Link dialog The Object HTML dial
312. lor you plan to use for ordinary text By assigning visited links a different color than that of the regular links you let site visitors know at a glance that they have visited the link 12 12 Using SiteStyles C R E A T I N G A S I T E S T Y L E If color consistency is more important than this detail assign identical colors to regular and visited links To edit a text color 1 In Style view select the style you want to change and double click the text label you want to change G Double click the words Normal Text Color to change the default color for text in the site G Double click the words Regular Link Color to change the color for links in the site G Double click the words Visited Link Color to change the color for visited links in the site The Color Picker appears See Choosing Colors on page 1 9 for information on choosing colors 2 Select a color and click OK Creating a SiteStyle You can create original styles to give your site a unique look Simply collect or create image les for your banner buttons line icon and background and select them in Style view When you create a new SiteStyle each element is saved into its own subfolder in the style s folder inside the NetObjects Fusion 3 0 Styles folder See Styles Folder Structure on page 12 16 for information on style folders When you create your own SiteStyle keep these points in mind G When you use an animated gif for a style
313. lors boxes 2 Click the color you want to assign to the object The Original and New boxes show the original color and the color you just selected The RGB and HTML hexadecimal values are also displayed If you are not using the Browser Safe Palette you might see a warning that the selected color is not Web safe To avoid unexpected results for your site visitors it is best to choose colors that are Web safe 3 Click OK The new color appears in the selected object Using Color Palettes When you choose colors for the objects in your site you select from the palette offered in the Color Picker You can use the Browser Safe Palette which contains colors that are Web safe the palette used by Windows a palette you import from another application such as Adobe Photoshop or a custom palette you create U S I N G C O L O R P A L E T T E S NetObjects Fusion Basics 1 11 Choosing a Color Palette 1 Click the Color button in any properties palette where it is offered The Color Picker appears 2 Select a palette from the drop down list at the top of the dialog If you choose Custom Palette and want to load an existing custom palette see Loading a Custom Color Palette If you want to create your own custom palette see Creating or Editing a Color Palette The palette is displayed in the Color Picker until you change it 3 Click OK Loading a Custom Color Palette 1 Click the Color button in any prop
314. lt target frame 1 In Page view open the content page to be targeted 2 Click the Layout The General tab of the Layout Properties palette appears 3 Click the HTML button The Between Head Tags tab of the Page HTML dialog appears 4 In the text eld on that tab enter lt base target framename gt using the actual name of your target frame For example you might use the following HTML for the source le for a navigation frame 5 Click OK 6 Add or select several objects in the Layout of this page and link them to appropriate pages or resources S C R I P T I N G A N D T A R G E T I N G L I N K S Creating Custom HTML Framesets and Frames 23 9 7 Preview or publish your site and view the frameset page Then test the default links All retrieved resources should be displayed in the targeted frame Scripting Targeted Links You can also de ne a speci c target frame for each individual link As noted previously these targets can be another frame in the current frameset a full browser window with no frames or an additional browser instance 1 In Page view select an object or text to link 2 In the Properties palette for that object click Link The Link dialog appears 3 Select the tab for the type of link you want and select the page resource or anchor you are linking to 4 Click the HTML button to display the Object HTML dialog 5 Select the Inside Tag tab and enter th
315. me extension does your server support Web page servers typically support html htm or shtml as le name extensions Some service providers map one to the other so the server recognizes all of them others require you to use a speci c one You must set the Location Properties dialog so NetObjects Fusion publishes les with the correct extension You can also enter a custom extension if your server supports it My server s preferred or required extension __________________ R E M O T E S E R V E R A C C E S S C H E C K L I S T Publishing Your Site 26 31 7 Is a speci c port required for upload The service provider might have designated a speci c port on the server that it wants you to use to upload les If so you must specify this for NetObjects Fusion See Creating Aliased Folders and Setting the CGI Bin Directory on page 26 17 for information about setting a custom port address My server s custom port number __________________ 8 Does your log in account have the necessary permissions Servers use permission con gurations to control what users are allowed to do while logged on whether they can delete les for example or create new directories In Publish view you can specify the server le and directory structure that you want NetObjects Fusion to create or use for your site Your log in account which NetObjects Fusion uses to store the les must have the server permissions necessary to
316. message to all other of ce locations Con guring Cascading Actions 1 In Page view create the objects that you want to act upon and embed them in the container of your choice 2 Add the object that will trigger the action The default Properties palette for the trigger object appears Add Action button 3 Select the Actions tab and click the Add Action button to add a new Action and name the action if appropriate 4 In the Target Object Tree select the container Layout MasterBorder Layout Region or text box in which you embedded the objects in step 1 This is the container you want to target for the cascaded action 5 Select the Cascade action option 6 Complete the action con guration as needed and click OK 7 Preview or publish the site locally and test the cascading effect A S S I G N I N G A N A C T I O N T O A T E X T L I N K Building Dynamic Pages 21 17 Assigning an Action to a Text Link 1 In Page view select text you want to link 2 On the Format tab of the Properties palette click Link The Link dialog appears 3 Select a link in one of the four link tabs If you want the link to launch the action but you don t want the link to display a new page in the browser choose the Blank link on the Smart Link tab 4 Click the Actions button The Actions dialog appears 5 Click the Add Action button and add an action as described in Adding Actions to Objects
317. meter values for any action These JavaScript expressions can return individual values for speci c 21 24 Building Dynamic Pages C U S T O M I Z I N G A C T I O N S parameters They can return objects with multiple values They can obtain values from form objects and forward them as message parameters You can enter JavaScript expressions directly or you can assemble an expression out of existing actions for that object For example you could de ne an expression that tests for a particular server condition such as time of day and then launches speci c actions that you de ned using the Set Actions dialog based on that condition For more information about JavaScript and scripting expressions consult the resources at http www developer com directories pages dir javascript html C U S T O M I Z I N G A C T I O N S Building Dynamic Pages 21 25 To script an expression for the value of a message parameter 1 In Page view select the object and add any actions that you want to use as components of the scripted expression See Adding Actions to Objects on page 21 5 for speci c steps 2 In the Action list box select the action whose parameter value you want to set to the expression and click OK 3 In the Set Action dialog set the other values of the action as appropriate 4 Select Expression from the Parameter drop down list The JavaScript Expression edit dialog appears 5 Enter in the text e
318. ministrator or ISP 1 In Page view click anywhere in the form except on a form object 2 On the Properties palette click the Settings button For a text box form look for the Settings button on the Text Box tab For other forms look on the General tab The Form Settings dialog appears 3 Add names and values for each hidden eld in the bottom of the dialog G To add a eld click the plus button then enter a name and value for the eld in the Enter Value dialog G To remove a eld select it and click the minus button G To reorder elds in the list and de ne their order in the submitted data select a eld and click the up or down arrow 17 20 Designing and Implementing Forms A D D I N G H I D D E N F I E L D S 4 Click OK Note If you re using the Form Handler component to process a form don t enter hidden elds yourself The Form Handler enters the elds it needs for you C H A P T E R 1 8 Using NetObjects Fusion Components 18 1 Using NetObjects Fusion Components 18 NetObjects Fusion Components are pre built mini applications that add sophisticated interactivity to your site with no custom programming or scripting required on your part For example you can use the Site Mapper component to add a button that site visitors can click to display a full navigational map of the site NetObjects Fusion includes nine pre built components and one tool for adding new compo
319. movie and add the movie to your page Then in Assets view add the Shockwave audio le as a le asset The NetObjects Fusion 3 0 Samples Content Shockwave Movies folder contains some ready to use Shockwave les Any Shockwave les you embed appear inline on the page itself When you insert a Shockwave or Director le Page view displays the Macromedia Shockwave placeholder Sound tool Video tool QuickTime tool Shockwave tool Plug in tool I N S E R T I N G S H O C K W A V E F I L E S Placing Media 15 3 To get WYSIWYG height and width parameters for Macromedia Director movies you must have the Macromedia Director ActiveX control version 6 0 1 or later or the Macromedia Director Netscape plugin version 6 0 1 or later installed on your system If you have an earlier version of the ActiveX control installed you must update it for this feature to work To obtain the ActiveX control create a site with NetObjects Fusion that contains a Director movie then preview the site with Microsoft Internet Explorer The ActiveX control is automatically downloaded and installed If you don t have Internet Explorer you can download the current Macromedia Director plugin at www macromedia com shockwave download To insert a Shockwave le Shockwave tool 1 In Page view select the Shockwave tool from the Media yout on the Advanced toolbar 2 Draw a box to indicate the le s location The WYSIWYG feature in Ne
320. mple 3 Type an alt tag in the AltTag eld See Adding and Modifying Alt Tags on page 4 10 for information Extra handle to modify curve D R A W I N G S H A P E S Drawing Shapes and Lines 11 3 4 In the Line width box set the shape outline thickness To make the outline invisible set it to zero 5 In the Color section of the Properties palette click the Color button for Fill 6 In the Color Picker choose the color you want to use for the shape ll color and click OK See Choosing Colors on page 1 9 for information 7 Click the Color button for Line select the color you want to assign to the shape border in the Color Picker and click OK 8 To adjust the shape or size of the drawing drag its handles G To change the shape proportionally drag a handle while holding down Ctrl G To vary the curve of a rounded rectangle select it place the pointer over the inside corner handle until it changes to a four headed arrow then drag toward the inside or outside until you have the desired curve G To edit the lines of a polygon select it place the pointer over any handle until you see the four headed arrow then drag the handle to adjust the shape G To create hotspots see Creating an Imagemap on page 14 13 When you publish a page with shapes NetObjects Fusion generates each shape as a gif le Adding Text to a Shape You can add text to a shape and format its font s
321. n Assets view select the le you want to delete and choose Delete File Asset from the Edit menu or press Delete Click Yes to con rm the deletion If the asset is in use you must rst delete all occurrences of the le throughout the site To delete a le asset that is in use 1 In Assets view double click the asset you want to delete 2 In the File dialog select a page containing the asset and click Go To NetObjects Fusion switches to Page view displaying the page that contains the asset you want to delete 3 In Page view select and delete the asset 4 Repeat steps 1 3 until the object is deleted from all pages 5 Return to Assets view and select the le you want to delete 6 Choose Delete File Asset from the Edit menu or press Delete Click Yes to con rm the deletion Note You cannot undo this operation You must use the New File Asset command to recreate the le asset 25 8 Managing Assets M A N A G I N G F I L E A S S E T S Deleting All Unused File Assets 1 In Assets view from the Assets menu choose Delete All Unused File Assets 2 Click Yes to con rm the deletion NetObjects Fusion removes all le assets for which the In Use indicator is not Yes Note You cannot undo this operation You must use the New File Asset command to recreate le assets Verifying File Assets To determine whether all le assets are in their expected directories 1 In Assets view
322. n Java applets and can play on Sun Microsystems and NeXT systems 15 12 Placing Media I N S E R T I N G A S O U N D F I L E G RealAudio ra ram can play streaming audio on all systems requires RealAudio Web server resident software and sometimes includes video Site visitors must install the RealAudio player browser plugin G Rich Music Format rmf is a sound le format that enhances the use of music and sound in interactive environments such as the Web You can also add any of these formats as a background sound that plays when a visitor views your page For more information see Setting Layout Background Properties on page 7 11 Because an audio le has no visual object NetObjects Fusion represents the audio le with a graphic usually an icon or an inline player control bar the browser recognizes When a site visitor clicks the icon or the play button on the inline player control bar the browser either plays the sound le or opens a helper application to play it To insert a sound le Sound tool 1 In Page view select the Sound tool from the Media yout on the Advanced toolbar 2 Draw a box on the page to indicate the location of the sound le The Open dialog appears 3 Select a sound le from your hard disk CD ROM or LAN 4 Click Open I N S E R T I N G A S O U N D F I L E Placing Media 15 13 The default sound icon appears on the page and the Sound Properties pal
323. n page 17 2 Combo Box tool 1 In Page view select the Forms Combo Box tool from the Form toolbar 2 Draw a rectangle on the form 3 On the Forms Combo Box Properties palette de ne the type of list its options and names that are passed to the script processing the form G Name Type the argument for this combo box that s passed to the script processing the form Ask your Web administrator or ISP if you re not sure what s required here If you re using the Form Handler use a number indicating the combo box s order in the output text G Type Select whether you want a drop down list that displays one item at a time or a list box that can display several items in a scrolling list G Visible Height For a list box enter a number de ning the list s height in lines G Allow Multiple Selections For a list box select this option if you want site visitors to be able to select more than one item in the list Argument passed to the script for the combo box Names and values passed for each item in the list 17 12 Designing and Implementing Forms A D D I N G O B J E C T S T O A F O R M 4 For each item in the list click the plus button and in the Enter Values dialog type a name and the value passed to the script for the item G Name Type the name passed for this item which is also the name that appears in the list G Value Type the value passed if the item is selected G Selected
324. n site les among multiple authors or across operating platforms You cannot simply copy a Sitename nod le created by NetObjects Fusion to another computer and open it because the Sitename nod le refers to les and styles that are not contained in the Sitename nod le itself Note If most of your sites involve the efforts of three or more developers using NetObjects Fusion you should consider NetObjects TeamFusion which uses client server technology to manage integrate and safeguard the contributions of each team member See www netobjects com for more information To distribute or move a NetObjects Fusion site 1 Export the site as a template according to the information in Creating a Template on page 3 17 2 Copy the new template folder to the target computer via network diskette or other storage media Make sure the folder and le names are not truncated or changed in the process 3 Start NetObjects Fusion on the destination computer 4 From the File menu choose New Site From Template The New Site dialog appears 5 Navigate to and open the template s folder and select the TemplateName nft le 6 Enter a name for the new site in the Site Name eld and click OK The site that was created in NetObjects Fusion on the source computer is now the active site with its own Sitename nod le on the destination computer 3 22 Importing and Exporting E X P O R T I N G A S I T E C
325. n your data object The following illustration shows the relationship of these objects for internal and external databases 20 4 Data Publishing S T O R I N G D A T A W I T H N E T O B J E C T S F U S I O N For example you could publish a backpack catalog on your site with a record for each backpack Each row in the data list lets the site visitor navigate to the stacked page that describes the corresponding backpack with a description photo and price To create your backpack catalog your rst step is to create a backpack data object You can de ne a data object once and use it in different ltered data lists For example you can create one data list of all the backpacks in your database With the same data object you can create additional data lists of internal frame backpacks external frame backpacks frameless backpacks and so on If you create a data object from an external source for example from a Microsoft Access database and then update or change the external source you must use Assets view to update the data in your site For example suppose your backpack data object references 50 records originally and the external database is increased Data object with internal data source Data object with external data source P U B L I S H I N G D A T A Data Publishing 20 5 with 25 new records After you update your site the data object references 75 records the backpack data list contains 75 rows and there are
326. nal HTML tool Use the External HTML tool to reference an external HTML page See Chapter 19 Referencing and Editing External HTML for information Using the Components Toolbar The Components toolbar contains tools you use to add components such as a Ticker Tape or Message Board to your pages DynaButton tool Dynabuttons are buttons site visitors use to navigate to links including pages or sites See Adding DynaButtons on page 18 2 for information Ticker Tape tool Ticker Tape adds a scrolling LED message to your site See Using Ticker Tape on page 18 5 for information Site Mapper tool Site Mapper helps site visitors create a site map See Adding a Site Map Button on page 18 6 for information Message Board tool Message Board provides visitors with a means to post read and reply to messages See Adding a Message Board on page 18 8 for information Form Handler tool Use the Form Handler tool to add a Submit button to forms See Submitting Responses as Plain Text on page 17 14 for information Picture Rollover tool Picture Rollover displays different images when a site visitor moves the mouse pointer over an image See Loading Pictures onto Your Site on page 18 15 for information 4 18 Page View Basics U S I N G T H E F O R M T O O L B A R Time Based Picture tool Time Based Picture displays an image for a speci ed period of time See Adding Time Based Pictur
327. name with no margins See Creating a New MasterBorder on page 6 6 for information 3 Select an existing text box or create a new text box using the Text tool from the Standard toolbar 4 Embed all objects on the Layout into the text box 5 On the Text Box tab of the Text Properties palette select both Size to Layout and Contents wrap to browser width When you publish this page NetObjects Fusion generates HTML that makes the contents of the text box adjust to the size of the browser window Embedding Objects in a Text Box There are three ways to embed objects into a text box You can G Drag and drop existing objects into the text box from elsewhere on the page G Create new objects using any object creation tool except the Text tool by drawing the new object inside the text box The Text tool defaults to an insertion point inside a text box To embed a text box within a text box you must drag and drop it G Insert new objects at the current insertion point either by pasting or using the Insert Object command from the Text menu U S I N G T E X T B O X E S Laying Out the Page 7 25 No matter which embedding method you use the insertion point appears within the text as a grey vertical bar When you embed an object NetObjects Fusion positions the object in a default location within the text box according to its type G Pictures are placed inline at the insertion point G Text tables sound video and
328. namic Pages Adding a Message Board You can create a Message Board on your site by adding the NetObjects Fusion Message Board component to a page The Message Board component is also called the BBS or BBS component When site visitors click the Message Board button the browser opens a new browser window displaying the Message Board Visitors can use this message board to read messages organized by thread subject author or time expand or collapse the view post new messages and reply to messages A D D I N G A M E S S A G E B O A R D Using NetObjects Fusion Components 18 9 You can have only one Message Board per site For the Message Board to run properly your Web server must be able to run CGI scripts and the site visitor s browser must support the Netscape JavaScript standard Before you can view the Message Board you must complete the server side setup described in usage notes available at www netobjects com support Note You cannot view your Message Board in Preview because the Message Board uses CGI Some components such as the Message Board and Form Handler generate les when they are used by the client When you publish your site NetObjects Fusion attempts to set up the proper le and directory permissions using the CHMOD command Some servers do not allow this permission change The Message Board will not work if it cannot write to certain les and directories This situation is more common with Unix serve
329. ncluding your JavaScript lt A HREF javascript void 0 onClick alert To build your site with NetObjects Fusion visit www NetObjects com today gt Choose javascript to indicate you re linking not to another page but to a JavaScript Type the name or function call that you ll use in the page s lt HEAD gt to de ne the script s function The name you type here identi es the link in Assets view 22 10 Working with HTML Directly I N S E R T I N G H T M L I N A T E X T B O X URL Choose javascript from this drop down list In the eld type openMe Asset Name In this eld type NewWindow which identi es the link in Assets view 3 Click the Link button to close the dialog 4 On the same page click in the Layout area or MasterBorder depending on where the link is and click the HTML button on the Properties palette The Page HTML dialog appears 5 Click the Between Heads tab and type lt SCRIPT LANGUAGE javascript gt function openMe window open http server domain com lename htm newwindow lt SCRIPT gt where http server domain com lename htm is the URL of the page you re linking to 6 Click OK Preview the page to test the link and view the HTML source in your browser to see the resulting HTML Inserting HTML in a Text Box You can insert HTML or script inside the contents of a text box at the insertion point for example to add text att
330. ne View 2 20 Backing Up Your Site 2 21 3 Importing and Exporting Using Templates and Sample Sites 3 2 Templates Included with NetObjects Fusion 3 2 Sample Sites Included with NetObjects Fusion 3 4 Creating New Sites 3 4 iii Creating a Site from a Template 3 4 Importing an Existing Site 3 7 Expanding Your Site 3 11 Importing Templates 3 11 Importing Existing Sites 3 14 Exporting a Site 3 17 Creating a Template 3 17 Changing an Existing Template 3 18 Sharing NetObjects Fusion Site Files 3 21 4 Page View Basics Displaying a Page in Page View 4 2 Ad
331. nents You place components on your pages using the tools on the Component toolbar Some NetObjects Fusion Components require set up on the server side You can nd information about server side setup in usage notes at www netobjects com support If you are a software developer and want to create your own NetObjects Fusion components sometimes called NFXes you can use the NetObjects Component Development Kit CDK available for free from NetObjects You can download the CDK from the NetObjects site at www netobjects com This chapter explains how to work with NetObjects components on your pages including G Learning about each NetObjects Fusion Component G Adding NetObjects Fusion Components to a page G Setting component properties for the client site G Adding new components to NetObjects Fusion 18 2 Using NetObjects Fusion Components A D D I N G D Y N A B U T T O N S Adding DynaButtons DynaButtons are Java buttons that link to another page on your site other sites or a speci c le You can place DynaButtons anywhere on your pages and assign up to 20 buttons to a DynaButton bar In addition you can assign up to 20 sub buttons to each DynaButton You can create sub buttons for navigating from a main page to pages at a lower level When you publish the site each button appears in the browser in the primary button style selected for the site and displays the name of the page to which it is linked You cannot assign
332. ner Properties palette appears 2 In the Style section of the General tab select Other and choose a different style from the drop down list C U S T O M I Z I N G B A N N E R S A N D B U T T O N S Creating Navigation Bars and Banners 13 11 Customizing Banners and Buttons You might want to take advantage of the automatic page linking of a navigation bar but still want to design the entire button including special text effects not available in NetObjects Fusion in an image editing application Or you might want to replace a banner on just one page with a picture that is not included in SiteStyles without affecting all the other pages that use the same MasterBorder If necessary you can substitute navigation pictures with other images for special pages The customized picture appears only when you assign the SiteStyle that was selected when you chose the picture The advantage to using customization instead of simply placing your own images as pictures is that NetObjects Fusion manages page links for you Changing the Image for One Banner You can change the picture for a selected banner in Page view When you assign a new picture to a banner NetObjects Fusion does not display the page or custom banner name If you want text to appear on the banner you must include the text in your banner graphic If you change a banner in a MasterBorder the change does not affect the banner on all the other pages that use that MasterBorder Yo
333. nge the applet or servlet it embeds If you want to replace one object with another you must delete the original Java object This list shows all the class les that NetObjects Fusion detects in the chosen class le I N S E R T I N G A N A C T I V E X C O N T R O L Adding Java and ActiveX 16 5 Inserting an ActiveX Control ActiveX controls are small applications designed with a speci c purpose such as playing an animation Microsoft Internet Explorer 3 x or later supports ActiveX controls with which you can add custom capabilities such as audio and movie players calendars custom buttons and forms to your pages You can view documents such as Microsoft Of ce les in Internet Explorer without launching the associated program Site visitors must use Internet Explorer 3 x or later to view content created with ActiveX controls To view the content in Netscape Navigator site visitors must install special plugins If you use an ActiveX control that references an external le such as a pdf le you must type in the relative path of the le as it will be in the nal published Web site First you must add the le as an asset of the site and set it to always publish see Adding File Assets on page 25 4 for information Then you can determine the le s relative path in the nal Web site by looking at the publish directory structure listed in Publish view Because ActiveX requires that you install Microsoft A
334. nk Anchor If Object Icons is checked in the View menu NetObjects Fusion displays the Link or Anchor icon wherever you create a link or an anchor In Page view you can follow an existing link to its target page or anchor G Right click a linked object and select Follow Link from the shortcut menu or select the object and from the Go menu choose Follow Link G To follow a text link click in the text so it includes the blinking insertion point then right click the linked text and select Follow Link from the shortcut menu G To follow a button link double click the button then right click the button and select Follow Link from the shortcut menu W O R K I N G W I T H L I N K S Creating Links and Anchors 14 3 To edit a link select the linked text or object click the Link button on the properties palette then change the link in the Link dialog To remove a link select it click Link on the Properties palette and click Unlink in the Link dialog If your page includes AutoFrames you might want the target of a link to appear in a speci c frame For more information see Targeting Links in AutoFrames on page 24 2 Creating an Internal Link Internal links lead to pages or anchors within your site If you move the page to a different place in your site s structure or change the page s name NetObjects Fusion automatically updates the link Assets view lists the internal links in your site so you can track them
335. nnot undo this operation You must use the Add Link command to recreate the link Verifying Links To determine whether all link destinations can be located 1 In Assets Links view from the Assets menu choose Verify All Links NetObjects Fusion displays a progress bar as it veri es and reports the status of link destinations It accesses the Internet to verify external link references G When a link s destination is found the date and time of validation appear in the Verify Status column G If a link s destination is not found the problem is described in the Verify Status column When veri cation is complete the progress bar disappears 2 Resolve the destinations of any broken links by double clicking the link and editing it as described in the previous section Link veri cation takes place in the background so you can switch to another view and continue working while the links are being veri ed To verify links through a proxy server G Open the Windows 95 Control Panel and double click the Internet icon In the Internet Properties dialog click the Advanced tab and con gure your proxy settings 25 12 Managing Assets M A N A G I N G D A T A O B J E C T S Note NetObjects Fusion might not be able to verify destinations that are on the other side of a rewall Also after veri cation any mailto links display Unsupported URL Type because NetObjects Fusion cannot verify whether an email add
336. not change this setting WARNING Do not shut down Windows while the le is being compacted This could cause your nod le to become unstable Editing Objects and Assets You can edit objects created in other software applications from within NetObjects Fusion In Page view you select the object on the page and then from the Object menu select Open Object In Assets view you select the Asset and then from the Asset menu select Open Asset If the correct application does not open the le type of the object or asset is probably not associated with the correct application For example if you want to edit a gif image you select the picture in Page view and select Open Object from the Object menu If Microsoft Internet Explorer opens rather than an image editing application you must change the application associated with gif les To set the application associated with a speci c le type in Windows 1 Double click the My Computer icon on your Windows Desktop 2 From the View menu select Options 3 Click the File Types tab 4 For every image le type in the list click Edit and choose the appropriate Content Type 5 Click OK to close the Options dialog and close the My Computer window N E T O B J E C T S F U S I O N F O L D E R S T R U C T U R E NetObjects Fusion Basics 1 19 NetObjects Fusion Folder Structure The NetObjects Fusion 3 0 folder contains all the les you need to use NetObjects
337. nprotected server so an authorized administrator can then transfer the site to the protected location G Using an FTP application such as WS FTP or other means of access authorized by the server administrator to transfer the entire site structure of the locally published site to the protected server 26 28 Publishing Your Site P U B L I S H I N G S P E C I A L A S S E T S In either instance be sure to transfer all les and to duplicate the local folder structure precisely Publishing Special Assets When you publish your site NetObjects Fusion transfers the entire site to your designated location including special assets you told it to manage These special assets include things like Java classes images and assets contained on external HTML pages and CGI scripts The list of managed assets included in your published site is displayed in Assets view You can use one of three ways to ensure that these special assets are included in your site s managed assets when you publish G Include the assets when you add the object that refers to them For example If you reference external HTML pages using the External HTML tool NetObjects Fusion automatically analyzes the external pages and includes their assets in the Asset Manager unless you select Do not manage or move assets If you do not select this option you have to add assets those pages need to the Asset Manager using one of the two methods below For information
338. o Page view to create a data list and stacked pages To create a new internal data object 1 Do either of the following Data List tool G In Page view select the Data List tool from the Advanced toolbar and draw a rectangle on the page The Data Publishing dialog appears see page 20 6 Click the New button to display the Data Object dialog New External Data Source tool Data List tool 20 8 Data Publishing C R E A T I N G A D A T A O B J E C T G In Assets view click the Data Objects tab and then click the New button on the control bar The Data Object dialog appears 2 Select Internal and enter a name for the data object and comments about it NetObjects Fusion uses the data object name to identify your data object when it lists all data objects in the Data Publishing dialog and in Assets view 3 Click the plus button to add a eld Fields de ne the kind of data you can enter C R E A T I N G A D A T A O B J E C T Data Publishing 20 9 The Data Field dialog appears 4 Type the eld name select the data type for the eld and click OK Internal data elds can store formatted text plain text and image les G Simple text elds All characters in these elds share the same formatting characteristics Simple text elds cannot contain paragraph breaks or line breaks and cannot exceed 255 characters You can sort on simple text elds G Formatted text elds Characters
339. object outside the form For example create the form in a Layout Region and place the object elsewhere in the Layout area G If you publish a form in a Layout Area or Layout Region using the CSS amp Layers HTML output method form elements display piled atop one another in the upper left corner of the page Solution Either change the HTML output method to Regular Tables or Nested Tables or recreate the form in a text box or a table Problems with Sounds and Shockwave Sound or Shockwave objects published using Nested Tables or Regular Tables as the HTML output method can t be started stopped or otherwise controlled in Netscape Navigator 4 0 To avoid this problem change the HTML output method to CSS amp Layers A 4 Working Around Browser Problems P R O B L E M S W I T H S O U N D S A N D S H O C K W A V E I N D E X Index 1 Index A accessing HTML 22 2 22 6 actions 21 2 action messages 21 3 21 10 adding to objects 21 5 21 16 assigning to Layout Regions 7 20 assigning to Layouts 7 13 assigning to navigation bars 13 3 assigning to text boxes 7 30 assigning to text links 21 17 cascading 21 15 21 16 custom importing 3 13 custom scripting 21 20 21 25 customizing 21 17 21 27 customizing parameters 21 13 illustrated 21 4 inserting in scripts 21 22 inserting scripts 21 22 JavaScript 21 23 MasterBorders AutoFrames 21 9 modifying 21 26 Object Initially Visible in Browser option 21 20 objects in forms 17 5 pa
340. oesn t have to be downloaded again because it is already in the system cache You can add an action to an object using the Actions tab For more information about adding actions see Chapter 21 Building Dynamic Pages Inserting a Video File You can add video such as an animation or a movie to a site For example if you are creating a site for a video rental store you might include video clips from the latest releases on the site Site visitors could preview the video clips before they rent or buy the movie The latest browsers often have video players built in however other browsers might require a helper application or plugin For example Netscape Navigator includes Live Video To ensure that site visitors can view the video you should provide a link to a site from which site visitors can download a plugin that can play the video les Using NetObjects Fusion you can display video les two ways on a page G Use a placeholder icon to represent the video le When site visitors click the icon a separate browser window opens and plays the video G Play the video on the page when the page is displayed You set how video is displayed on the Video Properties palette NetObjects Fusion supports these popular video le formats G Moving Pictures Experts Group mpg mpeg mpe mpv supported by Windows and the Macintosh with browser plugins G Microsoft Audio Video Interleaved avi supported by Windows G
341. of the section and then press Shift Enter The Properties palette displays the Section tab 2 Select the MasterBorder you want from the MasterBorder drop down list The MasterBorder is applied to all the pages in the section Renaming MasterBorders 1 In Page view click inside the MasterBorder area to display the MasterBorder Properties palette 2 Click Add Edit 3 In the Edit MasterBorder List dialog select the MasterBorder you want to rename and click Rename 4 In the Rename MasterBorder dialog type a new name and click OK U S I N G A U T O F R A M E S Managing MasterBorders and AutoFrames 6 9 The new MasterBorder name now appears in the Edit MasterBorder List dialog and in the drop down list in the MasterBorder Properties palette Deleting MasterBorders 1 In Page view click inside the MasterBorder area to display the MasterBorder Properties palette 2 Click Add Edit 3 In the Edit MasterBorder List dialog select the MasterBorder you want to delete and click Delete You see a warning that deleting a MasterBorder cannot be undone 4 If you choose to continue click OK Note When you delete the MasterBorder that is currently in use NetObjects Fusion resets the page to the ZeroMargins MasterBorder Using AutoFrames An AutoFrame is a special instance of a MasterBorder margin that corresponds to an HTML frame It subdivides the browser window into independent panes each display
342. of your page before you add AutoFrames For example if you have a banner across the top of the page that overlaps the left and top borders resize it or move it before you turn on AutoFrames for either border G Frames have internal margins so add a little extra room to margins you re going to set as frames so you don t get scroll bars when you don t need them G By default frames are borderless To add borders see Generating HTML Frame Borders on page 6 15 To set a MasterBorder margin as an AutoFrame 1 In Page view click an empty space inside one of the border areas or in the grey area outside the page The MasterBorder Properties palette displays the General tab 2 Select the AutoFrames tab 3 Click the button for each margin you want to set as a frame Left Right Top or Bottom 6 14 Managing MasterBorders and AutoFrames A D D I N G A N A U T O F R A M E NetObjects Fusion indicates a frame is applied by adding a label Left Right Top or Bottom to the new frame If you select more than one border to set as a frame your selection sequence makes a difference Multiple frames overlap each other in the order in which you select them You can change the overlap sequence by deselecting AutoFrame areas and then reselecting them in a different sequence In the rst example the left frame was selected followed by the bottom frame as indicated by the numbers in the AutoFrames tab As a result
343. og appears 4 Click the Inside Tag tab and type onClick alert your message where your message is the text of your message 5 Click OK in the Object HTML dialog then click Link in the Link dialog Preview the page and click the image or text to see the message View the HTML source in your browser to see the resulting HTML Another way to add this JavaScript to a picture or text link is to create a custom link In the Link dialog click the External Link tab choose javascript from the URL This symbol in Page view marks an object with HTML or script attached E X A M P L E S O F O B J E C T H T M L Working with HTML Directly 22 9 drop down list and type the onClick script in the URL eld See Linking to a New Window for another example of creating a link this way Linking to a New Window You can have a link open a page in a new browser window rather than in the current window for example so site visitors can keep the current page around while exploring a new part of your site To do this de ne a window open JavaScript in a page s lt HEAD gt and call the function from the link using the Link dialog 1 In Page view select the image or exact text to be the link and click the Link button on the Properties palette The Link dialog appears 2 In the Link dialog click the External Link tab and create a custom link Message that appears when site visitors click the link Resulting HTML i
344. ols are discussed on page 2 11 Selecting Pages Before you can add rename or move pages or set page properties you must rst select a page By selecting a page you identify it as the one you will work with NetObjects Fusion places a blue border around the selected page To select a page do either of the following N Using the mouse click the Selection tool and then click the icon for the page you want to select If you click directly on the page s name NetObjects Fusion selects the page name and switches into text editing mode See Renaming Pages on page 2 14 N Using the keyboard press the arrow keys to select the current page s parent child or sibling pages Selection tool Zoom tool Selected page U S I N G T H E S I T E V I E W T O O L S Creating and Managing Sites 2 9 Working with Sections In addition to selecting individual pages you can select sections of your site A section is any page and all its children their children and so on You can move a section to a different location in the site set section properties including MasterBorders see Chapter 6 Managing MasterBorders and AutoFrames and preview a section independently of the rest of the site To select a section do either of the following N Hold down the Shift key as you click the parent page of the section N With the keyboard select the parent page of the section and then press Shift Enter NetObjects Fusion
345. on Banner tool Use the Banner tool to add a banner based on your SiteStyle to your page See Chapter 13 Creating Navigation Bars and Banners for information Rectangle tool Use the tools in the Draw Shape group to draw shapes See Chapter 11 Drawing Shapes and Lines for information about drawing shapes HR tool Use the tools in the Line tools group to draw rules lines and arrows See Chapter 11 Drawing Shapes and Lines for information about drawing lines and arrows Using the Advanced Toolbar The Advanced toolbar contains tools you use to add media that require plugins such as Shockwave and QuickTime Java applets and servlets ActiveX controls data objects and external HTML Plug in tool Use the tools in the Media tools group to add popular plugins such as Shockwave for Director Shockwave Flash or QuickTime movies to your pages See Chapter 15 Placing Media for information about adding these objects Java tool Use the Java tool to place Java applets and servlets See Chapter 16 Adding Java and ActiveX for information U S I N G T H E C O M P O N E N T S T O O L B A R Page View Basics 4 17 ActiveX Control tool Use the ActiveX Control tool to place ActiveX ocx les on your page See Chapter 16 Adding Java and ActiveX for information Data List tool Use a Data List tool to add data list objects See Chapter 20 Data Publishing for information Exter
346. on about stacked pages see Chapter 20 Data Publishing G Color Sets the color of individual page icons in Site view You can use colors to help you manage work on the site For instance use colors to specify pages that need updating or for sections that you need from another designer The page icon s color has no effect on the published site G Status Marks pages as Done or Not Done a convenient way to manage individual pages in a large site This setting is for your information only and has no effect on the functioning of the site The page icon displays a check mark when you select Done Page properties Section properties U S I N G T H E S I T E V I E W T O O L S Creating and Managing Sites 2 11 G Publish Don t Publish Makes it possible to publish some pages while not publishing others that might be under construction or private The page icon displays a red bullet when you select Don t Publish NetObjects Fusion removes pages marked Don t Publish from the navigation bars of other pages in the site disables manually created links to such pages and does not produce HTML for these pages during publishing However you can preview a page that is designated Don t Publish as an individual page Do not use the Don t Publish setting to exclude pages in an attempt to publish changed pages only to an already published site Doing so causes broken links and other undesirable results G Comments Enter notes to yours
347. on uses aliases for les and external links you can globally replace an item that appears on several pages such as a picture an applet or an external link by replacing it once in Assets view If you insert a variable in text boxes on different pages you can edit the value of the variable in Assets view and NetObjects Fusion updates all instances of the variable throughout your site automatically This chapter describes the features of Assets view including G Managing les G Managing links G Managing data objects G Managing variables 25 2 Managing Assets W O R K I N G I N A S S E T S V I E W Working in Assets View When you switch to Assets view choose which kind of asset to view by clicking one of the four tabs below the control bar You can sort a list by clicking a column heading and you can change the width of any column by dragging the column divider to the left or right Depending on the selected asset type Assets view lists Click a tab to see le assets links data objects or user de ned variables Click a column heading to sort the table Drag the column divider to change column width Files Links Data Objects Variables Name Name Name Name Type Link To Contents In Use Type Location Target Size Verify Status Date Verify Status M A N A G I N G F I L E A S S E T S Managing Assets 25 3 Managing File Assets When you click the Files tab a list of the l
348. or on your Web server and view the source in your browser To test the tags you added publish on your Web server and search for keywords using the various search engines be patient as it can take days or weeks for indexers to nd your site Search engines continually evolve how they use Meta tags and other content to index and rank pages and many of them make this information available at their sites Check there to nd out about other techniques 22 6 Working with HTML Directly A C C E S S I N G A N O B J E C T S H T M L Auto Forwarding from a Transition Page You can create a transition page that appears for a few seconds for example to display a product logo and then forwards site visitors automatically to another page You do this by inserting a Meta tag in the page s lt HEAD gt 1 In Page view click in the Layout area of the transition page and click the HTML button on the Layout Properties palette The Page HTML dialog appears 2 Click the Between Head Tags tab and type lt META HTTP EQUIV REFRESH CONTENT seconds URL http server domain com page htm gt where seconds is the number of seconds you want the transition page to appear and http server domain com page htm is the URL of the page you want to link to 3 Click OK Preview the site to test the transition and view the HTML source in your browser to see your code Accessing an Object s HTML You can add HTML or script to pi
349. or or in Microsoft Internet Explorer G HTML editor Click Browse and nd the le that launches your editor When you want to edit the HTML of an External HTML object double click the External HTML s X in Page view to launch the editor you specify here For example you can designate Allaire HomeSite 3 0 as your HTML editor if you installed it with NetObjects Fusion 3 0 See Chapter 22 Working with HTML Directly for details S E T T I N G P R E F E R E N C E S NetObjects Fusion Basics 1 15 3 To set Page preferences click the Page tab G Browser Font Settings Choose Proportional and Fixed Width font settings To ensure that your pages appear in your browser the way you design them in NetObjects Fusion choose the same font settings in your browser For example if you use Times size 12 and Courier size 10 for your browser proportional and xed width fonts choose the same fonts and sizes in NetObjects Fusion Note that the suggested settings are the defaults used by the browser when it was installed Be aware that NetObjects Fusion sizes text boxes based on the expected font size so when you change sizes you change the Layout of the page slightly G General Choose the measurement unit you want to use as you build your site Then specify a width and height in this unit of measurement for your default page and grid sizes When you add a new page to your site it will have this size Changing this option
350. order until you move the object 3 Use the Selection tool to arrange objects such as a banner or navigation buttons 4 Delete unwanted objects 5 Use the tools in Page view to insert additional text or objects Resizing a MasterBorder You can easily make a MasterBorder t the objects in it buttons banners text pictures and so on 1 In Page view select one of the objects in the MasterBorder This handle changes the MasterBorder size These handles change the MasterBorder size These handles change the Layout size 6 6 Managing MasterBorders and AutoFrames M O D I F Y I N G A N D C R E A T I N G M A S T E R B O R D E R S 2 From the Object menu choose Size MasterBorder to Objects Creating a New MasterBorder 1 In Page view click in the MasterBorder area The MasterBorder Properties palette appears The Name eld shows the name of the MasterBorder assigned to the current page If you have not created a new MasterBorder or selected a different MasterBorder from the MasterBorder list this name is DefaultMasterBorder 2 Click the Add Edit button The Edit MasterBorder List dialog appears MasterBorder margins before and after being resized Click here to create a new MasterBorder M O D I F Y I N G A N D C R E A T I N G M A S T E R B O R D E R S Managing MasterBorders and AutoFrames 6 7 3 The dialog lists all the MasterBorders in your site with the current MasterBorder sele
351. orm for the Submit button 2 Enter the email address and relabel the button if you want G Button Name To change the button s label click in the Button Name row and type a name in the Form Handler text eld G Publish to Click this option and choose Email from the drop down list G Email Click this option and type the email address to which responses will be sent G Required Fields For each eld choose whether a response is required True or not False for a submission to be successful If you mark a eld True and a site visitor doesn t ll it in they see the error URL when they submit the form Note If any object in your form isn t listed in the Form Handler Properties palette you might have named it incorrectly See Naming Form Objects on page 17 5 Click a Form Handler property here to enter its value in this eld P R O C E S S I N G D A T A W I T H A C G I S C R I P T Designing and Implementing Forms 17 17 Processing Data with a CGI Script To process form responses other than by outputting text use a CGI script A CGI script is a program that controls a program on your Web server Using a CGI script you can format responses for a particular application summarize them on a page that s returned to the site visitor or do practically anything else with the data For more information about the bene ts of CGI scripts talk to your Web administrator or ISP Note Not all
352. orms Checkbox Properties palette de ne the name for this box that s passed to the script processing the form G Name Type the argument for this box that s passed to the script processing the form Ask your Web administrator or ISP if you re not sure what s required here If you re using the Form Handler use a number indicating the box s order in the output text G Value Type the argument passed for the box if the site visitor checks it If you re using the Form Handler and a visitor checks a button named 6 that has the value Email the output text might appear as 6 Email G Default Select either Checked or Unchecked to set the box s initial status which is returned as the response if the site visitor doesn t change it 4 To label each check box use the Text tool to insert text next to it Adding a Combo Box If a long list of check boxes or radio buttons takes up too much space in your form you can list options in a combo box instead Use a scrolling list if you want site visitors to be able to select more than one option which is a space saving alternative Value that s passed if this box is checked Argument passed to the script processing the form A D D I N G O B J E C T S T O A F O R M Designing and Implementing Forms 17 11 to a group of check boxes Or use a drop down list for selecting only one option which is an alternative to radio buttons After creating the form as described o
353. other objects are placed one line below the insertion point ush left You can then use the options on the object s Align tab to arrange that object within the text box If your object is not inline on the text line NetObjects Fusion displays an insertion marker to show the insertion point Text box with wide border Insertion point Picture Object Draw pointer Insertion marker Embedded Image aligned with Left Wrap setting 7 26 Laying Out the Page U S I N G T E X T B O X E S You can move an embedded object by dragging its insertion point into place When you select the object the insertion point is displayed and you can manipulate its location as needed For example to place the embedded object on the top line of the text box place or move its insertion point before the rst character of text Embedding Existing Objects with Drag and Drop 1 In Page view select the Text tool from the Standard toolbar and create a text box 2 Select an object elsewhere on the page and drag it into the text box The text box boundary indicates the object will be embedded 3 Position the drag and drop insertion point at the place in the text where you want to insert the object 4 Drop the object 5 Position the object within the text box where you want it See Aligning Objects in a Text Box on page 7 28 for information Insertion Point moved to position before the rst character of text Embedded Image
354. ou can display an alignment grid that is independent from the grid displayed within the Layout The Layout Region grid always displays in pixels You can set it to any scale the default is 50 percent of the grid for the page See Setting Preferences on page 1 12 for information on setting the page grid To display and modify the Layout Region grid 1 In Page view select the Layout Region The General tab of the Layout Region Properties palette appears 2 Select LocalGrid 3 Set the width and height of the local grid U S I N G L A Y O U T R E G I O N S Laying Out the Page 7 17 Setting the Layout Region s HTML Output You can specify what type of HTML code NetObjects Fusion produces for the current Layout Region The HTML output setting overrides the method NetObjects Fusion uses to publish the parent container for the Layout Region For example if the Layout Region is placed on a page s Layout you can set its HTML output method to override the method used for that Layout which in turn can be set to override the site s publishing method If you embed Layout Region inside another Layout Region the embedded Layout Region can have an HTML output setting that overrides the HTML output produced for the parent Layout Region See Selecting HTML Output on page 5 3 for descriptions of the HTML output options and their effects To specify the HTML output method that NetObjects Fusion uses to produce this La
355. ou don t have to create multiple text boxes to achieve a text wrap effect G If the text box is the size of the Layout and you have chosen the ZeroMargins MasterBorder you can set the text box to resize itself to the size of the browser window When your site visitor views the page it rewraps itself as necessary to t within and ll the browser window G You can use any of NetObjects Fusion s HTML output types nested tables regular tables or CSS and Layers G You can present tabular or columnar data in a NetObjects Fusion table each cell of which consists of a text box Text Box Limitations G You give up pixel level control of the layout and design of your page and use alignment choices to control the placement of objects 7 32 Laying Out the Page S E L E C T I N G L A Y O U T M E T H O D Layout Considerations If precise placement of your content is more critical to your site visitors than ef cient lean pages or if you have individual pages that you want to publish using a speci c HTML output method different from the rest of the site then use the Layout as the container for your page layout Layout Advantages G You have pixel level control of the layout and design of your page G You can drag and drop objects into their proper locations with ease G You can specify the HTML output type for any individual Layout this lets you isolate any advanced content which can exclude site visitors who are usin
356. ou want the objects to align or be distributed relative to the Layout or Layout Region in which the objects are placed select Relative to Layout 3 In the Align section specify the horizontal and vertical alignment G Select an option from the Horizontally section to align objects left or right sides or if you want them to be centered on top of each other If you select Relative to Layout the objects align to the right or left side of the layout or are centered in the Layout one on top of the other G Select an option from the Vertically section if you want to align objects top or bottom sides or if you want them to be centered next to each other If you select Relative to Layout the objects align to the top or bottom of the layout or are centered in the layout side by side M A K I N G M U L T I P L E O B J E C T S T H E S A M E S I Z E Page View Basics 4 15 G Select Horizontally from the Distribute section if you want three or more objects that are on top of each other to be equidistant Select Vertically from the Distribute section if you want three or more objects that are next to each other to be equidistant Note Object alignment can have an impact on preserving your design See Optimizing Nested Tables Output on page 5 7 for information Making Multiple Objects the Same Size You can adjust objects so they are all the same size 1 In Page view select the objects by Shift Clicking each one or by d
357. ou want to embed and click OK NetObjects Fusion embeds that object 5 Position the object within the text box where you want it See Aligning Objects in a Text Box on page 7 28 for more information You can also use this method to embed an object by pasting 7 28 Laying Out the Page U S I N G T E X T B O X E S 6 Copy or cut the object from another page or location 7 Right click the insertion point at the position in the text box where you want to insert the object 8 Select Paste from the shortcut menu NetObjects Fusion inserts the object 9 Position the object within the text box where you want it See Aligning Objects in a Text Box for information Aligning Objects in a Text Box Once you embed an object in a text box you can position it as needed using the options on the Align tab of the Properties palette for the object The options shown for each type of object re ect the alignment attributes supported by HTML For example in HTML coding you can create a horizontal or vertical margin around an image on the Align tab of the Picture Properties palette you can set a horizontal or vertical space around a picture object Depending on the type of object you selected NetObjects Fusion displays some combination of the following alignment options Each option s icon shows G Vertical alignment of the object to the text line top middle or bottom G Horizontal alignment of the object to th
358. out the publishing process describes the functions and features of Publish view and tells you how to publish your site by G Selecting the default HTML output method G Designing the server le and directory structure G De ning local and remote server locations G Publishing your site locally or remotely Note Sites published with NetObjects Fusion work with any Web server on any operating platform No special Web server extensions are required If your site contains server side components including NetObjects Fusion Message Board or Form Handler components CGI scripts or third party components such as Allaire Fusion2Fusion it will require additional server setup 26 2 Publishing Your Site T H E P U B L I S H I N G P R O C E S S The Publishing Process When you publish your site NetObjects Fusion generates HTML pages and associated assets from the information in the Sitename nod le which contains your site structure page design content links and assets If you are publishing to a remote server NetObjects Fusion opens an FTP session and connects to the remote server Then the HTML pages and assets of your site are stored in the location of your choice using the le and directory structure you specify To publish your site the rst time 1 De ne your site s publishing settings in the Setup Publish dialog by a De ning the le and directory structure b Selecting the HTML output method c
359. pe Navigator This chapter describes how to use these techniques to lay out the body of your page G Creating Layouts Layout Regions and text boxes G Modifying the appearance and properties of each container G Determining which approach to use for page layout G Using design priorities to determine page layout method and HTML output method 7 2 Laying Out the Page U S I N G L A Y O U T S Using Layouts The Layout is the default container that makes up the body of the page It is surrounded on all four sides by the MasterBorder When you publish a page a single HTML le containing all the objects and properties of the MasterBorder and the Layout is created The dimensions of the published page are determined by the combined size of the Layout and the MasterBorder When you create a new page NetObjects Fusion automatically assigns it a default Layout You can also create multiple Layouts which are an effective way to prototype page designs and toggle between sets of content When you preview or publish your site NetObjects Fusion publishes each page according to the currently selected Layout Controlling Layout Appearance You can control various characteristics of the Layout s appearance in Page view G You can show or hide the MasterBorder by selecting it from the View menu NetObjects Fusion publishes each page with its MasterBorder whether it is visible or not in Page view See Modifying and Creating MasterBorders
360. pe of link For information about creating links see Working with Links on page 14 2 7 Specify the appropriate information for the link and click Link 8 Repeat steps 5 through 7 for each image You can add an action to an object using the Actions tab For more information about adding actions see Chapter 21 Building Dynamic Pages 18 18 Using NetObjects Fusion Components A D D I N G O T H E R N E T O B J E C T S F U S I O N C O M P O N E N T S Adding Other NetObjects Fusion Components NetObjects Fusion components extend a site s functionality Many third party developers create components that make external database connectivity electronic commerce and dynamic data publishing possible Dynamic data publishing for example refreshes data each time a visitor goes to the site You can publish data dynamically on your site by adding a third party component such as G Allaire Cold Fusion and Fusion2Fusion components available at www allaire com G Selective Server from Fundere available at www fundere com G Lotus Domino and NetObjects Fusion Connector available at www lotus com For information about static data publishing see Static and Dynamic Data Publishing on page 20 2 Other third party developers such as Coolmaps provide many useful components You can purchase components from Coolmaps to create special rollover buttons add pull down menus of links or put a vicinity map on your page Vi
361. picture from an external source Picture Loader tool 1 In Page view select the Picture Loader tool from the Component toolbar 2 Draw a box on the page to indicate where you want to place the picture A picture placeholder appears on your page and the Picture Loader Properties palette appears 3 Double click the Image URL row and type the URL where the picture is located Type the complete URL For example http www netobjects com announcements assets images homepagemainart gif 4 Click the check mark 18 16 Using NetObjects Fusion Components A D D I N G R O T A T I N G P I C T U R E S Adding Rotating Pictures You can use the NetObjects Fusion Rotating Picture component to display different pictures in succession in the same place on the page For example you could rotate among several images that advertise new products or current sale items To add a rotating picture you specify the image to display and the number of seconds to pause before displaying the next picture in the sequence You can also assign a link to each picture NetObjects Fusion supports the most popular graphics formats used on the Web including gif and jpeg For more information about these formats see Choosing an Image Format on page 10 2 Note that if you want to use animated gif les you can create an animated gif le outside NetObjects Fusion in several popular image editing applications After creating the animated g
362. places a blue border around the pages in the section Sections are not permanent entities You can deselect the section by clicking any page in the site by clicking the Site view background or by pressing an arrow key or Shift Enter You can preview just the selected section For more information on previewing a section of pages see Setting Preferences on page 1 12 Setting Page and Section Properties Pages and sections have a number of properties Some properties affect the published site others are for your information For example you can assign colors to the page icons to create visual groups that indicate which pages are nished or which are assigned to a particular author You can instruct NetObjects Fusion This page and its children are a section as indicated by the blue border 2 10 Creating and Managing Sites U S I N G T H E S I T E V I E W T O O L S whether to publish a particular page note whether a page is done and enter comments about the selected page To set properties select a page or section to display the Properties palette Page Properties G Page Name The name assigned to the page See Renaming Pages on page 2 14 and Using Custom Page Names and Extensions on page 2 15 G Custom Names See Using Custom Page Names and Extensions on page 2 15 G Page Type Shows whether the page is a normal page or a stacked page Stacked pages are created when you use a data list For informati
363. pment tool When you import and convert an existing site NetObjects Fusion G Analyzes and duplicates the structure of the source site G Analyzes and duplicates the content of each page G Arranges source content into objects in a layout design as close as possible to the original G Duplicates navigation and content links G Assigns the default Plain SiteStyle and the default MasterBorder if you select one You can use this import and conversion function to bring previously created sites into NetObjects Fusion format Then you can use NetObjects Fusion for updates revisions and maintenance When you create a new site by importing and converting an existing site follow these guidelines G When you begin to import and convert a source site you can select one MasterBorder from the currently displayed site to apply to the new site If you have an existing site with a MasterBorder similar to what you want the newly created site to have open that site rst then create the new site NetObjects Fusion applies the selected MasterBorder to the new site as it is created G Be aware that importing a complex site might take more processing time than you expect If the source site was created in NetObjects Fusion it is more ef cient to import it as a template than to import the published HTML pages G You can import an existing site from a local or networked drive or from a remote location such as an intranet server or the World Wide Web
364. ppear in the URL and Asset Name elds You can modify the name and URL URL drop down list with protocol selected URL eld W O R K I N G W I T H L I N K S Creating Links and Anchors 14 11 6 If you re creating a new external link asset enter a name for this link target in the Asset Name eld This name is for your reference It appears in the list of links in Assets view so you can quickly identify and sort link destinations It is not added to the HTML generated when your site is published 7 Click Link Creating a File Link You use le links to link to a le The le referred to by the le link becomes an asset of the site and is uploaded to the server when the site is published You might use a le link to link to a le that your site visitors want to download 1 In Page view select an object to link G If you are linking text select the text you want the browser to display as linked G If you are linking a picture or other object click to select it 2 In the Properties palette for that object click Link The Link dialog appears 3 Select the File Link tab Location of le File name 14 12 Creating Links and Anchors A D D I N G H T M L T O A L I N K The Select Frame Target control appears only when the current page contains an AutoFrame For more information about link targets see Targeting Links in AutoFrames on page 24 2 The File Link tab shows the path
365. pping 4 12 26 8 placing 4 7 renaming 4 12 selecting 4 9 snapping to grids guides 4 4 wrapping text around 8 13 OCX les 16 6 ODBC Data Source Administrator 20 14 ODBC drivers 20 11 online help xviii Open Data Base Connectivity drivers 20 11 Open Site command 2 6 opening le assets 25 9 image les in image editor 10 15 opening sites 2 6 optimizing AutoFrames 5 11 orientation Site view 2 18 outline option viewing sites with 2 19 Outline view 2 19 output options and design priorities 7 34 overlapping objects 4 12 26 8 P Page HTML dialog 22 2 page HTML examples 22 4 page labels hiding 7 2 page layout advantages of Layout Regions 7 33 advantages of Layouts 7 32 advantages of text boxes 7 31 limitations of Layout Regions 7 33 limitations of Layouts 7 32 limitations of text boxes 7 31 selecting method 7 31 using external HTML 7 30 using tables 7 30 page layout options 7 1 page name setting 13 9 specifying custom 2 15 Page Name property 2 10 page names character limit 2 15 custom 2 15 editing in Site view 2 14 page navigation buttons see navigation buttons page properties 2 9 changing 2 9 page size requirements for browser display 7 6 Page tab Preferences dialog 1 15 page templates importing 3 13 page templates provided 3 3 Page Title Custom Names dialog 2 16 Page Type property 2 10 Page view 1 3 4 2 displaying pages 4 2 hiding labels object icons rulers 7 2 illustrated 4 2 page driven event
366. pping Objects NetObjects Fusion supports CSS and Layers an advanced form of HTML output that lets you overlap objects Site visitors who have newer browsers Microsoft Internet Explorer 4 x or Netscape Communicator 4 x can see an object superimposed on top of another one When you choose the CSS and Layers output option you can place overlapped objects anywhere in a Layout or embed them in a Layout Region To overlap two or more objects 1 In Page view in the Layout Properties palette if you have not selected CSS and Layers for your entire site select CSS and Layers from the Use drop down list 2 Place two or more objects in the Layout or a Layout Region 3 Determine the object you want to be on the bottom layer then drag the object you want to be on the next layer on top of it 4 Repeat step 3 to continue layering objects See Selecting HTML Output on page 5 3 for a complete discussion of the CSS and Layers output type If you want to change the order by which objects are layered see Rearranging Layered Objects on page 4 13 Locating and Renaming Objects The Object Tree provides a convenient way to locate and rename objects on a page This is particularly useful when you are working with layered or hidden objects If you added several of the same type of objects NetObjects Fusion numbers each object in the order in which you placed it 1 In Page view from the View menu choose Palettes Object T
367. pt text input from site visitors They can be any width but only one line high See Adding a Single Line Text Field on page 17 5 for information Multi line tool Multiple line text elds can hold more than one line of text See Adding a Multiple Line Text Field on page 17 7 for information I N T E R P R E T I N G T H E W A R N I N G I C O N Page View Basics 4 19 Forms Combo Box tool Combo boxes create drop down lists to display multiple options Combo boxes allow site visitors to select one or several items from a list See Adding a Combo Box on page 17 10 for information Interpreting the Warning Icon NetObjects Fusion displays a warning icon on an object when it detects a potential layout problem or other error condition Mouse over the warning icon to display a ToolTip that identi es the problem which can be one of the following G A picture is not Web safe because it is in an unsupported le format To remove the icon replace the picture with one in a supported format See Choosing an Image Format on page 10 2 for information G A form object such as a Submit button is outside a form To remove the icon drag the form object inside a form See Adding Objects to a Form on page 17 4 for information G Two or more objects overlap and you have not selected CSS and Layers as your HTML output option To remove the icon drag objects apart so they don t overlap or choose CSS and Layer
368. r a list either select a bullet type or a numbered list option from the Bullet list G To start a numbered list with a value other than 1 or A click Start Value and enter a number in the Start value eld in the Start Value of Numbered List dialog Then click OK G Specify how you want the paragraph to be aligned by selecting an option in the Alignment section Click OK in the Paragraph dialog 6 In the New Style dialog click Font to select another font or modify the size style effect or color of the font If you don t want to modify the font skip to step 8 The Font style name dialog appears G Select the font font style and size you want to specify for the text style The font size numbers represent size relative to your site visitor s default browser font size G In the Effects section click the check box for the effect or effects you want to specify for the style G To assign a color other than the SiteStyle color to the text click Color select a color from the Color Picker and click OK Click OK in the Font dialog The changes appear in the Preview and Description sections of the New Style style name dialog 7 In the New Style dialog click OK The new style is added to the Styles list of the Text Styles dialog 8 Click Close 8 12 Designing with Text C R E A T I N G A N D M O D I F Y I N G T E X T S T Y L E S Modifying Styles 1 In Page view from the Text menu choose E
369. r site or import as a section or page that you add to your current site U S I N G T E M P L A T E S A N D S A M P L E S I T E S Importing and Exporting 3 3 G AutoSite templates provide a complete site with predesigned pages a suggested site structure and placeholder content AutoSite templates are stored in the NetObjects Fusion 3 0 Templates AutoSites folder There are ve AutoSite templates included with NetObjects Fusion An Internet style company site A departmental intranet site A business presentation site An import site A Blank site G Page templates are professionally designed pages containing generic content that you can replace with your own information Page templates are stored in the NetObjectsFusion Templates Pages folder NetObjects Fusion includes A Blank Page template that is used whenever you add a new page to your current NetObjects Fusion site Special use pages such as a table of contents a calendar an FAQ page an of ce directory and a what s new page Sample navigation pages which provide examples of top and left frame navigation a text based page and an empty page Data derived pages such as an employee directory a who s who function and a press release catalog G Form templates which are predesigned form pages containing generic or placeholder content for typical forms A billing form A guestbook An order form
370. rack of all your name path and structure changes and updates the site s links and auto generated objects as appropriate When you re publish the site in the future NetObjects Fusion remembers your changes and keeps them in place Note Customizing your site structure does not change the appearance design or content that your site visitor sees it only controls how the pages and assets are stored on the server and the URL necessary to access the site s interior information Creating a Custom Folder 1 In either pane of Publish view right click the folder page or asset where you want to add a custom folder and select Add Folder from the shortcut menu NetObjects Fusion adds a custom subfolder named New Folder below the selected folder or le and opens the folder s name eld 2 Edit the existing folder name or enter a new name Press Enter or select another object to record your changes 3 Drag other folders or les into the custom folder as needed Renaming Folders and Files 1 In either pane of Publish view right click the object and select Rename from the shortcut menu The object s name eld opens 2 Edit the existing object name or enter a new name Press Enter or select another object to record your changes 26 22 Publishing Your Site C U S T O M I Z I N G Y O U R D I R E C T O R Y S T R U C T U R E You can rename auto generated folders and les NetObjects Fusion remembers the ne
371. ragraph formats Text styles are a convenient way to specify replicate and update paragraph formatting 1 In Page view if the text box in which you want to apply Text styles is not a text editor choose the Selection tool and double click in the text box 2 Click anywhere in the paragraph you want to format Select multiple consecutive paragraphs if you want to apply the style to multiple paragraphs 3 In the Paragraph section on the Text Properties palette select the appropriate text style from the Style drop down list Formatting Text and Paragraphs Text normally assumes the font assigned to it by a browser but NetObjects Fusion lets you assign unique fonts to your text If the speci ed font is installed on the site visitor s system HTML 3 x compatible browsers display it If the font is not installed the browser checks a substitution table before using its default font You can nd the substitution table in NetObjects System fontmap txt and edit it with any text editor The Text Properties palette contains the options you can use for formatting selected characters and whole paragraphs when you want speci c formatting for one time use For repeated formatting of paragraphs use a text style as explained in Applying Text Styles on page 8 6 F O R M A T T I N G T E X T A N D P A R A G R A P H S Designing with Text 8 7 Note You can format selected characters only in text boxes or table cells On a stacked
372. rame you select 5 Click Link NetObjects Fusion creates the link When your site visitor clicks the linked item the browser displays the destination page or the selected anchor Adding an Anchor An anchor marks a speci c location on a page Anchors are useful on long pages so site visitors can go directly to a particular part of the page instead of scrolling and searching for information Name of page to link to List of all pages in the site Click to display anchors on the current page Anchors on the selected or current page See Targeting Links in AutoFrames on page 24 2 14 6 Creating Links and Anchors W O R K I N G W I T H L I N K S You can place an anchor anywhere in a text object or table or on a picture or drawn shape You can link to an anchor from anywhere for more information see Creating an Internal Link on page 14 3 When a site visitor clicks the link the browser displays the page containing the anchor beginning at the location of the anchor To add an anchor 1 In Page view click to place the insertion point within a line of text or select an image or drawn shape Make sure you place the insertion point within the text rather than selecting text If you select text the Anchor button is not accessible 2 In the Properties palette for the selected object click the Anchor button The Add Anchor dialog appears The Anchors on Page section shows existing anchors on the sel
373. rameters 21 12 21 14 specifying targets 21 9 specifying trigger events 21 7 suppressing 21 26 targeting MasterBorder or Layout 21 15 targets 21 3 trigger events 21 3 ActiveX controls 16 5 16 7 Add navigation buttons stacked pages 20 21 adding alt tags 4 10 anchors 14 5 AutoFrames 6 13 banners 13 9 button navigation bars 13 3 check boxes 17 9 combo boxes 17 10 custom HTML and scripts to AutoFrames 24 13 DynaButtons component 18 2 18 5 le assets 25 4 form objects 17 4 framesets 23 4 guides 4 4 hidden elds in forms 17 19 HTML 22 2 HTML horizontal rules 11 6 HTML to links 14 12 HTML to objects 22 6 HTML scripts to Layout 7 11 JavaScript to links 14 12 links 25 10 Message Board component 18 8 18 11 NetObjects Fusion components 18 18 18 20 objects to Layout Regions 7 15 objects to table cells 10 6 pages 2 12 Picture Loader component 18 15 Picture Rollover component 18 11 18 13 pictures 10 3 10 5 radio buttons 17 8 Reset button forms 17 12 Rotating Picture component 18 16 18 17 scripts 22 2 scroll bars to frames 6 17 server pro les 26 11 26 14 Site Mapper component 18 6 18 8 SiteStyle lines 11 7 SiteStyles 12 14 12 15 sounds to background 7 12 Submit button forms 17 12 tables 10 3 text to pictures 10 12 text to shapes 11 4 text to table cells 10 6 text with drag and drop 8 5 text with Text tool 8 4 Ticker Tape component 18 5 18 6 Time Based Picture component 18 13 18 14 variables 25 12 see also
374. rawing a selection box around them The selected objects size to match the largest object you select 2 From the Objects menu choose Size Objects Width to make two objects the same width From the Objects menu choose Size Objects Height to make two objects the same height Using the Standard Toolbar Standard objects such as text pictures tables forms and so on are the basic building blocks of any site Text tool Use the Text tool to add text to your pages See Chapter 8 Designing with Text for information Picture tool Use the Picture tool to add pictures to your pages See Chapter 10 Placing Pictures for information Rectangle Hotspot tool Use the tools in the Hotspot tools group to create imagemaps See Creating an Imagemap on page 14 13 for information 4 16 Page View Basics U S I N G T H E A D V A N C E D T O O L B A R Layout Region tool Use the Layout Region tool to add Layout Regions to your pages See Using Layout Regions on page 7 14 for information Table tool Use the Table tool to place tables on your pages See Chapter 9 Adding Tables for information Form Area tool Use the Form Area tool to add a form container to your page See Chapter 17 Designing and Implementing Forms for information Navigation Bar tool Use the Navigation Bar tool to add navigation bars to a page See Chapter 13 Creating Navigation Bars and Banners for informati
375. reate frames directly in HTML If you know the HTML used to create frames you can create custom frames in NetObjects Fusion just as you create frames in an HTML editor This chapter describes how to script a simple frameset For information on other uses of NetObjects Fusion s HTML access feature see Chapter 22 Working with HTML Directly Note You must know HTML frame coding to script frames in NetObjects Fusion If you need background information see the resources at www newbie net frames U N D E R S T A N D I N G F R A M E S Creating Custom HTML Framesets and Frames 23 3 The Frame Scripting Process To script frames in NetObjects Fusion follow this process 1 Determine how and where you want to use frames in your site as described in Planning Your Use of Frames on page 23 3 2 Create a frameset page and de ne the appearance and function of the frames within it See De ning a Frameset on page 23 4 3 Add non frame content for site visitors using older browsers that don t support frames See Adding Content for Frameless Browsers on page 23 10 4 Create the content pages that will be displayed in the frames See Creating Frame Content on page 23 6 5 De ne links and determine frame targeting See Scripting and Targeting Links on page 23 7 The rest of this section covers these tasks in more detail Planning Your Use of Frames Begin your frame scripting efforts
376. ree R E A R R A N G I N G L A Y E R E D O B J E C T S Page View Basics 4 13 The Object Tree appears 2 Click an object in the Object Tree to locate it on the page Selection handles appear around the object on the page 3 To rename the object select the name of the object and type a new name Rearranging Layered Objects You can rearrange the layering of objects using commands on the Object menu or by moving the object in the Object Tree 1 In Page view open the Object Tree and click the object you want to move Handles appear around the object on the page 2 Click and drag the object up or down the tree to move it to a different layer or from the Object menu choose Arrange Objects and G Select Bring to Front to bring the object to the top of the layer G Select Bring Forward to bring the object up one layer G Select Send to Back to send the object to the bottom layer G Select Send Backward to send the object down one layer 4 14 Page View Basics A L I G N I N G A N D D I S T R I B U T I N G O B J E C T S Aligning and Distributing Objects In a Layout or Layout Region you can align two or more objects to each other and distribute three or more objects equidistant from each other Or you can align and distribute objects relative to the Layout or Layout Region 1 In Page view select the objects you want to align by Shift Clicking each one The Multi Object Palette appears 2 If y
377. references on page 1 12 Top margin Left margin Right margin Bottom margin W O R K I N G W I T H M A S T E R B O R D E R S Managing MasterBorders and AutoFrames 6 3 Working with MasterBorders When you create a new site NetObjects Fusion automatically creates a default MasterBorder The default MasterBorder for a new blank site contains three navigation aids a banner showing the page name at the top a graphical navigation button bar on the left and a text navigation bar on the bottom These objects are included in the MasterBorder of the Blank Site template For information on the Blank Site template new sites and how to use templates see Chapter 2 Creating and Managing Sites and Chapter 3 Importing and Exporting When you import a template or create a new site based on a template the new pages bring their MasterBorders and names with them from the source site The Edit MasterBorder List dialog identi es imported MasterBorders You can rename or delete imported MasterBorders To display the Edit MasterBorder List dialog click Add Edit in the Masterborder Properties palette When you create a new site based on the template Import nft the default MasterBorder has a zero top left and right margin and the bottom margin is 50 pixels Unless you change the default MasterBorder new pages you create in the site will also have these margin sizes Modifying and Creating MasterBorders You can modify a si
378. ress is valid Managing Data Objects Data objects are collections of elds of data You can use a data object to publish data without using CGI scripts or database programming For information about data objects including how to create them in Assets view see Chapter 20 Data Publishing When you click the Data Objects tab NetObjects Fusion displays a list of all the data objects used in your site You can edit the name and eld names of an internal data object and add new elds See Changing an Internal Data Field Name on page 20 10 For an external data object you can change Simple elds to Image elds and vice versa but you cannot edit eld names or add new elds because these items depend on data in the external data le Managing Variables Text variables make it easy to update text that appears throughout your site User de ned variables are displayed in Assets Variables view so you can edit create or delete them NetObjects Fusion also provides standard variables such as the date and time the site was created or last modi ed but these are not displayed in Assets Variables view Adding a Variable 1 In Assets Variables view from the Assets menu choose New User De ned Variable or click New in the control bar M A N A G I N G V A R I A B L E S Managing Assets 25 13 The New Variable dialog appears 2 Enter a name and value for your variable and click OK Editing a Variab
379. ributes or comments to the HTML 1 In Page view double click in the text box to get an insertion point 2 From the Text menu select Insert HTML The Insert HTML dialog appears C O D I N G Y O U R O W N O B J E C T S Working with HTML Directly 22 11 3 Enter your HTML or script 4 Click OK HTML Tag icon Preview the page to test your code and view the source from your browser to see the resulting HTML Coding Your Own Objects You can create an object such as a Java applet or a table you want to code yourself by entering HTML or script in an empty text box 1 In Page view draw a text box where you want the object to go The box marks the object s position when you publish but it can grow vertically or horizontally depending on the object To approximate the published size in your Layout area select Lock Size on the object s Properties palette 2 From the Text menu select Insert HTML The Insert HTML dialog appears 3 Enter the HTML or script is inserted where you clicked in the text box in the published HTML What you type or paste here For lt BLINK gt SPECIAL DEALS lt BLINK gt click here This symbol in a text box marks inserted code You can double click it to reopen the Insert HTML dialog to view or edit the code 22 12 Working with HTML Directly C O D I N G Y O U R O W N O B J E C T S 4 Click OK Preview the page to test your code and view the source f
380. riginal Size G Select Normal in the Picture Properties palette M O D I F Y I N G A P I C T U R E Placing Pictures 10 7 Cropping a Picture You can crop a picture to make only a part of it visible When you crop a picture NetObjects Fusion creates a new image le that contains just the visible portion of the image It does not change your original image le 1 In Page view select the picture you want to crop The Picture Properties palette appears 2 In the Display area on the Picture Properties palette select Normal When Normal is selected you cannot make a picture larger than its original size 3 Drag the lower right handle reducing the size of the box to crop the picture To crop proportionally hold down Ctrl as you drag Tiling a Picture You can create multiple instances of the picture within the box by tiling it When you tile a picture NetObjects Fusion creates a new image le that contains the tiled image It does not change your original image le 1 In Page view select the picture you want to tile The Picture Properties palette appears 10 8 Placing Pictures M O D I F Y I N G A P I C T U R E 2 In the Display section of the Picture Properties palette select Tile NetObjects Fusion displays multiple images of the picture in the box The images are the size of the picture as it is in the source le 3 Drag any handle to display more or fewer tiled images Rotating a Pi
381. rivers for your application use the ISAM driver which is faster In addition selecting an ISAM driver takes fewer steps NetObjects Fusion automatically imports all the elds available in the external database le By default it imports all external elds as simple text or formatted text To import pictures referenced in an external le s eld as image le paths change that eld s type to Image Note NetObjects Fusion components that support dynamic data publishing are available Visit www netobjects com for information Creating an External Data Object from a Desktop Database This section describes how you draw data from desktop databases such as Microsoft Access Paradox dBASE Microsoft Pro Microsoft Excel or from delimited text les Your system must include an ISAM driver appropriate for your source ISAM drivers are automatically installed with most desktop databases To create an external data object from a desktop database 1 Do any of the following 20 12 Data Publishing C R E A T I N G A D A T A O B J E C T New External Data Source tool G In Page view select the New External Data Source tool from the Advanced toolbar and draw a rectangle on the page Data List tool G In Page view select the Data List tool from the Advanced toolbar and draw a rectangle on the page The Data Publishing dialog appears Click the New button The Data Object dialog appears Select External and then cli
382. rks Everywhere A major challenge when building sites today is overcoming browser disparity problems If you use the wrong site building tool you can waste time and energy building and maintaining several versions of a site each one targeting a different browser When you use NetObjects Fusion 3 0 these problems disappear You can depend on the NetObjects Fusion 3 0 HTML generation capability to provide Everywhere HTML Whether you re designing for a 2 0 browser or for the latest DHTML capable browser NetObjects Fusion 3 0 generates HTML that works For N E T O B J E C T S F U S I O N V I E W S NetObjects Fusion Basics 1 3 information about the publishing options available in NetObjects Fusion 3 0 see Chapter 5 Planning Your Site Add Dynamic Content NetObjects Fusion 3 0 makes it easy for you to add dynamic content to your site whether you want simple object animation or custom JavaScript actions You can have objects y across the screen as the result of a site visitor s action Or you can launch a sequence of animations at any given time You can also reduce your visitors download time by having text graphics or other objects appear as needed NetObjects Fusion 3 0 contains powerful message based animation and interactive authoring capabilities that you can use to achieve these effects For complete information see Chapter 21 Building Dynamic Pages NetObjects Fusion Views NetObjects Fusion provide
383. rnal page select the page to be linked from the Page Name list To target a speci c anchor on that page select it from the Select Anchor drop down list If you re linking to an anchor location on the current page select Current Page and choose an anchor from the Select Anchor drop down list 4 Choose the target frame in which you want to display the linked information from the Select Frame Target drop down list 5 Click Link to close the dialog and create the link T A R G E T I N G L I N K S I N A U T O F R A M E S Working with AutoFrames 24 5 6 Preview or publish locally and test your targeted links See Chapter 22 Working with HTML Directly for information on scripting techniques and requirements Targeting a Smart Link to Internal Pages 1 In Page view select the object or text that you want to link The object s Properties palette appears 2 Click the Link button The Internal Link tab of the Link dialog is displayed 3 Select the Smart Link tab 4 Select the Smart Link you want from the Link Types list 5 Select the targeted AutoFrame from the Select Frame Target drop down list 6 Click Link to close the dialog and create the link 7 Preview or publish locally and test your targeted links Targeting a Link to External Pages 1 In Page view select the object or text that you want to link 24 6 Working with AutoFrames T A R G E T I N G L I N K S I N A U T O F R A
384. rom an HTML based site is described in Importing an Existing Site on page 3 7 Creating a Site from a Template AutoSite templates provided by NetObjects Fusion provide a complete site structure with predesigned pages and suggested content You can also use templates that you or your colleagues create or templates created in previous versions of NetObjects Fusion If a template contains a data object NetObjects Fusion stores its image elds only as path names to the image les Therefore if you create a new site from a template created on your computer the image elds on stacked pages will still display the C R E A T I N G N E W S I T E S Importing and Exporting 3 5 image but if you move the template to another computer and create a new site from it the image elds will be empty To create a new site based on an AutoSite or other template 1 If your preferences are set to display the Welcome dialog when the program opens a Open NetObjects Fusion The Welcome to NetObjects Fusion dialog appears b Select From AutoSite or Template nft in the Create a New Site section of the dialog and click OK If NetObjects Fusion is already running select New Site From Template from the File menu of any view The Select a Template File dialog appears with the AutoSites folder shown by default 3 6 Importing and Exporting C R E A T I N G N E W S I T E S 2 Navigate to the folder containing the templa
385. rom your browser to see the resulting HTML If necessary go back and adjust the box s position in Page view to get the actual spacing you want What you type or paste here is nested in a cell of the HTML table NetObjects Fusion generates C H A P T E R 2 3 Creating Custom HTML Framesets and Frames 23 1 Creating Custom HTML Framesets and Frames 23 Chapter 22 Working with HTML Directly described how to use NetObjects Fusion s HTML access feature to add custom HTML and scripts to pages and objects This chapter describes how to use the Page HTML dialog to create custom HTML frames entirely from scripts Understanding the differences between custom HTML frames and AutoFrames can help you choose which to use It s easier to create frames using AutoFrames and you can customize them with custom HTML or scripts You can also create the frameset page in another HTML editor such as Allaire s HomeSite and then reference the frameset page as an External HTML page This way NetObjects Fusion manages the frameset page as an asset and you can create the frameset s content pages as regular pages in NetObjects Fusion See Chapter 19 Referencing and Editing External HTML for information about referencing external pages Although these tools help you create framed pages to meet most of your needs on some occasions you may want to create custom frames using NetObjects Fusion s HTML access feature This chapter starts
386. rs 2 Select Text box is a form 3 Click Settings to enter your form processing settings for this text box in the Form Settings dialog 7 30 Laying Out the Page U S I N G T A B L E S F O R P A G E L A Y O U T See Chapter 17 Designing and Implementing Forms for information on creating forms and determining form processing settings Making Text Boxes Dynamic You can make text boxes dynamic by adding actions to them For example you can make a text box display a transition effect such as Wipe or Peek when the site visitor s mouse pointer passes over it or make the text box y in to its proper location when the page nishes loading in the visitor s browser You can also make a text box the target of an action assigned to another object See Building Dynamic Pages on page 21 1 for a discussion on making pages and objects dynamic and the procedures for adding actions to text boxes You can also add actions to a text link contained within a text box See Assigning an Action to a Text Link on page 21 17 for information Using Tables for Page Layout If your page design or page content is tabular you can use a NetObjects Fusion table to control the layout of the entire page Each cell within the table is a text box with all the attributes and controls of a text box outside the table You can embed any objects within the cell arrange them using each object s alignment properties and wrap text aro
387. rs You can contact your Internet service provider to nd out if CHMOD is implemented on the server To add a Message Board and set its properties Site visitors can select how to display messages 18 10 Using NetObjects Fusion Components A D D I N G A M E S S A G E B O A R D Message Board tool 1 In Page view select the Message Board tool from the Component toolbar 2 Draw a box on the page to indicate where you want to place the Message Board The Message Board button appears on the page and the Message Board Properties palette appears 3 To specify where Message Board les are stored double click the Subdirectory row type the new location in the Message Board eld and click the check mark The default is BBS NetObjects Fusion creates the directory in your site s base directory which is the directory where you want to publish the site 4 To specify the title that appears in the title bar of the Message Board window double click the Page Title row type the title and click the check mark The Page Title cannot include a single quote 5 To select the operating system platform on which the server is running click the Publish to row then select the platform from the drop down list This option determines if the Perl5 CGI script or NT CGI binaries are uploaded to the server A D D I N G P I C T U R E S T H A T R O L L O V E R Using NetObjects Fusion Components 18 11 Note If you are pu
388. rs 16 3 Java les 16 2 Java servlets 16 2 16 4 JavaScript adding to links 14 12 JavaScript expressions 21 23 Joint Photographic Experts Group see JPEG les JPEG les 10 2 JScript 5 3 publishing 5 5 L Last button 1 8 launching HTML editors 1 18 image editors 1 18 Layers see CSS and Layers Layout 4 2 Layout area referencing 19 4 layout methods and design priorities 7 34 layout options 7 1 Layout Regions 7 14 7 21 adding objects 7 15 advantages in page layout 7 33 assigning actions 7 20 background color setting 7 20 creating 7 15 de ned 7 14 de ning as forms 7 19 forms minimizing HTML 17 4 grids and guides 7 16 HTML output methods 7 17 limitations in page layout 7 33 making dynamic 7 20 multiple 7 19 Picture background 7 20 setting background properties 7 19 Solid Color background 7 20 table formatting preferences 7 18 transparent 7 20 Layouts 4 2 adding HTML scripts 7 11 advantages in page layout 7 32 appearance 7 2 as forms 17 3 assigning actions 7 13 background color setting 7 11 background sounds 7 12 Index 8 browser page size 7 6 creating 7 2 de ned 7 2 de ning as forms 7 10 external HTML 19 9 tting to objects 7 7 HTML output methods 7 8 limitations in page layout 7 32 making dynamic 7 13 multiple 7 3 naming 7 3 naming requirements 7 4 Picture background 7 12 renaming 7 4 resizing 4 3 7 5 7 7 selecting 7 2 selecting method 7 31 setting background properties 7 11 SiteStyle b
389. rt a Tab character in a text box for example to indent the rst line of a paragraph You can only indent a whole paragraph While you are editing a paragraph Tab and Shift Tab are keyboard shortcuts for indenting and unindenting the paragraph To format a paragraph 1 In Page view click in the paragraph you want to format 2 In the Paragraph section of the Text Properties palette click the appropriate alignment button to align the paragraph 3 To indent the paragraph click one of the indent buttons 4 To use a color other than the SiteStyle color for the paragraph click Color and select a color from the Color Picker 5 To create a simple numbered or bulleted list select an option from the Bullet drop down list 6 To start a numbered list with a value other than 1 or A click Start Value enter a number in the Start value eld in the Start Value of Numbered List dialog then click OK Creating Multi Leveled Numbered and Bulleted Lists You can create a bulleted or numbered list with multiple levels For example you can create a bulleted list that contains subordinate bullets G This is an example of a level 1 bullet This is an example of a level 2 bullet This is an example of a level 3 bullet You can also create a numbered list that has subordinate paragraphs within the list G This is an example of the rst level in a multi level numbered list This is an example of the second leve
390. rt a site that was built using HTML frames NetObjects Fusion imports the frameset s content pages as regular pages and references the original frameset page as an external HTML page G Be prepared to perform some cleanup on an imported and converted site Adjust font size and style if needed and add NetObjects Fusion navigation bars and banners as appropriate to your design If a page does not import the way you expect check the original source le for incorrect HTML code or data Creating a New Site from an Existing Site 1 To use an existing site s MasterBorder when building the new site open the existing site rst 2 From the File menu choose New Site From Local Import or From Remote Import G Select From Local Import to import a site located on your hard disk or network drive The Import Local Web Site dialog appears G Select From Remote Import to import a site stored in a remote location such as an intranet server or the World Wide Web 3 10 Importing and Exporting C R E A T I N G N E W S I T E S The Import Remote Web Site dialog appears 3 Enter the exact le location and path to the top level page you want to import G To specify a local site enter the full drive and path to the local site s top level source page in the Home page eld or click Browse A le Open dialog appears Navigate to and select the appropriate top level page and click OK G To specify a remote site enter th
391. s on page 12 1 G A template le TemplateName nft that includes the source site s structure page layouts and references to the site s assets Templates can contain a single page a site section or an entire site NetObjects Fusion comes with a variety of site and page templates see Templates Included with NetObjects Fusion on page 3 2 for information You can open a template to create a new site NetObjects Fusion includes several templates that provide the basic structure for common types of sites See Creating New Sites on page 3 4 for information You can import any NetObjects Fusion or custom templates into your current site to expand its structure or content To ensure consistency with the current site all imported pages sections and sites take on the SiteStyle of the current site See Expanding Your Site on page 3 11 for information You can also export your current site into template format so you can move or distribute it See Exporting a Site on page 3 17 for information When you add a new blank page to your site the appearance and content of that page is set by the default Blank Site template To change the default appearance of new blank pages you can modify the Blank Site template See Changing an Existing Template on page 3 18 for details Templates Included with NetObjects Fusion NetObjects Fusion includes three types of templates that you can use as a starting point for you
392. s ve views that correspond to the tasks you complete when you design and build a Web site Changes you make in one view are re ected in the other views You can go to any view at any time by clicking one of the view buttons on the control bar at the top of the NetObjects Fusion window G Start with Site view to create the hierarchical structure of a new site or to import an existing site You can see a structure map of your site which is a graphical view that shows how the pages relate to each other or an outline view that is similar to the Windows Explorer You can quickly rearrange your site by dragging and dropping pages and sections For complete information about working in Site view see Chapter 2 Creating and Managing Sites G Use Page view to design pages and add content In Page view you see the MasterBorder and Layout area of each page The MasterBorder contains objects that repeat on a set of pages much as headers and footers appear in a word processing document The Layout area displays objects that are unique to that page In Page view you can use the Undo command on the Edit menu repeatedly to step back through a series of changes 1 4 NetObjects Fusion Basics U S I N G T H E N E W B U T T O N Note If you try to use Undo and nothing happens click in the Layout area or MasterBorder and then select Undo again For information about working in Page view see Chapter 4 Page View Basics G A SiteStyle con
393. s You can save those sections or pages as templates and then incorporate them anywhere in your site with a few mouse clicks When you import templates follow these guidelines G Before you import select the location where you want to append the imported section The imported site page or section becomes a child of the selected page You can move pages as needed once they are imported G When you import a site or multi page template you are in effect adding a section to your site See Working with Sections on page 2 9 for information G All imported pages take on the SiteStyle of the current site For example if several authors separately develop parts of a site export their work as templates and import the templates into a single master site for publishing the master site s SiteStyle ensures that the compiled site has a consistent look and feel See Chapter 12 Using SiteStyles for more information G When NetObjects Fusion imports a template it renames the template s MasterBorders by pre xing them with Imported and adds them to the current site s library of MasterBorders For example if the template has a MasterBorder named NoFrames it is renamed and stored with the current site as ImportedNoFrames You can rename manipulate or delete these extra MasterBorders as appropriate See Modifying and Creating MasterBorders on page 6 3 for information G Every template begins with a single root page whic
394. s or nothing at all as they type G Visible length Enter a number de ning the text eld s width in characters Text eld width measured in characters Maximum number of characters that can be entered in the eld Select to hide the site visitor s typing Type text to appear in the eld by default Argument passed to the script processing the form A D D I N G O B J E C T S T O A F O R M Designing and Implementing Forms 17 7 G Max length Enter a number de ning how many characters can be entered in the eld When typing exceeds the eld s width text scrolls up to this number of characters 4 To label the eld use the Text tool on the Standard toolbar to insert text next to it Adding a Multiple Line Text Field To provide a place for long comments or descriptions you can add a multiple line text eld Site visitors can type as much as they want and text scrolls as necessary After creating the form as described on page 17 2 Multi Line tool 1 In Page view select the Forms Multi Line tool from the Form toolbar 2 Draw a rectangle on the form 3 On the Forms Multi Line Properties palette de ne the eld s height content and name passed to the script processing the form G Name Type the argument for this eld that s passed to the CGI script processing the form Ask your Web administrator or ISP if you re not sure what s required here If you re using the
395. s 21 8 pages adding 2 12 centering content 22 4 child 2 7 containing le assets displaying 25 6 containing links displaying 25 10 default size 4 3 deleting 2 13 displaying in Page view 4 2 displaying previous 1 8 dynamic 21 2 dynamic building 21 5 exporting 3 17 3 21 external targeting links 24 5 importing 3 4 3 16 importing HTML 4 6 importing exporting 3 1 indexing for search engines 22 4 internal targeting links 24 4 internal targeting smart links 24 5 moving 2 13 navigating 4 5 optimizing object placement 5 8 page properties 2 9 parent 2 7 previewing 5 9 referencing Layout area 19 4 renaming 2 14 resizing 4 3 selected 2 7 selecting 2 8 sibling 2 7 transition creating 22 6 zooming on 4 9 see also stacked pages paragraph styles see text styles paragraphs formatting 8 6 8 9 indenting 8 8 parameters customizing 21 13 Java les 16 3 parameters actions 21 12 21 14 Parent Page button 4 5 parent pages 2 7 Parent Setting HTML output option 7 17 passwords forms 17 6 pasting text from Clipboard 8 5 paths framesets 23 5 paths relative 23 5 Perl5 CGI script 18 10 permission publishing 26 19 I N D E X Index 11 Picture background Layout Regions 7 20 Picture background Layouts 7 12 Picture Loader component 18 15 Picture Rollover component 18 11 18 13 browser requirements 18 11 restriction on Preview 18 11 pictures adding 10 3 10 5 adding text 10 12 adding to stacked pages 20 26 changing in
396. s 6 4 pictures 10 6 10 13 server pro les 26 11 26 14 table cell properties 10 6 table cell text box properties 10 7 tables 10 6 text styles 8 12 text styles by example 8 12 see also changing customizing editing mouse driven events 21 8 MOV les 15 7 moving between pages 4 5 les 3 21 guides 4 4 objects 4 9 pictures 10 11 sites 3 21 moving pages 2 13 Moving Pictures Experts Group les 15 9 moving sites restrictions explained 3 17 3 21 MPE MPV les 15 9 MPG MPEG les 15 9 mporting pages 3 1 Multi Object Palette 4 14 multiple forms on Layout or MasterBorder 7 10 multiple Layout Regions 7 19 multiple Layouts 7 3 N names assets custom 25 5 naming form objects 17 5 Layouts 7 3 pages 2 14 sites 2 4 3 6 naming requirements for Layouts 7 4 navigating between pages 4 5 navigation bars 13 2 actions 13 3 customizing 13 11 editing 12 9 primary and secondary 13 6 reverting to SiteStyle 13 15 setting background color 13 8 setting button spacing 13 7 setting display options 13 4 setting type 13 6 using 13 3 13 8 see also button navigation bars text navigation bars Navigation Button Custom Names dialog 2 16 navigation buttons stacked pages 20 25 navigation controls see banners button navigation bars text navigation bars navigation tools 1 7 Navigation Window button 4 5 nested tables 5 3 optimizing 5 7 5 13 publishing 5 4 Nested Tables HTML output option 7 9 7 17 26 7 NetObjects Web addr
397. s HTML See Editing Referenced HTML on page 19 13 R E F E R E N C I N G H T M L A S A N O B J E C T Referencing and Editing External HTML 19 7 To reference HTML as an object External HTML tool 1 In Page view select the External HTML tool from the Advanced toolbar 2 Draw a box where you want the referenced content to appear Put the box in the Layout area to publish the content on one page or in the MasterBorder to publish it in the border of several pages The Reference HTML dialog appears 3 Click Browse The Open dialog appears 4 Select the external le you want to reference and click Open to return to the Reference HTML dialog 5 Choose whether to import the referenced le s lt HEAD gt content and manage external assets G Import lt HEAD gt Select this to publish the external HTML le s lt HEAD gt content Choose Append to Current lt HEAD gt to add external lt HEAD gt content to what NetObjects Fusion generates and what you import from other external objects on the page Or choose Replace Current lt HEAD gt to publish only this external le s lt HEAD gt content Caution Don t select Replace Current lt HEAD gt if the page contains actions or is being published using the CSS and Layers HTML output option NetObjects Fusion generates lt HEAD gt content these options require This le s lt BODY gt is published in the table cell NetObjects Fusion generat
398. s as the output option See Creating Overlapping Objects on page 4 12 for information Warning icon 4 20 Page View Basics I N T E R P R E T I N G T H E W A R N I N G I C O N C H A P T E R 5 Planning Your Site 5 1 Planning Your Site 5 The default settings for NetObjects Fusion generate ef cient HTML that faithfully reproduces your visual design on the published page The design of your text content however is subject to the browser settings of each site visitor Preserving Your Design Intentions on page 5 2 describes potential variations that can happen in the site visitor s browser NetObjects Fusion offers several ways to control published output G You can manipulate the HTML output method used to generate your site NetObjects Fusion supports three output methods each of which provides unique bene ts in selected circumstances Selecting HTML Output on page 5 3 describes these methods and their use G You can control the table formatting priority horizontal or vertical used to generate the page This helps preserve your design intentions when a browser s font settings change the size of your text Optimizing Nested Tables Output on page 5 7 describes the table format setting G You can select from four different types of page containers each with different characteristics to serve as your page layout medium Chapter 7 Laying Out the Page describes these containers and their use
399. s in page layout 7 31 locking minimum size 5 12 5 13 making dynamic 7 30 maximizing automatically 5 12 5 13 minimum height 7 22 modifying properties in table cells 10 7 properties 8 5 scaling to browser window 7 23 scaling to Layout 7 23 selecting in table cells 10 5 sizing 7 21 7 24 solid handles 8 3 transparent handles 8 2 using 7 21 7 30 wrapping to browser window 5 12 5 13 text elds formatted 20 9 multiple line adding 17 7 simple 20 9 see also variables text les submitting data 17 14 text line spacing in browsers 5 3 text links assigning actions 21 17 text navigation bar 13 2 text navigation bars 13 2 13 3 default location 13 2 see also navigation bars text styles applying 8 6 creating 8 9 modifying 8 12 modifying by example 8 12 text based forms 17 2 text based Layout 7 1 thumbnail 10 3 Ticker Tape component 18 5 18 6 tiling pictures 10 7 Time Based Picture component 18 13 18 14 restriction on Preview 18 13 title bar 1 5 illustrated 1 4 toolbars 1 6 4 2 Advanced 4 16 Components 4 17 youts 1 6 Form 4 18 hiding showing 1 6 illustrated 1 4 Standard 4 15 tools Data List 20 7 Form Handler tool 17 14 Forms Button tool 17 13 Forms Checkbox tool 17 9 Forms Combo Box tool 17 11 Forms Edit Field tool 17 6 Forms Multi Line tool 17 7 media 15 2 New External Data Source 20 7 Radio Button tool 17 8 Site 2 8 Zoom In Out 2 11 4 9 trademark symbol inserting in text 8 13 transition pages creating 22
400. s of NetObjects Fusion do not include the style and you must manually copy the style to your Styles folder to use it For more information on transferring SiteStyles see Chapter 10 Upgrading From a Previous Version of NetObjects Fusion in Getting Started Adding a SiteStyle You can add a style from any NetObjects Fusion style folder on your hard drive CD ROM or LAN The Add Style to List command on the Style menu makes a complete copy of the added style s folder in the Styles folder in your NetObjects Fusion 3 0 folder For information about these folders see Styles Folder Structure on page 12 16 Note When you add a style it appears in the list of styles for the current site only If you want that style to appear in the style list of every new site you create see Changing an Existing Template on page 3 18 M A N A G I N G S I T E S T Y L E S Using SiteStyles 12 15 To add a SiteStyle to the style list 1 In Style view from the Style menu choose Add Style to List The Open dialog appears 2 Navigate to the style folder of the style you want to import and select its ssf le 3 Click Open NetObjects Fusion adds the style name to the style list Adding All Available SiteStyles To synchronize your style list with the styles in your Styles folder N In Style view from the Style menu choose Update Styles List NetObjects Fusion updates the Style list of the active site to match the c
401. s pane and a check in the Read only option of the publication Properties dialog G Pages and assets have two published date properties that display the latest publication date in both the Last Remote Publish and Last Local Publish columns of the Contents pane The publish dates for pages are always displayed in red because NetObjects Fusion always publishes all pages of your site except those individually marked Don t publish If an asset was never published locally or remotely it displays Never Published in red in the appropriate column and has a check in the Needs Publishing option of the publication Properties dialog If an asset was changed since the last time it was published it displays the Last Published date in red and has a check in the Needs Publishing option of the 26 24 Publishing Your Site P U B L I S H I N G Y O U R S I T E Publication properties dialog If you select Publish changed assets only when you publish this site the assets with red dates are re published to the server Suppressing a Page or Asset from the Published Site You can also suppress publishing for a selected page or asset by setting its Don t publish property If you set this property NetObjects Fusion G Overrides any Needs Publishing or Publish changed assets setting for this page or asset G Displays a diagonal red slash mark through the page or le icon in Publish view and adds a D to its attribute column G Publis
402. s the Layout area of a page from Page view and incorporate the le s lt HEAD gt content for example to include existing Meta tag keywords or JavaScript de nitions 1 Create a page in Site view 2 In Page view from the File menu choose Reference HTML The Reference HTML dialog appears 3 Click Browse The Open dialog appears 4 Select the external le you want to reference and click Open to return to the Reference HTML dialog 5 Choose whether to import the referenced le s lt HEAD gt content and manage external assets R E F E R E N C I N G H T M L F R O M P A G E V I E W Referencing and Editing External HTML 19 5 G Import lt HEAD gt Select this option to publish the external HTML le s lt HEAD gt content Choose Append to Current lt HEAD gt to add external lt HEAD gt content to what NetObjects Fusion generates or choose Replace Current lt HEAD gt to publish only the external le s lt HEAD gt content Caution Don t select Replace Current lt HEAD gt if the page contains actions or is being published using the CSS and Layers HTML output option NetObjects Fusion generates lt HEAD gt content these options require G Do not manage or move assets If you select this option NetObjects Fusion doesn t copy any external assets into Assets view Do this if you prefer that path names in the published HTML not be edited from your native code However you then have to mana
403. s their new locations but might continue to auto generate folders needed to contain that page s assets Components and their related assets have a black lock image on their icons signifying that they cannot be renamed or rearranged C U S T O M I Z I N G Y O U R D I R E C T O R Y S T R U C T U R E Publishing Your Site 26 23 Viewing and Setting Publication Properties In addition to their other properties your site s folders pages and assets have publishing properties that indicate or control the way they are included in your published site Three of these publication properties are indicators of the publishing status for that folder page or asset G Folders pages and assets that were renamed or moved from their default location have a customized publication property Customized assets display a C in the Attributes column of the Contents pane and a check in the Customized option of the publication Properties dialog G Some folders pages and assets are marked read only Assets created by NetObjects Fusion components such as SiteMapper or MessageBoard Dependent Java class les that were added to the site s assets When you add a Java object and preview or publish your site NetObjects Fusion analyzes the object s class le to see if it calls for other class les if so those dependent class les are added as read only assets Read only assets display an R in the Attributes column of the Content
404. s title bar click the minimize button click the button again to restore the full display To completely hide the properties palette click its close box To show the palette again from the View menu select Palettes Properties Palette A check mark on the menu indicates that the palette is displayed About Toolbars When you rst open NetObjects Fusion the Standard toolbar is docked at the left side of the Site view window Additional toolbars are available in Page view You can move a toolbar by positioning the pointer over the double line at its top and dragging it anywhere in the window To dock the toolbar again double click its title bar or drag it to the left side or top of the window A small triangle in the lower right corner of a tool button indicates that the tool is one of a group To see the entire group point to the tool and hold down the left mouse button A yout containing the other tools in the group appears As you move the pointer over each tool a ToolTip identi es the tool group and the name of the speci c tool To select a tool from a yout position the pointer over the tool and release the mouse button The tool you select is displayed on the toolbar For example if you point to the Draw tool on the Page view Standard toolbar and hold down the left mouse button you can select the Rectangle Rounded Rectangle Ellipse or Polygon tool In Page view after you use a selected tool to create an object on t
405. see Adding File Assets on page 25 4 If you add Java objects to your pages using the Java tool NetObjects Fusion analyzes their class les and adds other class les referenced there If you listed special assets in the Java Object Properties palette NetObjects Fusion includes them as managed assets See Inserting a Java Applet or Servlet on page 16 2 for information G You can add a le link to a special asset and NetObjects Fusion manages and publishes the asset See Creating a File Link on page 14 11 for information G You can explicitly add any special asset to the Asset Manager and select Always publish le to ensure that NetObjects Fusion manages and publishes the asset For information see Adding File Assets on page 25 4 R E M O T E S E R V E R A C C E S S C H E C K L I S T Publishing Your Site 26 29 Managing Script Assets NetObjects Fusion does not analyze custom scripts that you add to pages MasterBorders or other objects If those scripts reference special assets they are not automatically included in the site s managed assets To have NetObjects Fusion manage and publish assets called in custom scripts you must create le links to those assets or explicitly add them to the Asset Manager Then right click the asset and choose Properties from the shortcut menu and select Always publish Remote Server Access Checklist Before you create a remote server pro le answer these que
406. select this option NetObjects Fusion doesn t copy external assets into Assets view Do this if you prefer that path names in the published HTML not be edited from your native code However you then have to manage images and other assets yourself See Publishing Unmanaged Assets on page 19 13 NetObjects Fusion references this le and child les in the domain you specify Display referenced HTML on pages with your site s MasterBorder or choose ZeroMargins to publish external content with its original look If you check here NetObjects Fusion doesn t edit path names in the published HTML but you have to manage images and other assets yourself You can limit how many les to reference or how deep into your external site to reference 19 4 Referencing and Editing External HTML R E F E R E N C I N G H T M L F R O M P A G E V I E W G Domain Name Enter the domain name of the site containing the HTML les you re referencing Be sure to include the entire name as in www netobjects com 6 Click OK Preview your site to see the referenced pages You can rename referenced pages in Site view just like you do other pages To keep track of what part of your site is externally referenced you might want to use the View tab on the Properties palette to assign a different color background to the icons of referenced pages Referencing HTML from Page View You can reference an external HTML le a
407. selecting sections 2 9 Selective Server component Fundere 18 18 20 2 server pro les 26 10 26 20 adding 26 11 26 14 de ning for local publishing 26 10 de ning for remote publishing 26 13 modifying 26 11 26 14 options 26 10 servers port and permission settings 26 19 proxy publishing with 26 27 server side imagemaps 14 13 Set Action dialog Object Tree 21 10 Target Browse 21 10 When eld 21 8 setting background color navigation bars 13 8 banner style 13 9 banner style orientation 13 10 button navigation bar display levels 13 5 button navigation bar style 13 7 Director properties 15 5 Flash le properties 15 5 frame background 6 18 frame properties 6 16 Home page le name 26 12 Layout background color 7 11 Layout background properties 7 11 Layout Region background color 7 20 Layout Region background properties 7 19 Layout Region s HTML output method 7 17 Layout s HTML output method 7 8 margins 1 16 navigation bar button spacing 13 7 navigation bar display options 13 4 navigation bar type 13 6 page name 13 9 preferences 1 12 publishing method for sites 26 8 publishing properties 26 23 Splash le properties 15 5 table formatting preferences for Layout Regions 7 18 table formatting preferences for Layouts 7 9 text box properties 8 5 units of measurement 1 15 settings backing up sites 1 17 shapes adding text 11 4 drawing 11 2 editing lines of polygons 11 3 varying curve of rounded rectangles
408. sets 25 3 25 9 links 25 9 25 12 referenced assets 19 9 19 11 script assets 26 29 SiteStyles 12 14 variables 25 12 margins default 1 16 setting 1 16 MasterBorder property sections 2 11 MasterBorders 4 2 6 2 6 9 applying to imported sites 3 10 3 16 applying to sections 6 8 AutoFrames 6 9 browser page size 7 6 changing 6 8 changing margins 4 3 6 5 converted from AutoFrames effect on HTML 22 3 creating 6 6 default in blank site 6 3 DefaultMasterBorder 6 4 6 6 defaults in import template 6 3 de ned 6 1 deleting 6 9 tting to objects 6 5 illustrated 6 2 imported 6 3 modifying 6 4 Properties palette 6 4 renaming 6 8 resizing 4 3 6 5 setting frame properties 6 16 ZeroMargins 6 2 6 9 maximizing text boxes 5 12 5 13 media les editing 15 17 replacing 15 17 sample 15 1 media plug in les inserting 15 14 15 16 media tools 15 2 menu bar 1 5 illustrated 1 4 Message Board component 18 8 18 11 Macintosh Web servers 18 11 restriction on Preview 18 9 Unix servers 18 11 messages custom creating 21 18 custom deleting 21 19 Hide all pro les 21 18 messages displaying on mouse click 22 8 I N D E X Index 9 Meta tag descriptions 22 4 Microsoft Audio Video Interleaved les 15 9 Microsoft Internet Explorer text line spacing 5 3 MIDI les 15 11 minimizing HTML le size forms 17 4 modifying actions 21 26 alt tags 4 10 background color tables 10 4 Layout Region grid and guides 7 16 MasterBorder
409. sets view See Adding File Assets on page 25 4 To place an image asset Picture tool 1 In Page view choose the Picture tool from the Standard toolbar and draw a box to specify where you want to place the picture on the page The Picture File Open dialog appears with the Folder tab on top 2 Click the Image Assets tab to see a list of current assets 3 Select the Show thumbnail image option to preview the picture before adding it to the page 4 Select the asset you want to place and click Open NetObjects Fusion places the image in its box and opens the Picture Properties palette You can replace all instances of this picture in your site using a single command in Assets view as described in Replacing File Assets on page 25 6 Show thumbnail image check box Image Assets tab E D I T I N G A P I C T U R E Placing Pictures 10 15 Editing a Picture In Page view or Asset view you can open a picture in the editor you have set up for the image s le type For information on how to set up this feature see Editing Objects and Assets on page 1 18 1 In Page view select the picture and from the Object menu choose Open Object NetObjects Fusion opens the picture in the editor you speci ed for the le type Edit and save the picture according to the editor s features 2 To see the changes in Page view right click the picture and choose Restore Original Size from the shortcut menu
410. sists of a variety of elements including navigation buttons banners lines and text color In Style view you can create your own SiteStyle or choose from more than 50 pre built SiteStyles to give your entire site a consistent look and feel For information about working with SiteStyles see Chapter 12 Using SiteStyles G Assets include the les links data objects and variables that you reference in your site Assets view gives you centralized control over all these referenced entities When you change an asset NetObjects Fusion updates every reference to that asset throughout the site For example if your company s logo changes you just replace the old logo le with the new one in Assets view and NetObjects Fusion automatically updates every page that displays the logo For information about working in Assets view see Chapter 25 Managing Assets G When you are ready to publish the completed site go to Publish view to con gure your le transfer settings generate the HTML for your site and transfer your site to a local or remote server For information about working in Publish view see Chapter 26 Publishing Your Site Using the New Button To create a new page in Site or Page view click the New button on the control bar In Style view you use this button to create a new SiteStyle in Assets view to create a new le link data object or variable and in Publish view to create a new folder NetO
411. sit the Coolmaps site at www coolmaps com for information Because the number of NetObjects Fusion components is constantly growing the NetObjects Web site at www netobjects com is a valuable resource for learning G When new components become available G The many ways to enhance your site with NetObjects Fusion components G How to develop your own NetObjects Fusion components using the CDK You can add a component to your site by G Dragging the component le nfx extension and any associated les and folders into the Components folder in the NetObjects Fusion folder G Using the NetObjects Fusion Components tool from the Component toolbar A D D I N G O T H E R N E T O B J E C T S F U S I O N C O M P O N E N T S Using NetObjects Fusion Components 18 19 To add a new or third party NetObjects Fusion component NetObjects Fusion Components tool 1 In Page view select the NetObjects Fusion Components tool from the Component toolbar 2 Draw a box on the page where you want to place the component The Installed Components dialog appears and displays a list of installed NetObjects Fusion Components 3 Click Add The Install Components dialog appears 18 20 Using NetObjects Fusion Components A D D I N G O T H E R N E T O B J E C T S F U S I O N C O M P O N E N T S 4 Select the component to add and click Open Components have the extension nfx or class You cannot add components that come with NetO
412. space for your site on the server G If you de ne publishing con guration settings for a site and then export that site as a template those settings travel with the template If you are sharing a template with colleagues who can use the same publishing settings you can save time by con guring the publishing settings in advance exporting them with a template and then distributing the template G If your site has been published and revised several times your publish location might contain les that are not needed in the current or nal version of the site Delete unused assets and clean out obsolete les from your published site folders before publishing a new version of a site See Chapter 25 Managing Assets for information Publishing with Firewalls or Proxy Servers If your remote server is behind a rewall or stored on a proxy server NetObjects Fusion cannot publish directly to the server If that s the case follow these steps 1 Publish your site to a local folder other than the Sitename Preview folder of your site Use whatever directory structure and publishing method you would normally The default setting Local Stage Server publishes to the folder Sitename Stage 2 Consult with your server administrator for the preferred method of transferring content to the remote server Potential methods include G Transferring the entire site structure of the locally published site to a holding location on an u
413. st to select one of the three types of quotation marks you can use in your site s text objects Curly Quotes is the default setting The site visitor s browser font settings control the appearance of these quotes in the browser 5 Click OK to set the selected HTML output type and formatting options De ning Server Pro les The last task in con guring your publishing settings is to de ne the local or remote server locations where you want to store the completed site You con gure these locations by modifying or creating server pro les which are stored with the rest of your publishing speci cations in the Sitename nod le Each server pro le has a name and a set of properties that de ne the local path name or the remote host connection settings that NetObjects Fusion uses to publish your site to that location and server You can select a server pro le or set its properties any time before you publish the site NetObjects Fusion includes two default server pro les G Local Stage Server which defaults to a local setting with the target directory of Sitename Publish G Remote Publish Server which defaults to a blank remote server pro le that you must ll out before publishing You can modify these default pro les create your own or delete unneeded pro les De ning a Server Pro le for Local Publishing 1 In Publish view click the Setup button on the control bar These are Straight Quotes
414. stions 1 Who is your service provider This is the ISP organization or department that is going to store your site on its server and provide your site visitors access to it The technical support staff of your service provider should be able to provide the answers to the rest of these questions ISPs and other service providers often offer technical support pages on their own Web sites that answer these questions 2 What is the name of your remote host This is the name of the server where you are going to store your site It might be the same as your domain name such as www yourname com a name assigned by the service provider such as inbox isp com or a speci c IP address a series of four numbers separated by periods My Remote Host ___________________________________________ 3 What is your base directory When you log onto your remote host you automatically begin in the home directory for your log in account This might not be the right place to put your site however For a variety of reasons you might need to store your site in a subdirectory of your home directory or in another directory altogether You must know the relative path from your account s home directory to the base directory where your site should be stored When NetObjects Fusion publishes your site and logs onto your service provider it stores 26 30 Publishing Your Site R E M O T E S E R V E R A C C E S S C H E C K L I S T your site s pag
415. structure rather than building a new site from scratch with it Be aware that importing a complex site might take more processing time than you expect If you created the site in NetObjects Fusion it is far more ef cient to import it as a template than to import the published HTML pages To expand your site by importing an existing site 1 In Site view select the page you want to serve as the parent of the imported and converted content 2 From the File menu choose Import Web Site From Local Import or From Remote Import G Select From Local Import if you want to import a site located on your hard disk or network drive E X P A N D I N G Y O U R S I T E Importing and Exporting 3 15 The Import Local Web Site dialog appears G Select From Remote Import to import a site stored in a remote location such as an intranet server or the World Wide Web The Import Remote Web Site dialog appears 3 Enter the exact le location and path to the top level page you want to import G To specify a local site enter the full drive and path to the local site s top level source page in the Home page eld or click Browse A le Open dialog appears Navigate to and select the appropriate top level page and click OK 3 16 Importing and Exporting E X P A N D I N G Y O U R S I T E G To specify a remote site enter the full URL to the site s top level source page in the Home Page URL eld To ensure accuracy nav
416. t you add or re ne the content pages or resources for each frame You can use all NetObjects Fusion tools that you would normally use for page and content development but consider these issues G The frames created by your frameset constrain the size of your content pages For example if you set frames to be unscrollable and then create a content page that s too big for the frame your site visitor won t be able to see the entire page Keep track of your frame dimensions and reset your Layout size to match S C R I P T I N G A N D T A R G E T I N G L I N K S Creating Custom HTML Framesets and Frames 23 7 G Arrange the hierarchy of your site to support your framed content For example if you want the frameset to be the sole access point for the pages in the frames organize the content pages as children of your frameset page This simpli es managing NetObjects Fusion s automatic navigation links G Links within scripted frames have special targeting requirements which are discussed in the next section Scripting and Targeting Links Targeting is the technique of specifying which frame a link is supposed to use to display its retrieved content When a site visitor clicks a link within a scripted frame the retrieved content can appear in one of three targeted locations G The frame that contains the link itself This is the default browser behavior but it s not usually the targeting behavior that you want G A default t
417. t an htm or html le from your hard disk CD ROM or LAN 4 Click Open NetObjects Fusion places the contents of the htm or html le on the current page beginning in the upper left corner of the Layout area Placing Objects You can use the tools on the four toolbars or drag and drop les onto the page to place objects To place an object using a tool 1 In Page view select the tool you want to use Double click the tool if you want to place multiple objects of the same type 2 Draw a box where you want to place the object on the page If you are placing a picture select from the Picture File Open dialog and click Open 4 8 Page View Basics P L A C I N G O B J E C T S The object appears on the page as well as the appropriate Properties palette For example if you place a picture the following appears 3 Set the properties of the object The tabs and options displayed on the Properties palette vary depending on the object you are placing See the appropriate chapter for information about setting properties for objects Dragging and Dropping Objects You can drag and drop text or Rich Text Format rtf les from Microsoft Explorer or a word processor 1 Locate and select the text or text le you want to place 2 Drag the text or le into the NetObjects Fusion application window and drop it on the page 3 Use the Properties palette to set the text s properties S E L E C T I N G
418. t as described in Creating a Data List on page 20 18 and lay out your stacked pages as described in Creating Stacked Pages on page 20 22 G If you re in Assets view take these additional steps a Switch to Page view Data List tool b Select the Data List tool from the Advanced toolbar and draw a rectangle on the page The Data Publishing dialog appears c Select the newly created data object from the drop down list You can now select elds and format the data list as described in Creating a Data List on page 20 18 and lay out your stacked pages as described in Creating Stacked Pages on page 20 22 20 14 Data Publishing C R E A T I N G A D A T A O B J E C T Creating an External Data Object from a SQL Data Source This section describes how you use an Open Data Base Connectivity ODBC driver to draw data from a Structured Query Language SQL data source such as an Oracle data le Before you can choose an ODBC data source you must speci cally create the data source by binding your data le to a driver You can do this in the Windows ODBC Data Source Administrator found in the Control Panel as 32bit ODBC or from within NetObjects Fusion as described below If you use MS Of ce or MS Of ce Professional for Windows 95 you might already have a set of ODBC drivers installed on your system If you do not use those products you must obtain the drivers elsewhere Contact Microsoft
419. t template If you need to undo changes to a default NetObjects Fusion template you can re install it E X P O R T I N G A S I T E Importing and Exporting 3 19 If your modi ed template includes a custom SiteStyle see Customizing a Template with a SiteStyle on page 3 19 Customizing a Template 1 In Site view from the File menu choose Open Site to display the le Open dialog 2 Select NetObjects Fusion Template Files nft from the Files of Type drop down list 3 Navigate to and select the template then click OK 4 Identify new assets you want to add to the template and copy them to the template s Asset folder using Windows Explorer or NT File Manager 5 Modify the template page s as needed 6 To record the changes as part of the original template chose File Save Site To rename or move the template to a different folder choose File Save Site As Navigate to and select a new parent folder or enter a new name for the site 7 Click OK You can now import the customized template as needed Customizing a Template with a SiteStyle 1 In Site view from the File menu choose New Site From Template The New Site from Template dialog appears 2 Navigate to and select the template you want to customize and click Open The Save Site As dialog appears 3 Enter a new name for the template NetObjects Fusion creates a new site based on the selected template and gives it yo
420. tObjects sizes the Shockwave box so it is the appropriate size for the stage which is the space in which the animation appears If this doesn t happen you might not have the right browser plugin or ActiveX control installed The Open dialog appears 3 Select a Shockwave le from your hard disk CD ROM or LAN 4 Click Open 15 4 Placing Media I N S E R T I N G S H O C K W A V E F I L E S The Macromedia Shockwave placeholder appears on your page and the Shockwave Director Properties palette appears The Properties title changes depending on which type of le you selected The name of the le you selected appears in the File eld on the General tab 5 To provide text for the browser to display if it cannot play the Shockwave le enter a description in the AltTag eld 6 Click the HTML button to insert HTML tags and scripts For information about HTML in NetObjects Fusion see Chapter 22 Working with HTML Directly 7 Select the Controls tab The options on the Controls tab vary depending on the type of Macromedia le you selected To set the options on the Controls tab see the appropriate procedure I N S E R T I N G S H O C K W A V E F I L E S Placing Media 15 5 Setting the Properties for Shockwave Director N In Page view after adding a Shockwave Director le on the Controls tab of the Properties palette click the option you want enter the parameter and click the check mark
421. talled You open 4 0 to check your stock portfolio then close it and begin working on a site in NetObjects Fusion When you preview the site NetObjects Fusion launches Navigator 4 0 because it was the last version opened To preview in Netscape Navigator 3 0 you must launch it manually Once you open 3 0 NetObjects Fusion uses it for previews until you manually launch another version Also choose whether you want to preview only the Current Page or the Entire Site Previewing the entire site takes longer but you can move from page to page in the browser to test your site s navigation buttons Set the Current Page option to preview only the current page or the current section of pages 1 14 NetObjects Fusion Basics S E T T I N G P R E F E R E N C E S You can also use keyboard shortcuts to preview either the whole site or just the current page or section If Entire Site is selected in Preferences pressing Alt P or clicking the Preview button previews the entire site pressing Ctrl Alt P or clicking the Preview button while pressing Ctrl previews just the current page or section If Current Page is selected in Preferences pressing Alt P or clicking the Preview button previews the current page or section pressing Ctrl Alt P or clicking the Preview button while pressing Ctrl previews the entire site G WYSIWYG Optimization Choose whether Page view should display text spacing as it will appear in Netscape Navigat
422. te s default MasterBorder or you can create your own MasterBorders When you modify the MasterBorder on one page NetObjects Fusion updates all pages that use the same MasterBorder any object you place in a border automatically appears on all pages with that MasterBorder These are the MasterBorders from the imported template 6 4 Managing MasterBorders and AutoFrames M O D I F Y I N G A N D C R E A T I N G M A S T E R B O R D E R S Modifying a MasterBorder 1 In Page view display the MasterBorder Properties palette by clicking inside the MasterBorder If the page has a ZeroMargins MasterBorder click outside the page The MasterBorder Properties palette appears The Name eld shows the name of the MasterBorder assigned to the current page If you started with a new blank site and have not changed the MasterBorder this name is DefaultMasterBorder This page has a visible MasterBorder Click inside it This page has a ZeroMargins MasterBorder Click outside the page M O D I F Y I N G A N D C R E A T I N G M A S T E R B O R D E R S Managing MasterBorders and AutoFrames 6 5 2 To change the size of the margins you can do either of the following G In the Margins section of the MasterBorder Properties palette type values into the elds or click the arrows G Drag the handles on the ruler Note If an object is in the way such as a banner occupying both the top and left margin you cannot resize the MasterB
423. te appears 2 Set the HTML output option to Regular Tables in the Use drop down list 3 Check the Layout Region is a form option 4 Click Settings to enter your form processing settings for this Layout Region in the Form Settings dialog See Chapter 17 Designing and Implementing Forms for information on creating forms and determining form processing settings Setting Layout Region Background Properties You can control the appearance of each Layout Region by setting the background color or placing an image in the background 1 In Page view select the Layout Region The General tab of the Layout Region Properties palette appears 7 20 Laying Out the Page U S I N G L A Y O U T R E G I O N S 2 Select the Background tab 3 Select a Background Color option G Transparent makes this Layout Region transparent so the background color or image assigned to the Layout underneath shows through G Solid Color sets this Layout Region background to a solid color The current color appears in the sample box To select a different color click Color select a color from the Color Picker and click OK G Picture speci es the image le that displays as the background of the Layout Region The current selection if there is one displays in the sample box To select a new or different image click Browse to display the Picture File Open dialog and select the image le you want for the background If the picture
424. te site make sure your system is connected to the Internet or intranet so NetObjects Fusion can link to and import the site 8 Click OK NetObjects Fusion imports the site and converts its content structure and links into NetObjects Fusion format It stores the site s assets in the Sitename Import folder and assigns the MasterBorder you selected earlier to each page in the new site 9 Navigate to each page and make necessary adjustments Expanding Your Site One of the most ef cient ways to expand your site and add new content is to import structures and content from other sources G You can import NetObjects Fusion templates at selected locations in your site See Importing Templates on page 3 11 for information G You can import and convert existing sites or parts of sites using Site view and attach them to selected locations in your site You can also import existing pages using Page view See Importing Existing Sites on page 3 14 Importing Templates One way to expand your site is to import NetObjects Fusion templates into a speci c location in your site Templates can be either pages or whole sites you can use either to assemble the basic structure of your site very quickly 3 12 Importing and Exporting E X P A N D I N G Y O U R S I T E Importing templates is especially helpful if you have standard boilerplate sections or pages that you want to add to multiple sites or share among multiple author
425. te you want Select the appropriate TemplateName nft le and click Open The Save Site As dialog appears 3 Enter a site name in the File name eld To ensure cross platform compatibility limit your site name to a maximum of 26 characters The site name is the le name for the NetObjects Fusion site nod le and the name of the parent folder for the site s assets and content folders 4 Select the location where you want your site saved By default NetObjects Fusion saves your site in the NetObjects Fusion 3 0 User Sites folder but you can store it in the location of your choice 5 Click OK NetObjects Fusion creates the Sitename folder which contains a Sitename nod le and a Sitename Assets subfolder NetObjects Fusion opens in Site view and displays the page icons of the site you created You can now modify the site structure as described in Adding Deleting and Moving Pages on page 2 12 The rst time you work with an AutoSite or page template explore the individual pages in Page view before you delete or rearrange them These pages include helpful content that can save you signi cant development time Type a site name here Click here to store the site in another location C R E A T I N G N E W S I T E S Importing and Exporting 3 7 Importing an Existing Site You can create a new site by importing and converting an existing site that was created using a different site or page develo
426. ter the text in the AltTag eld 6 To change an option select it then edit the text eld at the top G To accept any text you enter click the check mark G To cancel the change click the X G To change the native property page for the ActiveX control click the Properties button You can change the control s settings using the native property page instead of in the NetObjects Fusion properties G To insert HTML tags and scripts click the HTML button For information about HTML in NetObjects Fusion see Chapter 22 Working with HTML Directly 16 8 Adding Java and ActiveX I N S E R T I N G A N A C T I V E X C O N T R O L C H A P T E R 1 7 Designing and Implementing Forms 17 1 Designing and Implementing Forms 17 You can add forms to your site to collect information from site visitors for example to survey potential customers conduct credit card transactions have customers register products or otherwise process information visitors submit Using forms visitors can type in text elds and select options in check boxes radio buttons and combo boxes You can use NetObjects Fusion s Form Handler component to have responses posted in an email or copied to a text le on your Web server Or you can assign a Common Gateway Interface CGI script to further process responses for example by summarizing them on a con rmation page Creating forms involves G Creating one or more forms on a page
427. ters menu button to select the parameter values Parameter menu button 1 In the Set Action dialog open the Parameters eld menu NetObjects Fusion displays the list of prede ned parameter values if any are de ned for the selected action message A D D I N G A C T I O N S T O O B J E C T S Building Dynamic Pages 21 13 2 Set the value for this action message s parameter by G Selecting a prede ned value from the list G Selecting the Values option to set custom values See Customizing Parameter Values on page 21 13 for details G Selecting the Expression option to create a JavaScript expression that generates or otherwise controls the value of the parameter See Scripting JavaScript Expressions on page 21 23 for information Once you select or set the parameter value the name of the value appears in the Parameter eld 3 If you want this action to cascade within the hierarchy of the target object select Cascade message See Creating Cascading Actions on page 21 15 for information 4 Click OK to complete this action and return to the Action tab of the selected object Customizing Parameter Values When you select a prede ned value from the Parameters list you are only setting the value of the most important parameter for this action For example in the case of the action Fly the most important parameter the one available from the menu list will de ne where from and w
428. th to point to a dynamic image on a server Such images however are represented by an X in Page view because the asset is not accessible This asset has been renamed 25 6 Managing Assets M A N A G I N G F I L E A S S E T S Displaying Pages Containing File Assets 1 In Assets view double click a le asset to open the File dialog 2 Select the page you want to see from the list of pages 3 Click the Go To button The page you selected appears in Page view Replacing File Assets You can change all occurrences of one asset le to another le To replace an asset throughout the site 1 In Assets File view double click the name of the asset you want to replace 2 In the Location eld of the File dialog type the location of the replacement asset le or click Browse and select the le from the dialog that is displayed 3 If the asset is a picture the Picture File Open dialog appears Select a new le from the Folders tab or an existing asset from the Image Assets tab and click Open 4 Click OK in the File dialog to change all occurrences of this asset Note If the asset is an image and the replacement image is not the same size as the original you must go through the site and resize the new images accordingly Thumbnail of the selected picture M A N A G I N G F I L E A S S E T S Managing Assets 25 7 Deleting File Assets To delete a le asset that is not in use N I
429. the AutoFrame such as navigation buttons remain in view You can create a MasterBorder and apply it to all the pages in your site or just to selected pages a site can use more than one MasterBorder When you modify a MasterBorder NetObjects Fusion automatically makes that change on every page that shares the MasterBorder This chapter describes G Editing creating applying and importing MasterBorders G Creating AutoFrames 6 2 Managing MasterBorders and AutoFrames L O O K I N G A T M A S T E R B O R D E R S Looking at MasterBorders The illustration below shows a typical page with a MasterBorder By default the left right and bottom margins are separated from each other visually by an outline The lack of an outline between the left margin and the top margin indicates that as in the illustration above objects can straddle that boundary This is not the case if the top or left margin is set as an AutoFrame For information see Adding an AutoFrame on page 6 13 You can turn the outline display off by selecting Page Labels from the View menu All pages have a MasterBorder including those with a ZeroMargins MasterBorder where all margins are set to zero and the MasterBorder is not visible You can change the size of any MasterBorder margin even those set to zero See Modifying a MasterBorder on page 6 4 The MasterBorder margins use the unit of measure selected for the site in Preferences See Setting P
430. the Layout Width and Height elds on the General tab of the Layout Properties palette N With the rulers showing click one of the Layout handles and drag it to change the Layout height and width N With the rulers showing click the rightmost MasterBorder handle to increase the size of the right MasterBorder Click the bottom MasterBorder handle to increase the size of the bottom MasterBorder Forcing Objects to Snap to Grids Guides and Each Other When you select a Snap to command NetObjects Fusion creates a magnetic attraction between the selected object and the grids guides or other objects Forcing objects to snap to grids guides and each other helps create more ef cient HTML code N To force objects to snap to grids select Snap to Grids from the View menu N To force objects to snap to guides select Snap to Guides from the View menu N To force objects to snap to each other select Snap to Object Outlines from the View menu Adding Moving and Deleting Guides You can add as many guides as you want to either the MasterBorder area or the Layout area move the guides and delete them M O V I N G B E T W E E N P A G E S I N P A G E V I E W Page View Basics 4 5 N Click in the area for which you want to add move or delete a guide then do one of the following G To add a vertical guide click in the top ruler G To add a horizontal guide click in the side ruler G To move a guide click
431. the Properties palette displays site information the site name date created date last modi ed the number of pages in the site and the site s author When you enter an author name NetObjects Fusion includes it in a Meta tag that appears in each page s HTML le header when the site is published On the View tab of the Properties palette you can change the Site view orientation and background color The orientation and background color are strictly for working in Site view They have no effect on the published site Click here to change the orientation in Site view Click here to change the background color in Site view 2 18 Creating and Managing Sites C O L L A P S I N G T H E S I T E S T R U C T U R E D I S P L A Y To change background color click the Color button and select a new color from the Color Picker To change orientation click the button for the orientation you want Collapsing the Site Structure Display By collapsing the display of the site structure you hide the child pages of a selected page displaying only the page icons you want to see A page with hidden child pages displays a plus symbol beneath its icon To collapse the display of child pages click the triangle beneath the parent s page icon To expand the display to see child pages again click the plus sign Horizontal orientation Vertical orientation Click here to collapse the site structure Click here to expand the site structure
432. the Text Box Minimum Height You can set the minimum height of a text box so no matter how much or how little you put into it the text box will always be at least the speci ed height This also means the text box never shrinks to a smaller size than speci ed that is it doesn t adjust its height based on the size of the browser display font For example text displayed on a Macintosh is smaller than text displayed on Windows 95 or Windows NT When a locked text box is viewed in a Macintosh based browser the text takes up less room but because the text box has a locked in minimum size the browser has to leave blank space at the bottom of the text box The maximum height of the text box as displayed in the site visitor s browser is determined by the amount of content within it and by the browser font size used to display any text it contains To set the minimum height for a text box 1 In Page view select an existing text box or create a new text box using the Text tool from the Standard toolbar U S I N G T E X T B O X E S Laying Out the Page 7 23 2 Select the Text Box tab on the Text Properties palette 3 Select Lock height on the Text Box tab 4 Select the text box and drag its object handles to the minimum height you always want the text box to require Scaling a Text Box to the Layout To use a text box as the only layout container on the page Text tool 1 In Page view select an existing t
433. the left frame extends the full height of the page The left margin is set as an AutoFrame A D D I N G A N A U T O F R A M E Managing MasterBorders and AutoFrames 6 15 In the second example the bottom frame was selected rst followed by the left frame and the bottom frame extends the full width of the page If an object overlaps the frame border when you apply AutoFrames you see a message asking if you want to modify the margins G If you click OK the selected margin enlarges to include the overlapping object G If you click Cancel the creation of AutoFrames is canceled so you can manually adjust the margins You can then apply AutoFrames again Generating HTML Frame Borders Frames have borders by default and you must leave Generate HTML frame borders checked if you want visitors to be able to resize the frame You can easily set frames to be borderless in the site visitor s browser To do so clear Generate HTML frame borders on the AutoFrames tab of the MasterBorders Properties palette NetObjects Fusion turns off the borders for all frames in that MasterBorder Note To combine frames with borders and frames without borders on the same page you must script the frames See Chapter 23 Creating Custom HTML Framesets and Frames 6 16 Managing MasterBorders and AutoFrames S E T T I N G F R A M E P R O P E R T I E S Setting Frame Properties The Frame tab in the MasterBorder Properties palette contains
434. the page icon 1 In Site view click the page name text and type a new name 2 Press Enter or click anywhere outside the page icon to enter the name You can switch immediately into edit mode on a selected page by pressing Enter Once in edit mode you can tab between sibling pages to edit their names NetObjects Fusion remains in edit mode until you press Enter If the page has no siblings pressing Tab moves the text edit selection to the page s parent To rename a page in the Properties palette 1 Select the page you want to rename 2 Edit the text in the Name eld R E N A M I N G P A G E S Creating and Managing Sites 2 15 3 Press Tab or click anywhere outside the page icon Note For compatibility with NetObjects Fusion for Macintosh and Macintosh Web servers do not give your page a name with more than 26 characters Using Custom Page Names and Extensions By default the browser window title bar banners and navigation buttons use the page name If you prefer you can specify different values to be used for your title navigation buttons banner and HTML le extension If you have a long page name you can break it into two lines so it ts on the banner and button pictures To specify custom page names 1 In Site view select the page you want to give a custom name 2 On the Page tab of the Properties palette click the Custom Names button or choose Custom Names from the Edit menu Click h
435. ting HTML Output Ongoing advances in browser technology and HTML standards have created several possibilities for controlling the way your site presents content NetObjects Fusion supports these advances by offering three HTML output methods G Nested Tables uses nested table tagging and other features of the 3 2 HTML speci cation to produce your site This is NetObjects Fusion s default output because it produces the most predictable and consistent results onscreen regardless of the type version or font con guration of the browser Publishing with Nested Tables on page 5 4 describes this output option in detail G Regular Tables uses basic non nested HTML table tagging to format your site pages Regular Tables is the lowest common denominator output setting generating basic HTML that is compatible with the widest range of browser versions See Publishing with Regular Tables on page 5 5 for a description of Regular Tables output G CSS and Layers uses a combination of Cascading Style Sheets positioning code JScript and the lt LAYER gt tag to control the placement and delivery of content 5 4 Planning Your Site S E L E C T I N G H T M L O U T P U T Content published with CSS and Layers requires an advanced browser site visitors must use Microsoft Internet Explorer 4 0 or higher or Netscape Navigator 4 0 or higher to get the full effect of your design Publishing with CSS and Layers on page 5 5 descri
436. ting Pictures 18 16 Adding Other NetObjects Fusion Components 18 18 xi 19 Referencing and Editing External HTML Referencing HTML from Site View 19 2 Referencing HTML from Page View 19 4 Referencing HTML as an Object 19 6 Toggling Referenced Layouts and Objects 19 9 Managing Referenced Assets 19 9 Publishing Native HTML 19 11 Publishing Unmanaged Assets 19 13 Editing Referenced HTML 19 13 20 Data Publishing Static and Dynamic Data Publishing 20 2 Storing Data with NetObjects Fusion 20 2 Publishing Data 20 5 Creating a Data Object 20 6 Creating a Data Object for Internal Data 20 7 Changing an Internal Data Field Name 20 10 Creating a Data Object for External Data 20
437. tion about using sound les on various platforms see Inserting a Sound File on page 15 11 Changing the MasterBorder Selection Although the MasterBorder is not a property of the Layout each Layout also records the MasterBorder currently applied to it If you switch between Layouts on the same page each Layout displays the MasterBorder that was last applied to it You cannot change the MasterBorder from the Layout Properties palette you can only change MasterBorders on the MasterBorder Properties palette See Changing MasterBorders on page 6 8 Making Layouts Dynamic You can make Layouts dynamic by assigning actions to them For example you can make a Layout s background change colors when the site visitor s mouse pointer passes over it or make an alert box display when the site visitor clicks in the Layout You can also make a Layout the target of an action assigned to another object 7 14 Laying Out the Page U S I N G L A Y O U T R E G I O N S See Building Dynamic Pages on page 21 1 for information about making pages and objects dynamic and the procedures for adding actions to Layouts and objects Using Layout Regions A Layout Region is a container that you use to group objects in a de ned area on the page Layout Regions are independent page segments that you can place size and control independently from the rest of the Layout There are four key aspects to using Layout Regions G If your pag
438. to anchors 6 17 links within 6 10 planning 23 3 relative paths 23 5 resizing 6 17 scripting default target 23 8 scripting overview 23 3 23 4 setting background 6 18 setting properties 6 16 support in browsers 6 11 User Resizable Frame 6 17 User scrollable 6 17 see also AutoFrames framesets 6 9 23 2 adding 23 4 de ning 23 4 HTML 24 1 linking to from 23 3 paths and le names 23 5 Fusion see NetObjects Fusion Fusion2 Fusion component Allaire 18 18 Fusion2Fusion component Allaire 20 2 G General tab Preferences dialog 1 12 Generate HTML comments 26 9 generating HTML frame borders 6 15 GIF les 10 2 transparent 10 10 transparent dithered colors 10 10 gif les animated 10 2 Go menu 1 8 Go To button 1 7 Graphics Interchange Format see GIF les grid object snap 4 4 unit of measurement 1 15 grids showing hiding 4 5 guidelines for publishing 26 26 guides adding moving deleting 4 4 hiding 7 2 object snap 4 4 showing hiding 4 5 H Headspace Beatnik les 15 14 help What s This popup 1 9 help system online xviii hidden elds in forms 17 19 Hide all pro les 21 18 hiding toolbars 1 6 highlighted buttons 12 9 Home page setting published le name 26 12 Horizontal Position 10 13 11 5 12 8 horizontal rules HTML 11 6 hotspots 14 13 converting to anchors 14 14 editing 14 14 HTML accessing 22 2 adding to anchors 14 14 adding to Layouts 7 11 adding to links 14 12 centering page content 22
439. to create different kinds of navigation tools to aid site visitors including banners that show the page names and button and text navigation bars that link to pages in your site You can easily place banners and navigation bars anywhere on the page including MasterBorders Layouts and inside text boxes table cells and Layout Regions Banner titles and button names are determined by the page names in Site view or the settings in the Custom Names dialog Buttons are linked according to your site s structure Whenever you change your site s structure in Site view or change the name of a page NetObjects Fusion automatically updates the buttons and banners When you preview or publish your site NetObjects Fusion creates a new gif image le with the picture and text for each button and banner It gives the text the font style size and color you assigned to the element in Style view It combines this text with the image le for that element of the SiteStyle to ensure that the font style you choose appears despite differences in the browsers used by your site visitors In each new site you create NetObjects Fusion places a banner in the top margin a button navigation bar in the left margin and a text navigation bar in the bottom margin If you do not want the default banner and navigation bars to appear in every new site you create edit the Blank Site template to remove them as described in Changing an Existing Template on page 3 18
440. to open the Picture File Open dialog Select the le and then click OK G If you are using internal data and selected a simple or formatted internal text eld NetObjects Fusion displays a blank eld See Adding Stacked Pages for Internal Data on page 20 25 to learn how to enter text in these elds 4 Place additional data elds until you have as many as you want Add text blocks to label your elds lines and other graphics until you are satis ed with your Layout C R E A T I N G S T A C K E D P A G E S Data Publishing 20 25 5 If you are using external data your stacked pages are already created You can use the Next and Previous buttons on the control bar to scroll though all pages in the stack 6 If you are using internal data add records as described in Adding Stacked Pages for Internal Data You cannot enter data until you add a record to contain it Adding Navigation Buttons for Stacked Pages Next and Previous buttons simplify navigation between stacked pages You can automatically add navigation buttons when creating your data list as described in Creating a Data List on page 20 18 or you can create custom navigation aids by drawing or importing buttons as described here To add navigation buttons for stacked pages 1 In Page view on one of the stacked pages add an object to serve as a button You can place text draw a button using the Draw tool or import an image using
441. ton and choosing an image le from your hard disk CD ROM or LAN G Choose a highlighted button image by clicking the second Browse button and choosing an image le from your hard disk CD ROM or LAN For information on choosing images see Adding Pictures on page 10 3 3 To set different text options G Choose options for regular button text by clicking the rst Text Settings button G Choose options for highlighted button text by clicking the second Text Settings button The Text Settings dialog appears where you can set text options as described in Editing Text Settings for Buttons and Banners on page 12 7 4 When nished click OK in the Text Settings dialog and then click OK in the Primary Button dialog Editing a Data List Icon Data list icons appear when you use the Data List tool to create a data list in Page view For information on working with data lists and data objects see Chapter 20 Data Publishing To edit a data list icon 1 In Style view select the style you want to change and double click a Data List icon The Picture File Open dialog appears For information on choosing images see Adding Pictures on page 10 3 E D I T I N G S I T E S T Y L E S Using SiteStyles 12 11 2 Select an image le from your hard disk CD ROM or LAN 3 Click Open Editing the SiteStyle Line A variety of horizontal page wide images can serve as lines to separate
442. ts properties To choose appropriate properties settings you should be familiar with Java or ActiveX before you add these types of application les to your site This chapter describes how to add the following les to your site G Java applets and servlets G ActiveX controls 16 2 Adding Java and ActiveX I N S E R T I N G A J A V A A P P L E T O R S E R V L E T Inserting a Java Applet or Servlet Java applets and servlets are an ef cient way to add sound and animation such as scrolling messages and color cycling buttons to a page Java applets and servlets are platform independent applications with compact le sizes Usually Java applets and servlets run on the client platform which means site visitors download and run them from a Web browser Most browsers are Java compatible so site visitors don t need special plugins to run a Java application When you embed a Java applet or servlet le on a page NetObjects Fusion displays the le s parameters on the Java Properties palette if the le conforms to certain standards If the Java applets and servlets meet the appropriate standards you can edit their parameters without leaving NetObjects Fusion Visit the NetObjects Fusion site www netobjects com to learn the details of using Java applets and servlets and the standards that NetObjects Fusion uses to display the applet or servlet s parameters To insert a Java applet or servlet Java tool 1 In Page
443. ts as a table of contents each row contains data for and is linked to a single stacked page To create a data list 1 In Page view display the page on which you want to place the data list Data List tool 2 Select the Data List tool from the Advanced toolbar 3 Draw a rectangle in the page body The Data Publishing dialog appears Select the data object you want to use for this data list C R E A T I N G A D A T A L I S T Data Publishing 20 19 The Fields list displays the elds in the selected data object 4 Choose a eld to sort the list You can sort on simple text elds or image le elds The records are sorted in ascending order 5 To lter the data click Set next to Filter By default all available records in the data list and on stacked pages appear A lter selects a subset of the available records to display You can create selection criteria that isolate exactly the records you want to appear in your data list This box identi es the current data object This box lists the elds in the table or worksheet in the current data object 20 20 Data Publishing C R E A T I N G A D A T A L I S T The Query dialog appears 6 Enter your selection criteria and click OK If you do not use all three lines choose end from the drop down list at the end of the last line you use You return to the Data Publishing dialog 7 In the Data List area enter a name for t
444. ts such as text pictures and drawn shapes both within your site and outside it As you organize your site you re likely to create multiple links to the same location You can update these links ef ciently in Assets view as described in Managing Links on page 25 9 You can use NetObjects Fusion s HTML access button to insert your own HTML and JavaScript code before inside and after links For more information on adding HTML see Chapter 22 Working with HTML Directly You can also use a link to trigger an action instead of jumping to a new page by using the Blank link as described in Assigning an Action to a Text Link on page 21 17 The properties palette for all linkable objects contains a Link button in the lower left corner The Link button opens the Link dialog where you specify the destination of a link There are four types of links each has its own tab in the Link dialog G Internal link which links to a page or anchor inside the site G Smart link which links to a relative position in the site such as previous page or next page Sometimes these are called structural links The Blank link which you can use to trigger an action without going to a new page is also a smart link G External link which links to a page in another site via a URL using a protocol such as ftp mailto http JavaScript or other method G File link which links to a le that will be published with the rest of the site Li
445. u do not change the SiteStyle when you customize a banner picture To change the picture for one banner 1 In Page view navigate to the page containing the banner you want to change 2 Select the banner 13 12 Creating Navigation Bars and Banners C U S T O M I Z I N G B A N N E R S A N D B U T T O N S The General tab appears on the Banner Properties palette 3 Double click the banner or click Custom Image on the General tab The Picture File Open dialog appears 4 Select the image you want to use for the selected banner G To use an image that is not already an asset in your site click the Folder tab navigate to the appropriate folder and select the image G To use an image that is already an asset in your site click the Image Assets tab and select the image from the name column For more information on choosing images see Adding Pictures on page 10 3 The selected banner displays the new picture The picture does not include the text style attributes or name that NetObjects Fusion usually assigns to the banner Note that the banner picture changes for the current page only The original image for the banner is unchanged If you change the style assigned to the site the banner no longer displays the custom picture For information about changing the banner back to its original SiteStyle see Removing Banner or Button Image Customization on page 13 15 C U S T O M I Z I N G B A N N E R S A N
446. ublish changed assets only NetObjects Fusion determines which assets have changed since the last time the site was published then generates and transfers only those assets This does not impact your site s pages which are always regenerated and reloaded when you publish your site Note NetObjects Fusion does not query the server to see if it has all the unchanged assets needed by the site If you publish changed assets only be sure you publish to the same location you did previously so unchanged assets are still available 5 Click OK to publish your site 26 26 Publishing Your Site P U B L I S H I N G Y O U R S I T E G If you publish your site locally NetObjects Fusion creates the local directories if needed and stores the formatted site as directed G If you publish your site remotely NetObjects Fusion generates a temporary copy of the site connects to the remote server using the settings in the server pro le and uses its internal FTP program to transfer the site les and directories to the remote server If you specify in Publish Setup a folder that doesn t exist yet on the server NetObjects Fusion alerts you that the target directory doesn t exist and asks for con rmation that you want it to be created 6 While NetObjects Fusion is transferring the published site to the server you can select a different view and continue working You cannot open a different site however 7 When the transfer is
447. umns and rows 10 7 selecting 10 4 selecting cells 10 5 using 10 2 using fro page layout 7 30 targeting de ned 23 7 I N D E X Index 15 le links 24 7 full browser window 24 8 links in AutoFrames 24 2 links to external pages 24 5 links to internal pages 24 4 new browser window 24 9 smart links to internal pages 24 5 speci c links 24 3 targets 21 3 Object Tree 21 10 specifying 21 9 templates 2 3 3 2 3 4 AutoSite 3 3 Blank Site 3 2 creating sites 3 4 3 6 customizing 3 18 3 20 form templates provided 3 3 import guidelines 3 12 3 13 importing 3 13 importing into sites 3 11 3 14 page templates provided 3 3 Templates folder 1 19 text adding to pictures 10 12 adding to shapes 11 4 adding to stacked pages 20 26 adding to table cells 10 6 adding with drag and drop 8 5 adding with Text tool 8 4 alignment 10 13 11 5 12 8 banners and buttons SiteStyles 12 7 clearing wrapping objects 8 15 color SiteStyles 12 11 nding 8 19 formatting 8 6 8 9 pasting from Clipboard 8 5 replacing 8 20 rotating in banners and buttons 12 8 rotating in drawn objects 11 5 rotating in pictures 10 13 submitting responses 17 14 symbols 8 13 word count 8 20 wrapping around objects 8 13 text boxes 8 2 advantages in page layout 7 31 aligning objects 7 28 as object 8 3 as text editor 8 2 assigning actions 7 30 de ning as forms 7 29 embedding objects 7 24 inserting HTML 22 10 inserting objects 7 27 inserting symbols 8 13 limitation
448. und other objects To use a table for your page layout add a table object size it by hand to ll the Layout and add content as needed See Laying Out the Page on page 7 1 for detailed information on creating and modifying tables Using External HTML for Page Layout You can also lay out your page using hand coded HTML You can incorporate external HTML pages as part of your site by referencing them as objects on a page or the page itself NetObjects Fusion makes no changes to the original HTML but it will manage the assets required by the original page if told to do so See Referencing HTML from Page View on page 19 4 for information on incorporating external HTML pages S E L E C T I N G L A Y O U T M E T H O D Laying Out the Page 7 31 Selecting Layout Method There s no single best way to lay out your pages your circumstances will determine which method works best for selected pages The pros and cons of each method are highlighted below Text Box Considerations If ef cient lean HTML pages are more critical to your site visitors than precise placement of your content use a text box for your page layout Text Box Advantages G NetObjects Fusion generates extremely ef cient HTML code for your site HTML les are much smaller which means they load faster and your site visitors experience a more responsive site G Text within the text box ows around other embedded objects automatically so y
449. unterparts from Unisys Corporation NetObjects Fusion was developed using NeoAccess 1992 1995 NeoLogic Systems Inc International Proofreader English proo ng software 1995 by Inso Corporation All rights reserved Reproduction or disassembly of embodied algorithms or database prohibited Microsoft TrueType Web fonts 1996 by Microsoft Corporation Portions of this product were created using LEADTOOLS 1991 LEAD Technologies Inc All rights reserved Beatnik 1997 by Headspace Inc RMF 1997 by Headspace Music Publishing Companies names and dates used in examples herein are ctitious unless otherwise noted Government Restricted Rights For units of the Department of Defense use duplication or disclosure by the Government is subject to restrictions as set forth in subparagraph c 1 ii of the Rights in Technical Data and Computer Software clause at DFARS 252 227 7013 Contractor manufacturer is NetObjects Inc 602 Galveston Drive Redwood City California 94063 If the Commercial Computer Software Restricted Rights clause at FAR 52 227 19 or its successors apply the Software and Documentation constitute restricted computer software as de ned in that clause and the Government shall not have the license for published software set forth in subparagraph c 3 of that clause Printed in the U S A i Contents Welcome to NetObjects Fusion About This User Guide
450. ur new name 4 Make changes to the template s content structure or properties 3 20 Importing and Exporting E X P O R T I N G A S I T E 5 Switch to Style view From the Style menu choose Add Style to List The le Open dialog appears with a Files of Type setting of Style Sheet Files ssf 6 Navigate to and select the Stylename ssf le of the SiteStyle you want to apply to the template and click OK NetObjects Fusion adds the SiteStyle to the list and displays an alert box asking if you want to apply the new SiteStyle to the site 7 Click Yes 8 Switch to Site view and from the File menu choose Export Site to display the Export Destination dialog 9 To replace the original template a To export the template to a new folder create the folder rst using the Windows Explorer or NT File Manager b In Site view from the File menu choose Export Site to display the Select Destination dialog c Navigate to and select the folder under which you want to store the template and click OK NetObjects Fusion creates the template and stores it in a subfolder of the folder you selected The current site remains open 10 To create a new template export the site to a new location You can now import the customized template as needed E X P O R T I N G A S I T E Importing and Exporting 3 21 Sharing NetObjects Fusion Site Files Templates are the only effective way to share NetObjects Fusio
451. urrent contents of the Styles folder This process also removes styles from the style list that are not included in the Styles folder Removing SiteStyles You can remove a style from the list of styles in the current site You cannot remove the currently applied style When you remove a SiteStyle its name is removed from the current site only Its style folder and the associated image les are not deleted and it is not removed from any other sites To remove a style from the list 1 In Style view select the style you want to remove 2 From the Style menu choose Remove Style from List 3 Click Yes in the warning dialog The style disappears from the style list of the open site It remains in the NetObjects Fusion 3 0 Styles folder 12 16 Using SiteStyles S T Y L E S F O L D E R S T R U C T U R E Styles Folder Structure Each SiteStyle stores the images it uses in a special folder structure in the NetObjects Fusion 3 0 Styles folder NetObjects Fusion uses this folder structure to organize and label SiteStyle elements so you can easily locate parts of a style When you assign an image to a SiteStyle element in Style view NetObjects Fusion automatically copies the le to the appropriate folder within the Styles folder You can give a style element any name you want but NetObjects Fusion style images generally have the name of the style and element such as BasicButton gif or BasicLine gif When you select a ne
452. us 1 9 Choosing Colors 1 9 Using Color Palettes 1 10 Choosing a Color Palette 1 11 Loading a Custom Color Palette 1 11 Creating or Editing a Color Palette 1 11 Setting Preferences 1 12 Editing Objects and Assets 1 18 ii NetObjects Fusion Folder Structure 1 19 2 Creating and Managing Sites Starting NetObjects Fusion 2 2 Working with Site Files 2 2 Creating and Opening Sites 2 3 Starting with a Blank Site 2 3 Opening an Existing Site 2 6 Viewing a Site 2 7 Saving Your Work
453. view select the Java tool from the Advanced toolbar 2 Draw a box to indicate the position of the Java applet or servlet The Open dialog appears 3 Select the appropriate Java le from your hard disk CD ROM or LAN The extension for a Java le is class A sample Java applet is available in the NetObjects Fusion 3 0 Samples Content Java Applets folder 4 Click Open I N S E R T I N G A J A V A A P P L E T O R S E R V L E T Adding Java and ActiveX 16 3 The Java placeholder image appears on the page and the Java Properties palette appears The name of the le you selected appears in the Class eld on the General tab 5 Select Applet or Servlet depending on the type of le you are inserting 6 To provide text for the browser to display if it cannot display the le enter a description in the AltTag eld 7 Set the parameters This guide assumes you are familiar with Java and know how to set these parameters In some cases Java developers do provide documentation that explains the parameters G To edit parameters that appear in the Parameters section on the General tab double click the parameter Enter a value in the Enter Value dialog For servlets you can specify that the value is an initialization value for the parameter by checking the Value is an initialization option in the Enter Value dialog G To learn more about each parameter check the Parameter info section on the General tab
454. visual and functional properties that you can set for each frame individually To view and set the properties of a frame select the frame click the Frame tab in the MasterBorder Properties palette and follow the appropriate procedure You can also assign actions to frames just like other page objects See Chapter 21 Building Dynamic Pages for information S E T T I N G F R A M E P R O P E R T I E S Managing MasterBorders and AutoFrames 6 17 Adding Scroll Bars to Frames With the User scrollable option on the Frame tab you can specify whether the site visitor s browser displays scroll bars around a speci c frame 1 In Page view click the frame and select the Frame tab 2 Select a User Scrollable option G Yes The browser always displays vertical and horizontal scroll bars in the frame whether needed or not G No The browser never displays scroll bars even if needed to display all objects in the frame If the page content is larger than the frame itself site visitors won t be able to see the entire page G Auto The browser displays scroll bars if the size of the page content requires them Auto is the default setting Note Due to the nature of HTML links to anchors on a frame will not work if User Scrollable is set to No Making Frames Resizable If you want a site visitor to be able to drag the frame border making the frame larger or smaller you can set the User Resizable Frame option 1
455. w image for a style element NetObjects Fusion automatically copies it into the appropriate folder for the SiteStyle If you re editing an existing SiteStyle the new image le replaces the one previously assigned to that element in Style view It copies the new image to the folder but doesn t overwrite the old image le unless the new and old les have identical names For example suppose you want to modify the SiteStyle BlackBook to change the color of the highlighted button from black to red First you must use an image editing application to open the le BlackBookButtonOn gif and change the button s color You can give the new image le any name you like Then in Style S T Y L E S F O L D E R S T R U C T U R E Using SiteStyles 12 17 view you edit the highlighted button of the Primary Navigation Bar and choose the image le you edited The image le you select is copied to the Primary Buttons Highlighted folder in the NetObjects Fusion 3 0 Styles BlackBook folder If the new image le has the same name as the original le the original is overwritten Thereafter every site created or opened on your machine that uses BlackBook uses this le for all highlighted primary buttons This applies to all style elements that can be based on images Background Banner Primary Navigation Bar Secondary Navigation Bar SiteStyle Line and Data List Icon This also occurs when you replace the image for a single instance of a
456. w names the next time you generate your site Any folder or le that you rename is considered customized If you name a customized folder with a name used by an auto generated folder it is still treated as a customized folder Aliased folders are also considered customized folders NetObjects Fusion displays them in the directory structure even if they are empty and tracks their name and location in the event you change them See Creating Aliased Folders and Setting the CGI Bin Directory on page 26 17 for more information By de nition read only assets such as script les used by NetObjects Fusion components can t be changed NetObjects Fusion ignores attempts to move or rename read only les Deleting Folders 1 In either pane of Publish view click the folder you want to delete and make sure it is empty You cannot delete a folder until it is empty and you also cannot delete pages or assets in Publish view 2 Right click the folder and select Delete Folder from the shortcut menu NetObjects Fusion deletes the folder After you delete a customized folder the next time you publish the site NetObjects Fusion recreates any auto generated assets that it needs Rearranging the Directory Structure N In either pane of Publish view click the folder page or asset and drag it to its new location NetObjects Fusion moves the object and updates all references to it If you move pages NetObjects Fusion remember
457. when it is received by the targeted object The picture object in the example above won t know to y off the screen until it receives the instruction to do so which triggers the ying action within the object Use the Message menu button to select the action message Message menu button 1 In the Set Action dialog open the Message menu 2 Point to a Message option then click the condition you want To select a custom message point to Custom and select from the list See Creating Custom Messages on page 21 18 for information The name of the selected action message appears in the Message eld 3 Continue setting the action parameter values if appropriate to the message you selected 21 12 Building Dynamic Pages A D D I N G A C T I O N S T O O B J E C T S Specifying an Action Parameter Value Some actions require or accept additional parameters that control some aspect of their activity In some cases you can select from a list of prede ned parameter values In others you can enter a value of your choice The parameter value you set is sent to the object as part of the Action Message The range of choices is determined by the type of Action Message you assigned to this action For example the Fly message accepts directional parameters with choices like In from Top or Out to Top Left The Alert message on the other hand accepts a text string that it displays within the alert box Use the Parame
458. with a brief summary of HTML frames components and includes information on G De ning a custom frameset G Creating frame content and targeting frame links G Adding content for browsers that don t support frames 23 2 Creating Custom HTML Framesets and Frames U N D E R S T A N D I N G F R A M E S Understanding Frames Frames are an HTML mechanism you can use to subdivide a page Layout so it displays in the browser window as multiple independent areas Each frame displays its own content made up of a separate page or resource that can include links form objects regions or any text graphic or media objects A special type of page called a frameset establishes the combination of frames and frame properties that make up the complete Layout The frameset sets the number of frames de nes their size and placement and speci es the pages or resources that make up their original or default content Within a frameset each frame has the characteristics of an individual page Site visitors viewing a frameset can drag frame borders and scroll frame contents to display information A link in a frame can display new information in any frame within the frameset or load an entirely different page that replaces the frameset You can target links to specify what happens within each frame when a site visitor clicks linked items In addition to the AutoFrames function NetObjects Fusion provides HTML access capabilities necessary to c
459. wse In the Picture File Open dialog select the image le you want to use for the background If the picture is smaller than the Layout the browser automatically tiles the image as needed For more information on using the Picture File Open dialog see Using Image Assets on page 10 13 Adding or Changing a Layout Background Sound You can assign a sound to play when a site visitor views the page You can use sound les in au aiff midi or wav formats The sound can play once or continuously 1 In Page view on the Background tab of the Layout Properties palette select Sound G If a sound le is already selected its name appears in the sample box To select a different sound le click Browse U S I N G L A Y O U T S Laying Out the Page 7 13 The Background Sound dialog appears G If there is no previous sound le selection the Background Sound dialog appears 2 Click Browse to nd and select a sound le from your hard disk CD ROM or LAN 3 To make the sound repeat while the page is open select Continuous Loop 4 Click OK The selected sound plays when you preview the page Note Site visitors must have a sound board speakers and a browser that supports background sounds installed on their computers to hear background sound To preview and test sounds your system must also be appropriately con gured Some sound formats also require support from the Web server For more informa
460. x grows to ll the Layout so there s no unexpected white space if your MasterBorders or page dimensions change If you embed your page content in a maximized text box NetObjects Fusion generates extremely ef cient HTML when it publishes your site See Embedding Objects in a Text Box on page 7 24 for details G If you size your text box to the Layout and you select the ZeroMargins MasterBorder you can set the text box to wrap to the width of the browser window Text and images embedded in the text box rewrap themselves to t within the browser window If the browser window is resized then the text box contents rewrap themselves to the new size Note If you wrap the page contents to the browser window then NetObjects Fusion generates the page s HTML without using tables For information on formatting text see Chapter 8 Designing with Text For information on designing layouts with text boxes see Using Text Boxes on page 7 21 C H A P T E R 5 Planning Your Site 5 13 Locking or Maximizing the Text Box Size 1 In Page view create or select the text box 2 Select the Text Box tab on the Text Properties palette 3 Select Lock height to lock the text box s minimum height 4 Select Size to Layout to maximize the text box to ll the Layout Setting the Text Box to Wrap to Browser Width 1 In Page view click the MasterBorder or select it from the Object Tree 2 On the General tab of
461. y dropper 10 12 Placing Pictures M O D I F Y I N G A P I C T U R E Note o specify the position of an object before you paste it cut or copy the object click the page and then paste the object The upper left corner of the pasted object appears at the point where you clicked the page Adding Text to a Picture You can add text to a picture and format its font size and alignment The text you add becomes part of a new image le when you publish the page containing the picture Your original le is unchanged 1 In Page view select the picture to which you want to add text The Picture Properties palette appears 2 Select the Effects tab 3 In the Text in element section of the Effects tab select Enable and click Settings The Text in Element Settings dialog appears 4 Replace the highlighted text with the text you want to add Press Enter to type additional lines of text U S I N G I M A G E A S S E T S Placing Pictures 10 13 5 Click Set for the Font to open the Font dialog 6 Select the font its style and size and then click OK 7 Click Set for the colors in the Text in Element Settings dialog to open the Color Picker 8 Select the color you want to apply to the text See Choosing Colors on page 1 9 for information 9 In the Text in Element Settings dialog select the Relative Alignment Horizontal Position and Vertical Position for the text The Relative Alignment left
462. y structure on the server This setting creates the most ef cient le structure allowing your server to load your pages as quickly as possible in your site visitor s browser It is the default directory structure setting in NetObjects Fusion It also provides the most effective directory structure for search engines which may only index one page per folder 26 6 Publishing Your Site C O N F I G U R I N G P U B L I S H S E T U P Note If you apply the By Section directory structure shared assets are stored in the deepest folder common to all pages that use that asset This makes the shared access to those assets as ef cient as possible To set the Directory Structure property for this site 1 In Publish view click the Setup button on the control bar or choose Publish Setup from the Publish menu The Directory Structure tab of the Publish Setup dialog appears 2 Select the server arrangement you want from the Directory Structure drop down list For each option NetObjects Fusion displays a short description of that option s effect 3 If you customized your directory structure and want to reset your arrangement to the default directory structure click the Clear All Customizations button NetObjects Fusion removes any custom folders and changes all customized asset names back to their original auto generated names See Customizing Your Directory Structure on page 26 21 for information C O N F I G U
463. y that button G Text attributes for banner and button text and colors for normal text and regular and visited text links The text on the navigation buttons and banners appears in the font style size color alignment and orientation assigned to the element in Style view List of SiteStyles Current SiteStyle Click to set the selected SiteStyle Click to create a new SiteStyle Selected SiteStyle Element area displaying elements of the selected style 12 4 Using SiteStyles A P P L Y I N G S I T E S T Y L E S Each NetObjects Fusion SiteStyle is composed of nine style elements G Background Color or image used as a background of the page G Banner Image containing the banner text G Primary Navigation Bar Images for highlighted and non highlighted navigation buttons G Secondary Navigation Bar A second set of images for highlighted and non highlighted navigation buttons G Data List Icons Bullets next to items when you use a data object to create a data list G Normal Text Color Color of text on the page G Regular Link Color Color of linked text on the page G Visited Link Color Color of linked text already explored by visitor G SiteStyle Line Image for lines drawn with SiteStyle Line tool Applying SiteStyles By default navigation banners and buttons obtain their images and text attributes from the SiteStyle assigned to the site When you apply a SiteStyle NetObjects Fusion automatically applies
464. yles 12 7 browser fonts in AutoFrames 6 10 browsers 1 15 color 12 8 default display in browser 5 2 Form Handler tool 17 14 form objects adding 17 4 creating 17 4 naming 17 5 form responses processing 17 17 form templates provided 3 3 Form toolbar 4 18 17 4 formatted text elds de ned 20 9 formatting date eld 8 18 paragraphs 8 6 8 9 text 8 6 8 9 time eld 8 18 forms actions browser problems 17 5 adding objects 17 4 assigning CGI script 17 17 CGI scripts 17 17 check boxes adding 17 9 creating 17 2 creating from table cells 10 6 CSS and Layers 17 1 de ning Layout as 7 10 de ning Layout Region as 7 19 de ning text boxes as 7 29 displaying in browsers 17 4 edit elds 17 5 hidden elds 17 19 multiple 7 10 multiple line text elds 17 7 passwords 17 6 radio buttons adding 17 8 Reset button 17 12 Submit button 17 12 submitting data in email 17 16 submitting data to text les 17 14 Index 6 submitting responses as plain text 17 14 types 17 2 Forms Button tool 17 13 Forms Checkbox tool 17 9 Forms Combo Box tool 17 11 Forms Edit Field tool 17 6 Forms Multi Line tool 17 7 FPX picture les 10 2 frameless browsers alternate content 23 10 24 10 frames adding content 23 6 adding custom HTML and scripts 24 13 adding scroll bars 6 17 borderless 6 15 custom HTML 6 10 de ned 23 2 generating visible borders 6 15 inserting colors in background 6 18 inserting pictures in background 6 18 links
465. you target a container like a text box or a Layout Region you can also cascade the action so the container passes it along to all the objects embedded within it See Creating Cascading Actions on page 21 15 for more information For example you might add a Fly Out to Top Right action to one picture object and target it at another picture object When the site visitor clicks the rst object the second object receives the action message which triggers it to y off the page NetObjects Fusion s default setting is for an object s actions to target itself Unless you target another object the action acts on or impacts the object to which it is attached If you add an action to an object in a MasterBorder or an AutoFrame and it targets an object in the Layout make sure the target object is always available in all Layouts to which the MasterBorder or AutoFrame is applied MasterBorders and AutoFrames are often applied to several pages if you add an action to an object in the MasterBorder and the target is in the Layout the target might not always be available For example if you add an action in a MasterBorder on a page named Staff Photos and the target is an object named CEOPicture in the Layout the action will not work while site visitors are on the page named Phone Numbers if CEOPicture is not also in the Layout for Phone Numbers 21 10 Building Dynamic Pages A D D I N G A C T I O N S T O O B J E C T S Use the Tar
466. you want to place The lters are listed in the File of type drop down list You can select G Web images to view all image les that can be viewed using a Web browser including gif jpeg jpg and png G All images to view all les that are image les G Unique images to view image les by a single le type such as all gifs or all jpegs You can also drag and drop an image le directly onto a NetObjects Fusion page from your desktop or the Windows Explorer 3 Select the Show thumbnail image option to preview your image before you add it to the page A thumbnail preview of the selected picture appears on the right side of the dialog 4 Click Open to place the image in the box Show thumbnail image check box 10 4 Placing Pictures A D D I N G P I C T U R E S If you select a non standard Web format the following dialog appears G If you convert to gif NetObjects Fusion reduces the image to 256 colors G If you convert to jpeg NetObjects Fusion retains the color information of the original le G If you choose not to convert NetObjects Fusion positions the image in HTML using the lt EMBED gt tag This means only those browsers that have the appropriate plugin installed can view the image 5 Choose the appropriate conversion format and click OK If you choose an image in Web standard format the picture appears where you drew the box The box snaps to t the placed picture
467. yout Region 1 In Page view select the Layout Region The General tab of the Layout Region Properties palette appears 2 In the HTML output section of the General tab select the HTML output method you want from the Use drop down list G Parent Setting generates the Layout Region using the output method speci ed for the parent container in which the Layout Region is embedded G Nested Tables uses nested table tagging and other features of the 3 2 HTML speci cation Nested Tables is the default choice for the Publish Setting that controls the HTML output for the whole site 7 18 Laying Out the Page U S I N G L A Y O U T R E G I O N S G Regular Tables uses basic HTML table tagging to deliver your design and content for this Layout Region only G CSS and Layers uses Cascading Style Sheet Positioning code layers and scripts to position and publish the content of this Layout Region only See Selecting HTML Output on page 5 3 for more information on these HTML output choices See Setting the Site s HTML Output on page 26 7 for information on setting the Publish Setting property Setting the Table Formatting Preference for Layout Regions If you use Nested Tables as the HTML output method for this Layout Region you can set the table formatting preference NetObjects Fusion protects when it publishes the site This setting determines whether the horizontal or vertical relationship between objects in this La
468. yout Region is more important To set the table formatting for the current Layout Region 1 In Page view select the Layout Region The General tab of the Layout Region Properties palette appears 2 In the HTML output section of the General tab select G Columns to preserve the vertical relationship between the Layout Region s objects This is the default G Rows to preserve the horizontal relationship between the Layout Region s objects See Preserving Your Design Intentions on page 5 2 for information on selecting the table formatting preference U S I N G L A Y O U T R E G I O N S Laying Out the Page 7 19 De ning the Layout Region as a Form You can de ne a Layout Region as a form in two ways G You can create a new form area and set its container to be a Layout Region See Creating a Form on page 17 2 for information on creating new form areas G You can set any existing Layout Region to function as a form area Using either method you can place multiple Layout Regions on the same page and have each Layout Region contain its own form objects and function as an independent form To publish forms that are compatible with the broadest range of browser versions use Regular Tables as the HTML output method for Layout Regions you de ne as forms To de ne an existing Layout Region as a form 1 In Page view select the Layout Region The General tab of the Layout Region Properties palet
469. zed SiteStyle used for the site might not be available in the site s new location Export is only available from Site view Creating a Template 1 To export the template to a new folder create the folder rst using the Windows Explorer or NT File Manager 2 In Site view from the File menu choose Export Site 3 18 Importing and Exporting E X P O R T I N G A S I T E The Select Destination dialog appears 3 Navigate to and select the folder where you want to store the template and click OK NetObjects Fusion creates the template and stores it in a subfolder of the folder you selected The current site remains open Changing an Existing Template You can change or customize any NetObjects Fusion template For example G If you have a standard company template for department pages you can customize your copy so it contains your department name location and personnel information G If your company develops sites for customers and other organizations you can customize the templates you use most frequently with your company name contact information and default links G If you routinely create new pages or new sites but need them to have a consistent look and feel you can customize NetObjects Fusion s Blank Site template to contain the standard objects you want To preserve the original template copy the entire template folder including the TemplateName Assets subfolder before you edit or modify a defaul
Download Pdf Manuals
Related Search
Related Contents
Guida rapida Sensore Apex テールドライブパイプ取付に関する追加説明書 第2版の追加項目 893k Tristar HD-2325 hair dryer Mode d`emploi V7 Replacement Battery for selected Asus Notebooks Bookendz BE-10341 User's Manual Savings Tracker Manual Copyright © All rights reserved.
Failed to retrieve file