Display Thumbnails

How do you display thumbnails

With the File Genie PHP Extension you can easily display thumbnails.
In this tutorial we will show you step by step how to display the thumbnails and then use Advanced Open Window 3 to create a popup window to display a larger image.

How to do it

•  Open page

  Open your php file where you need to display the files.

•  Find the Folder List Server Behavior

  You will find the Folder List Server Behavior under Bindings, Folder List.
  
  

• Apply the Folder List Server Behavior

  In the Folder List Name enter the name of this Folder List object.
  In Folder Browse to the folder that holds the thumbnails you would like to display.
  By Allowed Extensions you can choose which files you want to display. In this case Images only.
  Make sure you select Show Thumbnails Only and fill in the correct suffix/prefix!
  
  

• Click OK

  To apply the Folder List behavior click OK.
  A message box appears to tell you that the file called incFileGenie.php has been copied to your site in the ScriptLibrary folder. Click OK.

•  Make the layout of the page

  To actually show the files on the page open the Bindings Panel. Select Thumbnail Image. And click on Insert.
  
  

•  Apply Advanced Open Window 3

  First you need to put a link on the thumbnailImage, select the dynamic text and fill in '#' at link in the property inspector. (in Dreamweaver MX 2004 you need to select the <a> tag using the tag selector.
  
  
  
  To create a popup window open up the Behaviors panel, click on the + sign and Advanced Open Window 3.
  
  
  
  1. Click on Browse to select the file to display in the popup window.
  2. Click on Data Sources and Path.
  3. Click OK.
  
  
  
  4. You can specify how you want the popup to appear and where.
  5. Click OK.
  6. Apply the onClick event.
  
  

• Result

  Let's see what it looks like. Save your file and press F12 to open up the browser. Click on the thumbnail.