GotFusion.com Where your journey begins
Showcase your website at Fusion GalleriesNetObjects Fusion 7 Websites Portal

 


 

Using WOW Slider with NetObjects Fusion

The WOW Slier is a stand alone code generator similar to NetObjects Fusion except it is specialized to generate the code to display an image slide show. where Fusion saves its project files with a .nod extension WOW saves its project files with a .wowsl extension. The default save/generate folder is going to be located on your computer at: \My Documents\WOW Slider\. Like with all software you can choose to save your project files and generated code anywhere but for the sake of this tutorial we will assume and reference the default location names.

This tutorial is not targeted to explaining now the WOW software works but how you get the code it generates from the pages it generates and into NetObjects Fusion where it will display on your web pages. For detailed tutorials on the operation of the WOW software visit their web site or google for information.

Since NetObjects Fusion is a code generator, you must insert code within Fusion so that the code becomes part of Fusion, otherwise the next time you generate, if the external code is not part of the Fusion page, the newly Fusion generated page will not have the code on it.

As with all graphics, please follow proper cropping, resizing, and compressing rules for the web. The images you use in your side show need to load fast otherwise your visitors will leave before you page loads.

Before you get started go over the gotFusion "using graphics on the web" tutorial to understand how to crop, resize, and compress images for use on the web. Make your slide show graphics all the same size before you get started and you will have a better looking slide show.

In the WOW software:

Make your gallery the way you want it with the transition effects and photos you want to use. When you are satisfied with your slide show.

Click on the Publish Gallery Icon

Select Publish to Folder

Click the Publish Button

This will create an index.html file and all of the folders and files necessary for the WOW slider to function. You will find these documents, files, and folders located in the default WOW folder location outlined above.

Placing the WOW code within Fusion
Inserting the HEAD coding

Open Windows Explorer and navigate to the folder that the WOW software generated its page into. Right click on the index.html file that will be located in that folder and select open with Notepad.

Highlight and copy ONLY the 4 lines of code within the head area (outlined in yellow below). Include the 2 lines of comments above and below the style sheet and javascript include statements so that you will know what this block of code is for later on and not accidentally remove it sometime in the future. The WOW code starts with < !-- Start WOWSlider.com HEAD section --> and ends after < !-- End WOWSlider.com HEAD section -->. DO NOT take any more of the code other than the starting and ending comments and what is between them

In your NetObjects Fusion project, navigate to the page you wish to display the WOW slide show on

On your computer keyboard, press the F9 Function key to display the Layout Properties palette

Press the HTML button on the Layout Properties palette to bring up the html insert dialog box and paste the WOW head code within the HTML head section just below the TITLE tag as shown below

Inserting the BODY coding

To insert the body section of the WOW code into NetObjects Fusion

Go back to the WOW document that you have open in Notepad, highlight and copy the code that is located within the BODY section (as shown below). Include the WOW comments above and below the code so that you will know what this block of code is about later on. The WOW body code starts with the line < !-- Start WOWSlider.com BODY section --> and ends after < !-- End WOWSlider.com BODY section -->. DO NOT take any more of the code other than the starting and ending comments and what is between them

On your Fusion page draw a text box or single celled table where you wish the slide show to appear

Press and hold your control key while you press the T key on your keyboard to bring up the HTML insert dialog box.

Paste the WOW body code into the HTML insert dialog box and press the OK button to close.

You will see the Fusion HTML insertion icon where you inserted the BODY code. To open the HTML insert dialog box and edit the code, hover over the blue inverted T icon until your pointer becomes a hand then click to re-open the dialog box

Uploading the WOW Files and Folders

Using an external FTP program, log on to your domain and navigate to the location of the page you have placed the WOW code on. If you are publishing by ASSET TYPE, this will be the HTML folder. If you are publishing FLAT this will be your domain root (wwwroot or public_html, ask your web host if you do not know what domain root is called). If you are publishing by SITE STRUCTURE you need to go to the folder of the same name as that page that has the WOW coding on it.

Copy the 2 folders and all of the files located within the engine# and data# (where # is the number you selected in the WOW software when you created the code). DO NOT upload the index.html file you will find in the WOW folder. ONLY the engine# and data# folders and all files within those folders

You will not see the slide show until you generate the page, either local publish or remote publish. Check the page in a local publish to make sure everything is working before uploading.

To view the slide show in local publish you will need to copy the engine# and data# folders and the files within them to your local publish folder in the correct location as explained above



Return to the TOP of this page

Did you find this tutorial useful?
Do you want to keep this resource online?
Make a donation to keep gotFusion alive


|  Fusion  |  Web Design  |  Hosting  |  Resources  |  gotFusion Store  | 

Problems with this page?  

All content copyright © 2001 - 2017 gotFusion LLC. The name gotFusion and the gotFusion ® logo are registered trademarks of gotFusion LLC
Copyright, legal notice & privacy statement