This article will guide you through the steps required to draw your first image map.

Preparation

In the first step we set up two pages, the first with an image attached to draw the image map on, and the second to link to from the image map.

To prepare content for this guide:

  1. Create two Confluence pages: Page A and Page B.
  2. Download the image below and upload the image to  Page A.

Scroll ImageMap supports JPEG, PNG, and GIF image formats.

Draw an image map

To draw an image map:

  1. Edit Page A and insert the ImageMap Macro
  2. Select 'Current Page' and the image uploaded earlier
  3. Click the Medium Size icon to render the image in 375px later on
  4. Click on the Rectangle icon in the tools menu and draw an rectangle on the image
  5. In the sidebar on the right, enter a tooltip and link to Page B.

  6. Save your image map and the page
  7. View Page A and hover over the area your draw the rectangle - it's highlighted and showing the tooltip you defined above.
  8. Click on the highlighted area to get redirected to Page B

That's it – you have successfully created and tested your first image map!

What's next