Create interactive images with clickable hotspots, using modern image maps for WordPress. Perfect for floor plans, infographics, maps, and more.
Draw Attention® makes it easy to create interactive image maps for your website. Highlight sections of your images with hotspots so that users can click/tap or hover to read more information about each image map area. Show more content or direct the user to another URL upon clicking or hovering your hotspot.
The image map can contain more information such as images, text, shortcodes, gallery, video, audio, and more. Reveal more information on click/tap or hover. Create custom shapes for interactive hotspots directly on your original image.
Perfect for sketch maps, interactive floor plans for real estate, clickable infographics, interactive affiliate content, sketch annotations, image tutorials, product feature highlights on WooCommerce, and more.
Image Map Features:
Interactive image maps resize to fit your theme and the available screen size. Draw Attention works on all devices and adjusts your image to screens of any size. Works great on touch screens, such as tablet and mobile, too!
Image maps are accessible to everyone who visits your site, regardless of device or capabilities. Your content is accessible to screen readers. All highlightable hotspots can be accessed by keyboard commands. Anyone on any device can use your interactive image map.
Draw Attention is built with the principles of progressive enhancement in mind, so your content is accessible even to users who have JavaScript disabled and is SEO friendly, too! Draw Attention draws SVG shapes in modern browsers and falls back to a standard image map if JavaScript is disabled.
Easy to draw the highlightable areas of your image map – and easy to edit the shapes later too! Create the image map right from your WordPress dashboard. Place your interactive image map into any page or post with a simple shortcode, or use our convenient Beaver Builder module or WordPress Editor Block.
Draw complex shapes or perfect circles and rectangles. Use the new zoom and pan feature to get extra precise drawings of your clickable hotspots. Easily edit the shapes whenever you’d like or start from scratch at the click of a button.
The available drawing tools are:
Upgrade to Draw Attention Pro to get more features and customization options:
Need more than one interactive image map on your site? The Pro version allows unlimited highlightable areas on unlimited interactive images.
Show more info about highlighted image map areas in a variety of different layouts, including lightbox and tooltip.
Allow the image map hotspot areas to stay highlighted so visitors can see where they’re located, even when they aren’t clicked yet. The perfect way to show off your hotspots and make it clear that your images are interactive.
Use multiple highlight colors for the interactive image hotspots. If you choose to define multiple highlight styles, another section will pop up called, “Styles” where you can define your own color schemes within your image. Make each hotspot unique with it’s own color, border, and opacity settings!
Choose from one of 20 pre-defined color palettes or use your own custom color scheme on the image maps.
Upgrade to Draw Attention Pro Today! to get more features and customization options:
Hid the move to trash button.
Widget live preview
For older changelog entries, please see the additional changelog.txt file delivered with the plugin.
draw-attention.zip
from your computer[drawattention]
shortcode.The Pro version includes:
We have tutorials, videos and other helpful information on the Draw Attention website
To contact our support team, submit your message through our WordPress support forum. Or, visit our website’s Contact page.
If you’re using our Premium plugin, you can also use the License & Support
tab within the Draw Attention Pro plugin settings to send us a direct email.
We have a guide walkthrough of creating your first image available in our documentation.