1. Add an ImageMapper stack to your stacks page.
2. Drag and drop your image into your ImageMapper stack.
3. Add in your settings to the ImageMapper stack HUD window.
4. Publish your Rapidweaver site pages.
5. Check out the image map hot spots on the example image above that match up with the first image's HUD settings in step #3. Move your mouse over the image map areas and watch the mouse cursor change when you hover over a hot spot.
Rapidweaver skill level: Basic / Beginner
Easy to set up and use. Requires you to fill in minimal amount of settings in ImageMapper HUD window. Readme file very helpful and shows image examples to follow. Requires Stacks plugin v2+ and Rapidweaver 5. An earlier version of the ImageMapper stacks for Stacks v1.4.4 is available upon request.
Download ImageMapper's PDF Readme File Before You Buy
Click here for PDF manual. See how easy it is to setup and use the ImageMapper stacks!
Supported Browsers
Tested and works perfectly on: Safari, Firefox, Chrome, IE7, IE8, and IE9.
The benefits of using the ImageMapper stacks:
- Adding in imagemap areas to an image is now quick and easy for any Rapidweaver user to do!
- Drag and drop in your image into the ImageMapper stack then fill in the HUD fields. That's it!
- When in edit mode, your image map areas will be outlined in red dotted borders to help you align and position your image map areas better. If you make adjusts in the HUD area to your start, end, top, or bottom point settings, they are dynamically updated for you while in edit mode. When you go to preview mode they disappear like magic!
- Easily tag your map areas on an image using the Title feature in the HUD area. This title text will show as a tooltip when you hover your cursor over any map area on an image.
- You can use multiple instances of ImageMapper stacks on 1 page if you need to.
- See very helpful tooltips when you hover over each ImageMapper settings item area.