Skip to content
Get Divi Torque

Native Divi 5 ModulePro

Divi Hotspots

Interactive pins and tooltips on images.

Why use the Divi Hotspots module?

An annotated photo, product diagram or floor plan needs markers pinned to exact points with information that opens on hover or click. Stock Divi has no way to place a marker on a specific spot of an image.

Hotspots is a container module: one image, and one child item per marker. Each marker is positioned with a corner plus a pixel offset, and opens a tooltip with its own title, description and optional button.

Hover a marker on this photo to see the live module.

A dish with hotspot markers over its ingredients
N

Braised lamb shoulder

Slow-cooked for six hours.
N

Root vegetables

Roasted alongside the lamb.

What you get out of it

Precise positioningA corner plus a pixel offset on each axis, so a marker can sit anywhere on the image.Three marker typesIcon, text, or an uploaded image, chosen per marker.A rich tooltip per markerIts own media, title, description and an optional button.Hover or click to openTooltip Event decides whether the marker opens on mouseenter or click.A pulsing markeruseAnimation adds a wave effect that draws the eye to each spot.Native on Divi 5Ships in Divi Torque Pro. A Divi 4 layout using the same module converts across.

Everything the Divi Hotspots module does

Every option below ships in Divi Torque Pro.

A base image, with alt textOne item per markerMarker type: icon, text or imagePosition: corner plus a pixel offset on each axisMarker background and icon colourOptional pulse animation on the markerTooltip event: hover or clickTooltip placement relative to the markerTooltip media, title, description and an optional button

See the Divi Hotspots in action

This is the live module, real markers on a real photo. Hover either one to see the tooltip.

Two markers

Positioned by corner and offset, each with its own tooltip.

A dish with hotspot markers over its ingredients
N

Braised lamb shoulder

Slow-cooked for six hours.
N

Root vegetables

Roasted alongside the lamb.

Click instead of hover

Tooltip Event set to click, useful on touch devices where hover does not exist.

Click to open

The marker needs a tap or click, not a hover.

A dish with hotspot markers over its ingredients
N

Click here

This marker needs a click, not a hover.

Adding one takes a few minutes

Three steps, and none of them involve custom CSS.

1Drop in the moduleAdd Hotspots to any row and upload the base image.2Add the markersEach marker is a child item, positioned with a corner and a pixel offset against the image.3Write the tooltipTitle, description and an optional button are set per marker.

Questions people ask first

Short answers, all of them checked against what the module actually does.

Is the Hotspots module free?No. It ships in Divi Torque Pro. The free plugin does not include it.Does it need Divi 5?It is a native Divi 5 module. A Divi 4 layout using the same module converts across, since it shares the same shortcode.Can I drag markers into position on the front end?No. Position is typed X/Y values, placed by eye against the image inside the builder, not a drag-and-drop front-end interaction.Does it stop two markers overlapping?No. There is no collision detection; two markers with similar positions will overlap.Can the tooltip include a button?Yes. Use Button on the item adds one inside the tooltip.Will it work well on a touch device?Set Tooltip Event to click rather than hover for markers meant to work well on touch, since hover does not exist there.

Related modules

Other modules in the same plugin, included with every license.

Image Carousel

Build responsive image sliders with full controls.

Logo Carousel

Rotate client and partner logos elegantly.

Logo Grid

Display client, partner, or sponsor logos in a clean grid.

Get Hotspots and 78 more.

One license, every module and extension, native on Divi 5.

Unlock all 79 modules