Make any product photo shoppable

Product Hotspots lets you place interactive pins anywhere on an image. Each pin links to a WooCommerce product and opens a beautiful glass-card tooltip with the product photo, live price, and an Add to Cart button — perfect for fashion lookbooks, furniture room shots, and technical part callouts.

Landing Page: producthotspots.webkodingtheme.com
Frontend Demo: producthotspots.webkodingtheme.com/wp/hotspot-demo
WP Admin Demo: producthotspots.webkodingtheme.com/wp/wp-admin
Admin credentials: demo / ProductHotspotsDemo!

A visual builder, not a settings form

Open the map editor and you get a real drag-and-drop canvas. Click to add a pin, drag to reposition it, and search your catalog to link a product in seconds. Set each pin’s color, size, and pulse animation, then preview instantly. No coding, no coordinates by hand.

Product Hotspots features: builder, WooCommerce search, AJAX add to cart, themes, mobile, RTL

Key features

Visual hotspot builder — Drag-and-drop pin placement with live preview in the WordPress admin.
WooCommerce integration — Search and link any published product; price and stock are pulled live at render time.
AJAX add to cart — Simple products are added straight from the tooltip with a success toast and cart-count update.
Glass-card tooltips — Light, Dark, and Minimal themes with a smooth scale-in animation.
Mobile optimised — On phones the tooltip becomes a full-width bottom sheet.
Accessible — Keyboard navigation, focus-visible rings, Escape-to-close, and reduced-motion support.

Works with Gutenberg block, Elementor widget, shortcode, and any WordPress theme

Native everywhere you build

Insert a map with the dedicated Gutenberg block, the Elementor widget (free and pro), or the [wiph_hotspot id=”X”] shortcode in any page builder, widget, or template. Each map is fully self-contained and isolated, so you can place several on one page without conflicts.

Three tooltip themes — Light, Dark, and Minimal

Designed to match your store

Pick Light, Dark, or Minimal per map, set the tooltip position, and toggle price or the Add to Cart button. On mobile the tooltip automatically becomes a bottom sheet for comfortable tapping, and the whole component is print-safe and RTL-aware.

Roadmap

Planned for upcoming versions: variation picker inside the tooltip, “add the whole look to cart”, hotspot click analytics, more tooltip templates, and WooCommerce wishlist integration. CSV bulk hotspot import and multi-image carousels are on the longer-term list.

Requirements

WordPress 6.0+ WooCommerce 7.0+ PHP 7.4+ (PHP 8 ready) HPOS compatible.

Support

Friendly support for setup questions and bug reports through our Envato profile. Detailed documentation is included with the download.

License

Regular License — use in a single end product that is free for end users.
Extended License — use in a single end product that end users are charged for.
For full terms see Envato Standard Licenses.

Changelog

v1.0.0
– Initial release
– Visual drag-and-drop hotspot builder
– AJAX add to cart, 3 tooltip themes, pulse animation
– Gutenberg block, Elementor widget, and shortcode
– Mobile bottom-sheet, RTL, and translation ready

Interactive Product Image for WooCommerce WordPress Plugin