How to
How to add hotspots to an image.
Turn a static picture into a clickable, guided experience with clean markers, rich popups, and a single iframe embed.
Free forever plan · No credit card · Works in Wix, Webflow, WordPress, Shopify, Squarespace
The six steps
- Upload the image. Drop the image into a new project inside Interactive Image.
- Enter add mode. Click the Add hotspot button. Your cursor turns into a crosshair.
- Click to place hotspots. Click anywhere on the image to drop a hotspot. Drag it to fine-tune the exact position.
- Write the popup. Give the hotspot a title, description, optional image or video, and an optional CTA button.
- Style the markers. Choose dot, numbered, pin, or plus. Set the global color, then override any hotspot individually.
- Embed it. Copy the iframe and paste it into your website.
Which marker style should you pick?
- Dot — clean, minimal, great for product photography.
- Numbered — best for guided tours or step-by-step diagrams.
- Pin — familiar map-pin metaphor for locations or floor plans.
- Plus — subtle, works well over dense technical drawings.
Frequently asked questions
How many hotspots can I add?
Unlimited on every image, on every plan.
Can I make one hotspot look different from the others?
Yes. Every hotspot can override the global color, and each can carry its own image, video, and CTA button.
Turn any image into a guided experience.
Free forever plan. Paste one iframe into your site and ship.
Create your interactive image