NewThe Supreme Bundle: every Divi Supreme plugin, 31% less than buying separately.See what’s inside →

Image Hotspots module

Divi Image Hotspots that explain every detail.

Pin markers on an image and reveal a tooltip on hover or click. Great for products, rooms, maps and diagrams.

Linen sofa

Three seats, washable covers. £1,290

Floor lamp

Brass, dimmable. £240

Wool rug

Hand-woven, 200 x 300cm. £680

What is the Divi Image Hotspots module?

Image Hotspots is a Divi 5 module in Divi Supreme Pro that places markers on an image. Each marker can be an icon, a small image or a text label, and can show a tooltip with a heading and text.

Set each marker’s position in percent so it stays put on any screen, choose where its tooltip opens, and add a pulse to draw the eye. Pick a hover or click trigger, five tooltip animations, delays, width and colours.

marker types

tooltip animations

tooltip placements

custom code

Start from a Image Hotspots recipe.

The recipes and the playground run on the front end. Use Preview, or open the page, to try them.

Try every Image Hotspots setting.

The recipes and the playground run on the front end. Use Preview, or open the page, to try them.

Drag a hotspot to move it.

Everything Image Hotspots can do.

Icon, image or text

Use a Divi icon, a small image, or a text label like a number.

Percent positions

Left and top in percent, so markers stay in place at every screen size.

Tooltips

A heading and text per marker, placed top, right, bottom or left.

Five animations

Fade, Scale, Shift Away, Shift Toward or Perspective, with show and hide delays.

Hover or click

Open tooltips on hover, or on click for touch-friendly layouts.

Pulse and colours

A pulsing ring, icon colours and sizes, and tooltip colours per marker.

Image Hotspots documentation

Setup for Divi 5: image, markers and positions, tooltips, trigger, animation and pulse.

Questions about Image Hotspots.

How do I place a hotspot?

Add an item and set its Left Position and Top Position in percent. 50% and 50% puts it in the centre of the image.

What can a hotspot look like?

An icon, a small image or text, such as a number. Each has its own size and colours.

Can tooltips open on click?

Yes. Set Trigger Event to Click. Hover is the default.

Which tooltip animations are there?

Fade, Scale, Shift Away, Shift Toward and Perspective. You can also set show and hide delays.

Can one hotspot look different?

Yes. Each item can override the icon colour, size, tooltip background, placement and max width.

What is the pulse animation?

A soft ring that grows and fades around the marker to show it is interactive. Turn it on per item.

Does Image Hotspots work with Divi 5 and WPML?

Yes. It is a native Divi 5 module, tooltip text supports dynamic content, and it can be translated with WPML.

Next module, A to Z

Image Hover Reveal Module

Related modules

Circle Info Module

Items around a circle with centre content.

Image Hover Reveal Module

Reveal a second image on hover.

Page Tour Module

Guided tours of your page.

4.9 out of 5

Rated 4.9 by Divi designers on Trustpilot. Running on 350,000+ sites.

Let your images do the explaining.

Image Hotspots comes with 70+ Divi 5 modules and 16 extensions in Divi Supreme Pro.

Divi Supreme