RapidWeaver FAQ - Zoomify


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

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.

Examples (first is Flash, second is HTML5)

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

RapidWeaverFAQ.org - Tutorials, Tips & Tricks is made with RapidWeaver and for RapidWeaver.
It's an EBookStoreToday.com company. It's presented by Cédric Giger and hosted by HostGator.com

Thank you for visiting and supporting my website,
- Cédric -

Now share it…