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:Footerlinks1.png|400px|thumb|right|Try clicking the red rectangle, the triangular part of the arrow, or the brown copyleft symbol at the left.


 * 1) triangle from 555,300 to 583,280 to 587,318


 * 1) poly MUST COME BEFORE ANY rect OR circle

poly 555 300 583 280 587 318 Help:MediaWiki namespace


 * 1) rectangle from 435,325 to 680,370

rect 435 325 680 370 Help:Footer links


 * 1) circle centered at 20,313 of radius 14

circle 20 313 14 click the copyleft symbol

&lt;/imagemap&gt;

Inside the &lt;imagemap&gt; ... &lt;/imagemap&gt; tags, the first line is just the normal MediaWiki markup for inserting an image. 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. Any "poly" lines must come before any "rect" or "circle" lines, or it will not work correctly.