The steps to follow is set out below.
The Content Editor Web Part makes
displaying an image map on your page very simple.
1. Create an image to use for the image
map. (if you are using the
online tool, upload this image to the web)
2. Place the image on a blank HTML page within a web authoring program (online tool, ignore this), use the hotspot tool to create the hotspot areas on the image. You should end up with some code similar to the code below.
3. Copy the image map code created in your web authoring program to your clipboard
2. Place the image on a blank HTML page within a web authoring program (online tool, ignore this), use the hotspot tool to create the hotspot areas on the image. You should end up with some code similar to the code below.
3. Copy the image map code created in your web authoring program to your clipboard
" width="343" height="400" border="0" usemap="#Map" />
< map name="Map" id="Map">
< area shape="rect" coords="36,221,154,245" href=" " alt=" " />
< area shape="rect" coords="187,209,300,231" href=" alt=" " />
< /map>
4. Navigate to your picture library within
your SharePoint site and upload the image.
5. Navigate to the page on your SharePoint site to display the image map and insert a content editor web part
6. Go to Site Actions > Edit Page > Modify Shared Web Part > Source Editor – Insert the code you copied to your clipboard.
7. You will need to change the image source to the URL of the image you uploaded to your picture library in step 4
8. You may want to change the chrome type to None. Go to Site Actions > Edit Page > Modify Shared Web Part > Appearance > Chrome Type = None
5. Navigate to the page on your SharePoint site to display the image map and insert a content editor web part
6. Go to Site Actions > Edit Page > Modify Shared Web Part > Source Editor – Insert the code you copied to your clipboard.
7. You will need to change the image source to the URL of the image you uploaded to your picture library in step 4
8. You may want to change the chrome type to None. Go to Site Actions > Edit Page > Modify Shared Web Part > Appearance > Chrome Type = None
