See also:
Introduction[]
Imagemaps are basically putting links on images, to make signatures, or things similar to those. They are often used to create an interactive experience, or to save time from coding links and backgrounds, etc. You can use sites like canva to create a base image to put links on, and then upload it to the wiki.
To position the links, you position them based by using the starting point—which is the top left—and then put _px to start moving the link.
Code[]
Rectangular Imagemap[]
The code for an image map is:
<imagemap> Image:THE TEXT GOES HERE.png|200px rect 300 380 660 210 [[Link Modification]] desc none </imagemap>
Output:
This code is for a rectangle-shaped link over an image. If you hover your cursor around the 'text' part of the image and you click it, then it will take you to the link modifications page.
Circular Imagemap[]
You can also do circular-shaped links, using this code:
<imagemap> Image:THE TEXT GOES HERE.png|200px circle 50 100 50 [[Link Modification]] desc none </imagemap>
Output:
Image Ratio[]
Imagemaps are often challenging for those unexperienced with them, as there is a lot of estimating and guess-and-checking to get the correct number of pixels. A site that could be helpful would be Pixlr Image modifier to fix this. Simply upload an image like you're going to edit it. Then, make the image fill the whole canvas. In the corner, you can view the pixels! This isn't always accurate because of the size of the picture, but it gives you the correct ratio for the pixels.
