Learning Center

Find answers to all your questions

How Do I Create An Image Map?

WARNING: This is an advanced article and if the code is used incorrectly, it may break your page.

Using the image map creator below follow these steps.

Step 1, upload your image to the webdrive. Once uploaded, right click and copy URL. Paste the URL in the input Box. Next click accept

Step 2, in the drop down for your area, select which shape you want to draw with: (Rectangle, Polygon or Circle). Choose your link, alt text and target.

Step 3, Draw your areas one at a time. You can go back and edit/reposition the areas. If using the polygon shape, you will need to use SHIFT + click to set your last point.

Step 4, Copy your html code and paste it into an HTML weblet. Click here to learn how to add html code to a weblet.

In the HTML code, you will have to replace the image source
“REPLACE_WITH_YOUR_IMAGE_URL”
with a URL to your image used in step 1

<img src="REPLACE_WITH_YOUR_IMAGE_URL" id="myImageMap" usemap="myImageMap">

On a mac, copy is command + C, and on a PC it is CRTL + C

Back To Top
ARTICLE FEEDBACK

Let us know your thoughts on this article

Please tell us what do you think, any kind of feedback is highly appreciated.

All fields required

Please leave this field empty.

×
ARTICLE REQUEST

Article Request

Is there an article you cant find or would like to see? Let us know.

Please leave this field empty.

×