Draw Attention Pro: Responsive Interactive Image Maps

Mark image regions for exploration

Draw Attention Pro is the paid edition of Draw Attention, an interactive image map plugin for WordPress. Add hotspots to specific parts of an image so users can explore floor plans, trade show maps, infographics, product tours, tutorials, sketches, affiliate content, or WooCommerce product capabilities.

In the WordPress dashboard, use the drawing tools to make polygon, rectangle, or circle hotspots. Zoom and pan help with placement. You can edit shapes later or recreate them when an image map changes.

Choose a response for each hotspot

A highlighted area can reveal information when a user clicks or taps it, or when they move a mouse over it. Add text, images, shortcodes, galleries, video, audio, or other content. If the area should take visitors elsewhere, link it to another URL.

Present annotations in a tooltip or lightbox. Hotspots can stay highlighted so visitors can spot interactive regions before selecting them. Each area can also have its own color, border, and opacity options.

Use separate maps or add more areas

Create multiple image maps for different properties, products, diagrams, locations, or sections of a visual guide. Each map supports an unlimited number of highlightable areas. Choose from 20 preset color palettes or set a custom color scheme.

Maps resize to fit the theme and available screen size, including tablet and mobile shows.

Keyboard and screen reader access

Hotspots can be reached with keyboard commands, and their content is available to screen readers. When JavaScript is disabled, a standard image map fallback keeps the content accessible.

Publish an image map

Add the finished map to a page or post with a shortcode, the WordPress Editor Block, or the Beaver Builder module. These options support interactive visuals in landing pages, product information, documentation, blog content, and property listings.

Installation and setup

Install Draw Attention Pro in WordPress, open it in the dashboard, and create an interactive image. Upload or select the image, draw the polygon, rectangle, or circle hotspots, then add content, links, colors, and show settings for each area. Publish the map with a shortcode, block, or Beaver Builder module, then review it on desktop and touch devices.