Help:ImageMap

With the ImageMap feature, you can insert an image map into a Wikia page, which allows different parts of an image to link to different pages. This allows you to use images to enhance your site's navigation.

If you already know how to insert images, then you should be able to use this feature to insert an image while linking polygonal, rectangular or circular regions of that image to different pages. The software outputs HTML &lt;map&gt; and &lt;area&gt; tags so that web browsers that understand image maps can use these maps.



How do I create an image map?
The following markup creates the example on this page:

&lt;imagemap&gt;

Image:ImageMap.png|

poly 225 172 253 156 327 158 341 172 326 188 246 187 [|Editing help]

rect 6 53 272 128 [|Main page]

circle 107 260 107 [|Sidebar help]

desc bottom-left &lt;/imagemap&gt;

Inside the &lt;imagemap&gt; ... &lt;/imagemap&gt; tags, the first line is the usual code for adding an image, without the square brackets. Lines that start with "#" are ignored, so you can use them as comments.

The lines starting with "poly" or "rect" or "circle" allow you to create links. The coordinates are for the original full size image, not the resized 400px image in this example. To measures coordinates, open the full size image in a program that displays them, such as KDE's KolourPaint.

Important note: Any "poly" lines must come before any "rect" or "circle" lines, or the imagemap will not work correctly.