Add Image Maps

This plugin allows authors to turn areas of an image into links by implementing HTML image maps in WordPress.

Authors can set up clickable areas on the image editing page, and see them outlined on the image. Images on the public-facing pages can use the map saved with them.

The plugin can attach image maps to featured and header images as well as images attached to content. Admins can configure where the plugin looks for images with maps, and how it interacts with responsive images.

How to use

1. Choose the image you wish to edit in the library.
2. Open it in the attachment edit page. (From “Attachment details”, click on “Edit more details”)
3. Click on “create image map for size ‘full'”
4. Add clickable areas, including alt text as well as links. (This is not a full GUI, but the areas are visible on the image, which is slightly greyed out when
   you edit the image maps.)
5. Click ‘update’ to save the image with the map.
6. Either:
   • Add the image to the desire page/post, and confirm it is “attached” (in the attachment edit screen or media list view), or
   • Make the image the page’s featured images, or
   • Set the image as a header

Configuration options

On the Admin settings page for the plugin, you can save CPU time by turning it off where you don’t need it. You can also decide whether to turn off the Image Maps Resizer that makes image maps responsive, and (for images with maps) WordPress’s own responsive images feature.

Credits

Image Map Resizer is © David Bradshaw, and incorporated under an MIT Expat license. The cover image uses The Garden of Eden, by Jan Brueghel.