iWeb FAQ - Zoomify



What is the best way to add panoramic or high resolution photos in iWeb? How can I add Zoomify to my website?

La stessa pagina in italiano                             Die gleiche Seite auf Deutsch

Zoomify lets you add big images in a small area.

It allows people to zoom in to see a detail and move around. It loads very fast and works on iOS Devices (iPhone, iPad, iPod Touch) too.

Warning: Zoomify provides awful instructions so best is to ignore them and follow the ones I wrote here.

1) Go to Zoomify.com. Buy the HTML5 version ($29.00 at the time I wrote these instructions) and download it.

2) Make a new folder and name it Zoomify5

3) In the Zoomify5 folder add...

- ZoomifyImageViewer.js file you find in the files you downloaded from Zoomify

- Assets folder you find in the files you downloaded from Zoomify

- Add a folder named images

4) Open Zoomify Converter and drop your image in the appropriate box

5) You will get a folder named after the name of your image. Rename the folder to Panorama01 (rename future folders Panorama02, Panorama03, Panorama04, …)

6) Take the folder and drop it into the images folder you created in the Zoomify5 folder (upload future folders into this folder on your server)

7) Upload the Zoomify5 folder to the root of your server

8) Use the following code to implement the picture into your website:

<script type="text/javascript" src="/Zoomify5/ZoomifyImageViewer.js"></script>

<style type="text/css"> #Panorama01 { width: 650px; height: 500px } </style>

<script type="text/javascript"> Z.showImage("Panorama01", "/Zoomify5/images/Panorama01", "zSkinPath=/Zoomify5/Assets/Skins/Default", "zLogoVisible=0"); </script>

<div id="Panorama01"></div>

Adapt width and height in the code to fit your needs

Change Panorama01 in the code to Panorama02, Panorama03, … for future images

9) That's it.

Note: If you want the full screen option to work you have to add the Zoomify using Alternative HTML. Full screen doesn't work using HTML Snippets.

Examples (first is Flash, second is HTML5)

This FAQ is also discussed in my iWebFAQ.org E-Book (sample)

iWebFAQ.org - Tutorials, Tips & Tricks is made with iWeb and for iWeb.

It’s an EBookStoreToday.com company. It’s presented by Cédric Giger and hosted by HostGator.

Thank you for visiting and supporting my website,

- Cédric -