How to
How to make an interactive image.
A five-minute guide to turning any picture into a clickable, hotspot-driven experience — then embedding it on any website.
Free forever plan · No credit card · Works in Wix, Webflow, WordPress, Shopify, Squarespace
The five steps
- Sign up for free. Create a free Interactive Image account. No credit card required.
- Upload your image. Drag your product photo, diagram, or render into the editor. Any resolution works.
- Click to place hotspots. Click anywhere on the image to drop a hotspot. Drag it to fine-tune the position.
- Write the popup content. Give each hotspot a title, description, and — optionally — an image, video, or CTA button.
- Copy the iframe. Open the Embed panel, copy the single iframe snippet, and paste it into any website that accepts HTML.
What image should you use?
Product photography, 3D renders, architectural drawings, floor plans, infographics, screenshots, and diagrams all work. Higher-resolution images give you more room to place fine-grained hotspots without them crowding each other.
Where the interactive image can live
Anywhere that accepts an iframe: Wix, Webflow, WordPress, Shopify, Squarespace, Ghost, Notion embeds, Framer, custom pages, internal tools, and email landing pages. The same source updates every place the iframe is pasted.
Frequently asked questions
How do I make an interactive image for free?
The Interactive Image free plan lets you publish one interactive image with unlimited hotspots. A small badge sits on the embed. Pro removes the badge and unlocks 500 images.
How do I make an interactive image in HTML?
Skip the raw <map>/<area> HTML — it is not responsive. Use Interactive Image to generate a single iframe that behaves correctly on every screen size.
Turn any image into a guided experience.
Free forever plan. Paste one iframe into your site and ship.
Create your interactive image